fix(vscode): address accessibility coverage feedback

.github/workflows/visual-regression.yml

@@ -26,7 +26,7 @@ jobs:
               - "packages/kilo-vscode/.storybook/**"
               - "packages/kilo-vscode/tests/visual-regression*"
               - "packages/kilo-vscode/tests/permission-dock-dropdown*"
-              - "packages/kilo-vscode/tests/accessibility*"
+              - "packages/kilo-vscode/tests/accessibility*" # kilocode_change
               - "packages/kilo-docs/public/img/screenshot-tests/**"
               - ".github/workflows/visual-regression.yml"
       - name: Check if PR is from a fork
@@ -278,7 +278,7 @@ jobs:
         run: bun run build-storybook
         working-directory: packages/kilo-vscode
 
-      - name: Generate baselines and enforce webview accessibility checks
+      - name: Generate baselines and enforce webview accessibility checks # kilocode_change
         run: bun run test:visual:update
         working-directory: packages/kilo-vscode
         env:

packages/kilo-vscode/script/launch.ts

@@ -271,8 +271,10 @@ function settings(keep: boolean, enabled: boolean) {
   }
 
   mkdirSync(dir, { recursive: true })
-  const cfg = keep && existsSync(file) ? { ...defaults, ...load(file) } : defaults
-  if (enabled) cfg["editor.accessibilitySupport"] = "on"
+  const cfg =
+    keep && existsSync(file)
+      ? { ...defaults, ...load(file), ...(enabled ? { "editor.accessibilitySupport": "on" } : {}) }
+      : defaults
 
   writeFileSync(file, JSON.stringify(cfg, null, 2) + "\n")
 }

packages/kilo-vscode/tests/accessibility.spec.ts

@@ -1,5 +1,5 @@
 import AxeBuilder from "@axe-core/playwright"
-import { expect, test, type Page } from "@playwright/test"
+import { expect, test, type Locator, type Page } from "@playwright/test"
 
 const GLOBALS = "colorScheme:dark;theme:kilo-vscode;vscodeTheme:dark-modern"
 const RULES = ["wcag2a", "wcag2aa", "wcag21a", "wcag21aa", "wcag22a", "wcag22aa"]
@@ -33,6 +33,13 @@ async function scan(page: Page) {
   expect(result.violations, details).toEqual([])
 }
 
+async function reach(page: Page, target: Locator) {
+  for (let step = 0; step < 10; step++) {
+    await page.keyboard.press("Tab")
+    if (await target.evaluate((node) => node === document.activeElement)) return
+  }
+}
+
 test.describe("webview accessibility ratchet", () => {
   for (const story of STORIES) {
     test(`${story.name} passes automated WCAG checks`, async ({ page }) => {
@@ -45,7 +52,7 @@ test.describe("webview accessibility ratchet", () => {
     await open(page, "profile--not-logged-in")
 
     const login = page.getByRole("button", { name: "Login with Kilo Code" })
-    await page.keyboard.press("Tab")
+    await reach(page, login)
     await expect(login).toBeFocused()
 
     await login.evaluate((node) => {