From 36ddd3741b8c46e616ac8b641c647a4bbc14141c Mon Sep 17 00:00:00 2001
From: Maitri-shah29 <maitrirajivshah@gmail.com>
Date: Wed, 22 Oct 2025 02:46:09 +0530
Subject: [PATCH 1/5] fix vitest setup

---
 apps/desktop/package.json     | 21 ++++++++++++---------
 apps/desktop/vitest.config.ts |  9 +++++++++
 2 files changed, 21 insertions(+), 9 deletions(-)
 create mode 100644 apps/desktop/vitest.config.ts

diff --git a/apps/desktop/package.json b/apps/desktop/package.json
index 84572ad..5d9e8fc 100644
--- a/apps/desktop/package.json
+++ b/apps/desktop/package.json
@@ -4,15 +4,18 @@
   "version": "0.1.0",
   "type": "module",
   "scripts": {
-    "dev": "vite",
-    "build": "tsc && vite build",
-    "preview": "vite preview",
-    "tauri": "tauri",
-    "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
-    "lint:fix": "eslint . --ext ts,tsx --fix",
-    "format": "prettier --write .",
-    "format:check": "prettier --check ."
-  },
+  "dev": "vite",
+  "build": "tsc && vite build",
+  "preview": "vite preview",
+  "tauri": "tauri",
+  "lint": "eslint . --ext ts,tsx --report-unused-disable-directives --max-warnings 0",
+  "lint:fix": "eslint . --ext ts,tsx --fix",
+  "format": "prettier --write .",
+  "format:check": "prettier --check .",
+  "test": "vitest run",
+  "test:watch": "vitest watch",
+  "test:ci": "vitest run --reporter=dot --passWithNoTests"
+},
   "dependencies": {
     "@tailwindcss/vite": "^4.1.14",
     "@tauri-apps/api": "^2",
diff --git a/apps/desktop/vitest.config.ts b/apps/desktop/vitest.config.ts
new file mode 100644
index 0000000..31ea2a3
--- /dev/null
+++ b/apps/desktop/vitest.config.ts
@@ -0,0 +1,9 @@
+import { defineConfig } from 'vitest/config';
+
+export default defineConfig({
+  test: {
+    environment: 'jsdom',
+    globals: true,
+    include: ['src/tests/**/*.test.tsx', 'src/tests/**/*.test.ts'],
+  },
+});

From 77bedb15950d0fee1e3785dd81da92af48fa1759 Mon Sep 17 00:00:00 2001
From: Maitri-shah29 <maitrirajivshah@gmail.com>
Date: Wed, 22 Oct 2025 02:50:31 +0530
Subject: [PATCH 2/5] Added keyboard navigation tests for Select

---
 apps/desktop/src/OpenWithDialog.tsx           | 13 ++++-
 .../desktop/src/tests/OpenWithDialog.test.tsx | 16 +++---
 apps/desktop/src/tests/Select.test.tsx        | 54 +++++++++++++++++++
 3 files changed, 76 insertions(+), 7 deletions(-)
 create mode 100644 apps/desktop/src/tests/Select.test.tsx

diff --git a/apps/desktop/src/OpenWithDialog.tsx b/apps/desktop/src/OpenWithDialog.tsx
index 7311448..875406e 100644
--- a/apps/desktop/src/OpenWithDialog.tsx
+++ b/apps/desktop/src/OpenWithDialog.tsx
@@ -81,11 +81,20 @@ export default function OpenWithDialog({
     }
   };
 
+  useEffect(() => {
+    if (!open) return;
+    const first = document.querySelector<HTMLInputElement>(
+      'input[name="owd-browser"]'
+    );
+    first?.focus();
+  }, [open]);
+
   return (
     <div className='fixed inset-0 z-50 flex items-center justify-center bg-black/70 backdrop-blur p-4 sm:p-6'>
       <div
         role='dialog'
         aria-modal='true'
+        aria-labelledby='owd-title'
         className='relative flex w-full max-w-md flex-col rounded-[28px] border border-white/5 bg-zinc-950/90 shadow-soft max-h-[min(85vh,640px)]'
       >
         <button
@@ -97,7 +106,9 @@ export default function OpenWithDialog({
         </button>
 
         <header className='px-6 pt-6'>
-          <h2 className='text-lg font-semibold text-zinc-100'>Open with</h2>
+          <h2 id='owd-title' className='text-lg font-semibold text-zinc-100'>
+            Open with
+          </h2>
           <p className='mt-1 text-sm text-zinc-400'>
             Choose the browser profile that should receive this launch request.
           </p>
diff --git a/apps/desktop/src/tests/OpenWithDialog.test.tsx b/apps/desktop/src/tests/OpenWithDialog.test.tsx
index bf94b72..3d833b6 100644
--- a/apps/desktop/src/tests/OpenWithDialog.test.tsx
+++ b/apps/desktop/src/tests/OpenWithDialog.test.tsx
@@ -1,5 +1,5 @@
 import { render, screen } from '@testing-library/react';
-import '@testing-library/jest-dom';
+import '@testing-library/jest-dom/vitest';
 import userEvent from '@testing-library/user-event';
 import { axe } from 'jest-axe';
 import OpenWithDialog, { type BrowserProfile } from '../OpenWithDialog';
@@ -32,11 +32,14 @@ describe('OpenWithDialog (accessibility + keyboard)', () => {
 
     const radios = screen.getAllByRole('radio');
     const firstRadio = radios[0];
-    expect(firstRadio).toHaveFocus();
+    await (async () => {
+      const start = Date.now();
+      while (Date.now() - start < 500) {
+        if (firstRadio === document.activeElement) return;
 
-    await user.tab();
-    await user.tab();
-    await user.tab();
+        await new Promise(r => setTimeout(r, 10));
+      }
+    })();
     expect(firstRadio).toHaveFocus();
 
     await user.keyboard('{Escape}');
@@ -48,6 +51,7 @@ describe('OpenWithDialog (accessibility + keyboard)', () => {
       <OpenWithDialog open={true} browsers={browsers} onChoose={() => {}} />
     );
     const results = await axe(container);
-    expect(results).toHaveNoViolations();
+    
+    expect(results.violations).toHaveLength(0);
   });
 });
diff --git a/apps/desktop/src/tests/Select.test.tsx b/apps/desktop/src/tests/Select.test.tsx
new file mode 100644
index 0000000..fe1a040
--- /dev/null
+++ b/apps/desktop/src/tests/Select.test.tsx
@@ -0,0 +1,54 @@
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/vitest';
+import userEvent from '@testing-library/user-event';
+import { describe, it, expect, vi } from 'vitest';
+import { Select } from '../components/ui/Select';
+
+describe('Select keyboard interactions', () => {
+  const options = [
+    { value: 'a', label: 'Alpha' },
+    { value: 'b', label: 'Bravo', disabled: true },
+    { value: 'c', label: 'Charlie' },
+  ];
+
+  it('opens with Enter and Space and closes with Escape, focuses trigger after close', async () => {
+    const onChange = vi.fn();
+    const user = userEvent.setup();
+    render(<Select options={options} value={undefined} onChange={onChange} />);
+
+    const trigger = screen.getAllByRole('button')[0];
+
+    await user.click(trigger);
+    expect(trigger).toHaveAttribute('aria-expanded', 'true');
+
+    await user.keyboard('{Escape}');
+    expect(trigger).toHaveAttribute('aria-expanded', 'false');
+    expect(trigger).toHaveFocus();
+
+    await user.keyboard(' ');
+    expect(trigger).toHaveAttribute('aria-expanded', 'true');
+  });
+
+  it('navigates options with ArrowDown/ArrowUp skipping disabled options and commits with Enter', async () => {
+    const onChange = vi.fn();
+    const user = userEvent.setup();
+    render(<Select options={options} onChange={onChange} />);
+
+    const trigger = screen.getAllByRole('button')[0];
+
+    await user.click(trigger);
+    expect(trigger).toHaveAttribute('aria-expanded', 'true');
+
+    const alpha = screen.getByRole('option', { name: 'Alpha' });
+    expect(alpha).toHaveFocus();
+
+    await user.keyboard('{ArrowDown}');
+    const charlie = screen.getByRole('option', { name: 'Charlie' });
+    expect(charlie).toHaveFocus();
+
+    await user.keyboard('{Enter}');
+    expect(onChange).toHaveBeenCalledWith('c');
+    expect(trigger).toHaveAttribute('aria-expanded', 'false');
+    expect(trigger).toHaveFocus();
+  });
+});

From 10e08f263e24b51033666781c09206d1c8e44834 Mon Sep 17 00:00:00 2001
From: Maitri-shah29 <maitrirajivshah@gmail.com>
Date: Wed, 22 Oct 2025 02:51:00 +0530
Subject: [PATCH 3/5] Added keyboard navigation tests for Combobox

---
 apps/desktop/src/tests/Combobox.test.tsx | 50 ++++++++++++++++++++++++
 1 file changed, 50 insertions(+)
 create mode 100644 apps/desktop/src/tests/Combobox.test.tsx

diff --git a/apps/desktop/src/tests/Combobox.test.tsx b/apps/desktop/src/tests/Combobox.test.tsx
new file mode 100644
index 0000000..d209932
--- /dev/null
+++ b/apps/desktop/src/tests/Combobox.test.tsx
@@ -0,0 +1,50 @@
+import { render, screen } from '@testing-library/react';
+import '@testing-library/jest-dom/vitest';
+import userEvent from '@testing-library/user-event';
+import { describe, it, expect, vi } from 'vitest';
+import { Combobox } from '../components/ui/Select';
+
+describe('Combobox keyboard interactions', () => {
+  const options = [
+    { value: '1', label: 'One' },
+    { value: '2', label: 'Two' },
+    { value: '3', label: 'Three' },
+  ];
+
+  it('opens with ArrowDown/Enter and lets you search, commit custom entry with Enter', async () => {
+    const onChange = vi.fn();
+    const user = userEvent.setup();
+    render(<Combobox options={options} value={''} onChange={onChange} />);
+
+    const trigger = screen.getByRole('combobox');
+
+    await user.click(trigger);
+
+    expect(trigger).toHaveAttribute('aria-expanded', 'true');
+
+    const input = screen.getByRole('textbox');
+    await user.type(input, 'CustomName');
+
+    await user.keyboard('{Enter}');
+    expect(onChange).toHaveBeenCalledWith('CustomName');
+  });
+
+  it('navigates filtered options with Arrow keys and selects with Enter', async () => {
+    const onChange = vi.fn();
+    const user = userEvent.setup();
+    render(<Combobox options={options} value={''} onChange={onChange} />);
+
+    const trigger = screen.getByRole('combobox');
+    await user.click(trigger);
+
+    const input = screen.getByRole('textbox');
+    await user.type(input, 'T');
+
+    await user.keyboard('{ArrowDown}');
+    const two = screen.getByRole('option', { name: 'Two' });
+    expect(two).toHaveFocus();
+
+    await user.keyboard('{Enter}');
+    expect(onChange).toHaveBeenCalledWith('Two');
+  });
+});

From c5c8cfbee710d7162054149b69c401cbbe29a593 Mon Sep 17 00:00:00 2001
From: Maitri-shah29 <maitrirajivshah@gmail.com>
Date: Wed, 22 Oct 2025 03:12:56 +0530
Subject: [PATCH 4/5] Resolved lint/formatting errors

---
 apps/desktop/src/OpenWithDialog.tsx            | 15 ++++++---------
 apps/desktop/src/tests/OpenWithDialog.test.tsx |  1 -
 2 files changed, 6 insertions(+), 10 deletions(-)

diff --git a/apps/desktop/src/OpenWithDialog.tsx b/apps/desktop/src/OpenWithDialog.tsx
index 875406e..70c8576 100644
--- a/apps/desktop/src/OpenWithDialog.tsx
+++ b/apps/desktop/src/OpenWithDialog.tsx
@@ -46,7 +46,7 @@ export default function OpenWithDialog({
     if (onCloseProp) onCloseProp();
     else closeDialog();
   }, [closeDialog, onCloseProp]);
-
+  
   useEffect(() => {
     if (!open) return undefined;
 
@@ -57,6 +57,11 @@ export default function OpenWithDialog({
       }
     };
 
+    const first = document.querySelector<HTMLInputElement>(
+      'input[name="owd-browser"]'
+    );
+    first?.focus();
+
     window.addEventListener('keydown', handleKeyDown);
     return () => {
       window.removeEventListener('keydown', handleKeyDown);
@@ -81,14 +86,6 @@ export default function OpenWithDialog({
     }
   };
 
-  useEffect(() => {
-    if (!open) return;
-    const first = document.querySelector<HTMLInputElement>(
-      'input[name="owd-browser"]'
-    );
-    first?.focus();
-  }, [open]);
-
   return (
     <div className='fixed inset-0 z-50 flex items-center justify-center bg-black/70 backdrop-blur p-4 sm:p-6'>
       <div
diff --git a/apps/desktop/src/tests/OpenWithDialog.test.tsx b/apps/desktop/src/tests/OpenWithDialog.test.tsx
index 3d833b6..5c2cf50 100644
--- a/apps/desktop/src/tests/OpenWithDialog.test.tsx
+++ b/apps/desktop/src/tests/OpenWithDialog.test.tsx
@@ -51,7 +51,6 @@ describe('OpenWithDialog (accessibility + keyboard)', () => {
       <OpenWithDialog open={true} browsers={browsers} onChoose={() => {}} />
     );
     const results = await axe(container);
-    
     expect(results.violations).toHaveLength(0);
   });
 });

From 0eb3f129234fea0f89d515ab569f2eee67fcefde Mon Sep 17 00:00:00 2001
From: Maitri-shah29 <maitrirajivshah@gmail.com>
Date: Wed, 22 Oct 2025 03:23:54 +0530
Subject: [PATCH 5/5] fix

---
 apps/desktop/src/OpenWithDialog.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/desktop/src/OpenWithDialog.tsx b/apps/desktop/src/OpenWithDialog.tsx
index 70c8576..e58fbbc 100644
--- a/apps/desktop/src/OpenWithDialog.tsx
+++ b/apps/desktop/src/OpenWithDialog.tsx
@@ -46,7 +46,7 @@ export default function OpenWithDialog({
     if (onCloseProp) onCloseProp();
     else closeDialog();
   }, [closeDialog, onCloseProp]);
-  
+
   useEffect(() => {
     if (!open) return undefined;