Harden frontend test isolation per PR #86 review

Mock showConfirm in export tests, verify in-flight export button state,
key session fetch mocks by session ID, tighten file_read assertion,
add global stub cleanup across test files, and await clipboard write
assertion defensively.

Author: clean6378-max-it

static/js/app.test.js

@@ -1,4 +1,4 @@
-import { beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterAll, beforeAll, beforeEach, describe, expect, it, vi } from 'vitest';
 import { state } from './shared/state.js';
 
 const showProjects = vi.fn();
@@ -19,13 +19,21 @@ vi.mock('./shared/theme.js', () => ({
 }));
 
 describe('router (app.js)', () => {
+    const origScrollTo = window.scrollTo;
+    const origScrollIntoView = Element.prototype.scrollIntoView;
+
     beforeAll(async () => {
         window.scrollTo = vi.fn();
         Element.prototype.scrollIntoView = vi.fn();
         await import('./app.js');
         document.dispatchEvent(new Event('DOMContentLoaded'));
     });
 
+    afterAll(() => {
+        window.scrollTo = origScrollTo;
+        Element.prototype.scrollIntoView = origScrollIntoView;
+    });
+
     beforeEach(() => {
         document.body.innerHTML = '<div id="content"></div><span id="footer-year"></span>';
         state.currentProject = null;

static/js/export.test.js

@@ -1,8 +1,15 @@
 import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
-import { bulkExport, downloadSession } from './export.js';
 
 vi.mock('./projects.js', () => ({ showProjects: vi.fn() }));
+vi.mock('./shared/utils.js', async (importOriginal) => {
+    const actual = await importOriginal();
+    return {
+        ...actual,
+        showConfirm: vi.fn((_, cb) => { cb(); }),
+    };
+});
 
+import { bulkExport, downloadSession } from './export.js';
 import { showProjects } from './projects.js';
 
 const mockWritable = {
@@ -30,30 +37,28 @@ describe('export', () => {
     });
 
     afterEach(() => {
+        vi.unstubAllGlobals();
         vi.restoreAllMocks();
     });
 
-    async function confirmExport() {
-        const ok = document.querySelector('.confirm-ok');
-        expect(ok).not.toBeNull();
-        ok.click();
-        await vi.waitFor(() => expect(fetch).toHaveBeenCalled());
-    }
-
     it('bulkExport shows progress then completes on success', async () => {
-        fetch.mockResolvedValue({
+        let resolveFetch;
+        const pending = new Promise((resolve) => { resolveFetch = resolve; });
+        fetch.mockImplementation(() => pending.then(() => ({
             ok: true,
             headers: { get: () => 'application/zip' },
             blob: () => Promise.resolve(new Blob(['zip'], { type: 'application/zip' })),
-        });
+        })));
 
         bulkExport('all');
         const btn = document.getElementById('btn-export-all');
-        expect(btn.disabled).toBe(false);
-        await confirmExport();
+        await vi.waitFor(() => expect(btn.disabled).toBe(true));
+        expect(btn.textContent).toContain('Exporting');
+
+        resolveFetch();
+        await vi.waitFor(() => expect(btn.disabled).toBe(false));
 
         expect(btn.textContent.trim()).toBe('Export all');
-        expect(btn.disabled).toBe(false);
         expect(mockHandle.createWritable).toHaveBeenCalled();
         expect(showProjects).toHaveBeenCalled();
         expect(fetch).toHaveBeenCalledWith('/api/export', expect.objectContaining({
@@ -71,7 +76,6 @@ describe('export', () => {
         });
 
         bulkExport('all');
-        await confirmExport();
         await vi.waitFor(() => expect(document.querySelector('.toast-error')).not.toBeNull());
 
         expect(document.querySelector('.toast-error').textContent).toContain('export failed');
@@ -86,7 +90,6 @@ describe('export', () => {
         });
 
         bulkExport('incremental');
-        await confirmExport();
         await vi.waitFor(() => expect(document.querySelector('.toast-error')).not.toBeNull());
 
         expect(document.querySelector('.toast-error').textContent).toContain('Export failed: 403');

static/js/projects.test.js

@@ -1,4 +1,4 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { showProjects } from './projects.js';
 
 // ProjectDict[] — mirrors models/project.py.
@@ -25,6 +25,10 @@ describe('showProjects', () => {
         vi.stubGlobal('fetch', vi.fn());
     });
 
+    afterEach(() => {
+        vi.unstubAllGlobals();
+    });
+
     it('renders project cards from the API response', async () => {
         fetch.mockImplementation((url) => {
             if (url === '/api/projects') {

static/js/render/tool_result/file_read.test.js

@@ -19,6 +19,6 @@ describe('renderFileReadResult', () => {
             file_path: 'README.md',
         });
         expect(html).toContain('Read: README.md');
-        expect(html).not.toContain('lines');
+        expect(html).not.toMatch(/\d+ lines/);
     });
 });

static/js/search.test.js

@@ -1,4 +1,4 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { showSearchPage, doSearch } from './search.js';
 
 // SearchHitDict[] — mirrors models/search.py (no highlight wrapper in search.js; snippets are escaped text only).
@@ -28,6 +28,10 @@ describe('search page', () => {
         window.location.hash = '';
     });
 
+    afterEach(() => {
+        vi.unstubAllGlobals();
+    });
+
     it('showSearchPage renders the search UI and sets hash', () => {
         showSearchPage();
         expect(window.location.hash).toBe('#search');

static/js/sessions.test.js

@@ -1,4 +1,4 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 import { state } from './shared/state.js';
 import { showWorkspace, loadSession, selectSession, copyAll } from './sessions.js';
 
@@ -62,7 +62,16 @@ function mockWorkspaceFetch() {
             return Promise.resolve({ ok: true, json: () => Promise.resolve(SESSION_LIST) });
         }
         if (url.startsWith('/api/sessions/alpha/')) {
-            return Promise.resolve({ ok: true, json: () => Promise.resolve(SESSION_DETAIL) });
+            const sessionId = decodeURIComponent(url.split('/').pop());
+            const row = SESSION_LIST.find((s) => s.id === sessionId) ?? SESSION_LIST[0];
+            return Promise.resolve({
+                ok: true,
+                json: () => Promise.resolve({
+                    ...SESSION_DETAIL,
+                    session_id: sessionId,
+                    title: row.title,
+                }),
+            });
         }
         return Promise.reject(new Error(`unexpected fetch: ${url}`));
     });
@@ -78,6 +87,10 @@ describe('sessions workspace', () => {
         window.location.hash = '';
     });
 
+    afterEach(() => {
+        vi.unstubAllGlobals();
+    });
+
     it('showWorkspace populates the sidebar with session entries', async () => {
         mockWorkspaceFetch();
         await showWorkspace('alpha');
@@ -142,6 +155,6 @@ describe('sessions workspace', () => {
 
         copyAll();
 
-        expect(writeText).toHaveBeenCalledWith('Line one\nLine two');
+        await vi.waitFor(() => expect(writeText).toHaveBeenCalledWith('Line one\nLine two'));
     });
 });