npm - playwriter - Versions diffs - 0.0.63 → 0.0.89 - Mend

playwriter 0.0.63 → 0.0.89

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (223) hide show

package/dist/a11y-client.js +18 -8
package/dist/aria-snapshot.d.ts +41 -3
package/dist/aria-snapshot.d.ts.map +1 -1
package/dist/aria-snapshot.js +134 -55
package/dist/aria-snapshot.js.map +1 -1
package/dist/aria-snapshot.test.js +5 -2
package/dist/aria-snapshot.test.js.map +1 -1
package/dist/aria-snapshot.unit.test.js +83 -41
package/dist/aria-snapshot.unit.test.js.map +1 -1
package/dist/assets/cursors/screen-studio/pointer-macos-tahoe-data-url.d.ts +5 -0
package/dist/assets/cursors/screen-studio/pointer-macos-tahoe-data-url.d.ts.map +1 -0
package/dist/assets/cursors/screen-studio/pointer-macos-tahoe-data-url.js +5 -0
package/dist/assets/cursors/screen-studio/pointer-macos-tahoe-data-url.js.map +1 -0
package/dist/bippy.js +1 -1
package/dist/cdp-log.d.ts +1 -1
package/dist/cdp-log.d.ts.map +1 -1
package/dist/cdp-log.js +1 -1
package/dist/cdp-log.js.map +1 -1
package/dist/cdp-relay.d.ts.map +1 -1
package/dist/cdp-relay.js +492 -298
package/dist/cdp-relay.js.map +1 -1
package/dist/cdp-session.d.ts.map +1 -1
package/dist/cdp-session.js.map +1 -1
package/dist/cdp-types.d.ts.map +1 -1
package/dist/cdp-types.js +7 -7
package/dist/cdp-types.js.map +1 -1
package/dist/clean-html.d.ts.map +1 -1
package/dist/clean-html.js +4 -5
package/dist/clean-html.js.map +1 -1
package/dist/cli.js +45 -27
package/dist/cli.js.map +1 -1
package/dist/create-logger.d.ts.map +1 -1
package/dist/create-logger.js +3 -1
package/dist/create-logger.js.map +1 -1
package/dist/debugger-examples-types.d.ts.map +1 -1
package/dist/debugger.d.ts.map +1 -1
package/dist/debugger.js +1 -3
package/dist/debugger.js.map +1 -1
package/dist/diff-utils.d.ts.map +1 -1
package/dist/diff-utils.js +1 -4
package/dist/diff-utils.js.map +1 -1
package/dist/editor-api.md +12 -2
package/dist/editor-examples.d.ts +1 -1
package/dist/editor-examples.d.ts.map +1 -1
package/dist/editor-examples.js +1 -1
package/dist/editor-examples.js.map +1 -1
package/dist/editor.d.ts +1 -1
package/dist/editor.d.ts.map +1 -1
package/dist/editor.js +1 -1
package/dist/editor.js.map +1 -1
package/dist/executor.d.ts +26 -3
package/dist/executor.d.ts.map +1 -1
package/dist/executor.js +297 -64
package/dist/executor.js.map +1 -1
package/dist/executor.unit.test.js +38 -1
package/dist/executor.unit.test.js.map +1 -1
package/dist/extension-connection.test.js +139 -36
package/dist/extension-connection.test.js.map +1 -1
package/dist/ffmpeg.d.ts +148 -0
package/dist/ffmpeg.d.ts.map +1 -0
package/dist/ffmpeg.js +523 -0
package/dist/ffmpeg.js.map +1 -0
package/dist/ghost-browser.d.ts.map +1 -1
package/dist/ghost-browser.js.map +1 -1
package/dist/ghost-cursor-client.js +287 -0
package/dist/ghost-cursor.d.ts +27 -0
package/dist/ghost-cursor.d.ts.map +1 -0
package/dist/ghost-cursor.js +63 -0
package/dist/ghost-cursor.js.map +1 -0
package/dist/htmlrewrite.d.ts.map +1 -1
package/dist/htmlrewrite.js +17 -55
package/dist/htmlrewrite.js.map +1 -1
package/dist/htmlrewrite.test.js.map +1 -1
package/dist/kill-port.d.ts.map +1 -1
package/dist/kill-port.js +1 -3
package/dist/kill-port.js.map +1 -1
package/dist/locator-selector.test.d.ts +2 -0
package/dist/locator-selector.test.d.ts.map +1 -0
package/dist/locator-selector.test.js +96 -0
package/dist/locator-selector.test.js.map +1 -0
package/dist/mcp-client.js.map +1 -1
package/dist/mcp.d.ts.map +1 -1
package/dist/mcp.js +8 -3
package/dist/mcp.js.map +1 -1
package/dist/on-mouse-action.test.d.ts +2 -0
package/dist/on-mouse-action.test.d.ts.map +1 -0
package/dist/on-mouse-action.test.js +155 -0
package/dist/on-mouse-action.test.js.map +1 -0
package/dist/page-markdown.js +4 -4
package/dist/page-markdown.js.map +1 -1
package/dist/prompt.md +450 -377
package/dist/protocol.d.ts +4 -0
package/dist/protocol.d.ts.map +1 -1
package/dist/readability.js +16 -2
package/dist/recording-ghost-cursor.d.ts +41 -0
package/dist/recording-ghost-cursor.d.ts.map +1 -0
package/dist/recording-ghost-cursor.js +79 -0
package/dist/recording-ghost-cursor.js.map +1 -0
package/dist/recording-relay.d.ts.map +1 -1
package/dist/recording-relay.js +8 -8
package/dist/recording-relay.js.map +1 -1
package/dist/relay-client.d.ts +17 -4
package/dist/relay-client.d.ts.map +1 -1
package/dist/relay-client.js +45 -11
package/dist/relay-client.js.map +1 -1
package/dist/relay-core.test.d.ts.map +1 -1
package/dist/relay-core.test.js +515 -26
package/dist/relay-core.test.js.map +1 -1
package/dist/relay-navigation.test.d.ts.map +1 -1
package/dist/relay-navigation.test.js +169 -31
package/dist/relay-navigation.test.js.map +1 -1
package/dist/relay-session.test.d.ts.map +1 -1
package/dist/relay-session.test.js +113 -65
package/dist/relay-session.test.js.map +1 -1
package/dist/relay-state.d.ts +158 -0
package/dist/relay-state.d.ts.map +1 -0
package/dist/relay-state.js +306 -0
package/dist/relay-state.js.map +1 -0
package/dist/relay-state.test.d.ts +2 -0
package/dist/relay-state.test.d.ts.map +1 -0
package/dist/relay-state.test.js +472 -0
package/dist/relay-state.test.js.map +1 -0
package/dist/scoped-fs.d.ts.map +1 -1
package/dist/scoped-fs.js.map +1 -1
package/dist/screen-recording.d.ts +66 -4
package/dist/screen-recording.d.ts.map +1 -1
package/dist/screen-recording.js +150 -13
package/dist/screen-recording.js.map +1 -1
package/dist/screen-recording.test.d.ts +2 -0
package/dist/screen-recording.test.d.ts.map +1 -0
package/dist/screen-recording.test.js +102 -0
package/dist/screen-recording.test.js.map +1 -0
package/dist/selector-generator.js +1 -1
package/dist/snapshot-tools.test.js +71 -28
package/dist/snapshot-tools.test.js.map +1 -1
package/dist/start-relay-server.d.ts +1 -1
package/dist/start-relay-server.d.ts.map +1 -1
package/dist/start-relay-server.js +1 -1
package/dist/start-relay-server.js.map +1 -1
package/dist/styles-api.md +8 -1
package/dist/styles-examples.d.ts +1 -1
package/dist/styles-examples.d.ts.map +1 -1
package/dist/styles-examples.js +1 -1
package/dist/styles-examples.js.map +1 -1
package/dist/styles.d.ts.map +1 -1
package/dist/styles.js +1 -3
package/dist/styles.js.map +1 -1
package/dist/test-declarations.d.ts.map +1 -1
package/dist/test-utils.d.ts +1 -1
package/dist/test-utils.d.ts.map +1 -1
package/dist/test-utils.js +7 -5
package/dist/test-utils.js.map +1 -1
package/dist/utils.d.ts.map +1 -1
package/dist/utils.js.map +1 -1
package/dist/wait-for-page-load.d.ts.map +1 -1
package/dist/wait-for-page-load.js +1 -1
package/dist/wait-for-page-load.js.map +1 -1
package/package.json +4 -3
package/src/a11y-client.ts +5 -4
package/src/aria-snapshot.test.ts +5 -2
package/src/aria-snapshot.ts +306 -117
package/src/aria-snapshot.unit.test.ts +199 -141
package/src/aria-snapshots/github-interactive.txt +2 -0
package/src/aria-snapshots/github-raw.txt +5 -1
package/src/aria-snapshots/hackernews-interactive.txt +238 -241
package/src/aria-snapshots/hackernews-raw.txt +265 -269
package/src/assets/aria-labels-example.png +0 -0
package/src/assets/aria-labels-github.png +0 -0
package/src/assets/aria-labels-hacker-news.png +0 -0
package/src/assets/aria-labels-old-reddit.png +0 -0
package/src/assets/cursors/screen-studio/pointer-macos-tahoe-data-url.ts +5 -0
package/src/assets/cursors/screen-studio/pointer-macos-tahoe.svg +18 -0
package/src/cdp-log.ts +4 -1
package/src/cdp-relay.ts +1059 -737
package/src/cdp-session.ts +12 -3
package/src/cdp-types.ts +51 -51
package/src/clean-html.ts +4 -5
package/src/cli.ts +82 -55
package/src/create-logger.ts +5 -3
package/src/debugger-examples-types.ts +4 -1
package/src/debugger.ts +1 -5
package/src/diff-utils.ts +2 -5
package/src/editor-examples.ts +11 -1
package/src/editor.ts +10 -2
package/src/executor.ts +374 -73
package/src/executor.unit.test.ts +48 -1
package/src/extension-connection.test.ts +612 -488
package/src/ffmpeg.ts +769 -0
package/src/ghost-browser.ts +4 -6
package/src/ghost-cursor-client.ts +369 -0
package/src/ghost-cursor.ts +110 -0
package/src/htmlrewrite.test.ts +6 -2
package/src/htmlrewrite.ts +348 -386
package/src/kill-port.ts +1 -3
package/src/locator-selector.test.ts +115 -0
package/src/mcp-client.ts +1 -1
package/src/mcp.ts +21 -15
package/src/on-mouse-action.test.ts +196 -0
package/src/page-markdown.ts +7 -7
package/src/protocol.ts +73 -57
package/src/recording-ghost-cursor.ts +113 -0
package/src/recording-relay.ts +20 -12
package/src/relay-client.ts +85 -18
package/src/relay-core.test.ts +1117 -578
package/src/relay-navigation.test.ts +648 -483
package/src/relay-session.test.ts +984 -929
package/src/relay-state.test.ts +570 -0
package/src/relay-state.ts +497 -0
package/src/resource.md +21 -49
package/src/scoped-fs.ts +9 -3
package/src/screen-recording.test.ts +111 -0
package/src/screen-recording.ts +256 -31
package/src/skill.md +476 -396
package/src/snapshot-tools.test.ts +580 -528
package/src/snapshots/shadcn-ui-accessibility-full.md +8 -8
package/src/snapshots/shadcn-ui-accessibility-interactive.md +8 -8
package/src/start-relay-server.ts +14 -11
package/src/styles-examples.ts +8 -1
package/src/styles.ts +20 -21
package/src/test-declarations.ts +6 -6
package/src/test-utils.ts +104 -91
package/src/utils.ts +2 -1
package/src/wait-for-page-load.ts +6 -1

package/dist/relay-core.test.js CHANGED Viewed

@@ -1,7 +1,10 @@
 import { createMCPClient } from './mcp-client.js';
 import { describe, it, expect, beforeAll, afterAll } from 'vitest';
+import { chromium } from '@xmorse/playwright-core';
 import { getCDPSessionForPage } from './cdp-session.js';
-import { setupTestContext, cleanupTestContext, getExtensionServiceWorker, withTimeout, js, tryJsonParse } from './test-utils.js';
+import { getCdpUrl, LOG_CDP_FILE_PATH } from './utils.js';
+import fs from 'node:fs';
+import { setupTestContext, cleanupTestContext, getExtensionServiceWorker, withTimeout, js, tryJsonParse, createSimpleServer, } from './test-utils.js';
 import './test-declarations.js';
 const TEST_PORT = 19987;
 describe('Relay Core Tests', () => {
@@ -24,6 +27,26 @@ describe('Relay Core Tests', () => {
             throw new Error('Browser not initialized');
         return testCtx.browserContext;
     };
+    const ensureConnectedTabForExecute = async () => {
+        const browserContext = getBrowserContext();
+        const serviceWorker = await getExtensionServiceWorker(browserContext);
+        const connectedTabCount = await serviceWorker.evaluate(async () => {
+            const state = globalThis.getExtensionState();
+            return state.tabs.size;
+        });
+        if (connectedTabCount > 0) {
+            return;
+        }
+        const page = await browserContext.newPage();
+        await page.goto('about:blank');
+        await page.bringToFront();
+        await serviceWorker.evaluate(async () => {
+            await globalThis.toggleExtensionForActiveTab();
+        });
+        await new Promise((r) => {
+            setTimeout(r, 100);
+        });
+    };
     it('should inject script via addScriptTag through CDP relay', async () => {
         const browserContext = getBrowserContext();
         const serviceWorker = await withTimeout({
@@ -43,7 +66,9 @@ describe('Relay Core Tests', () => {
             timeoutMs: 10000,
             errorMessage: 'Timed out toggling extension for active tab',
         });
-        await new Promise((r) => { setTimeout(r, 100); });
+        await new Promise((r) => {
+            setTimeout(r, 100);
+        });
         const cdpSession = await withTimeout({
             promise: getCDPSessionForPage({ page }),
             timeoutMs: 10000,
@@ -71,6 +96,138 @@ describe('Relay Core Tests', () => {
         await cdpSession.detach();
         await page.close();
     }, 60000);
+    it('should emit download events for both Browser and Page domains in extension mode', async () => {
+        const browserContext = getBrowserContext();
+        const serviceWorker = await getExtensionServiceWorker(browserContext);
+        const logFilePath = LOG_CDP_FILE_PATH;
+        const logLineCountBefore = fs.existsSync(logFilePath)
+            ? fs
+                .readFileSync(logFilePath, 'utf-8')
+                .split('\n')
+                .filter((line) => {
+                return line.trim().length > 0;
+            }).length
+            : 0;
+        const server = await createSimpleServer({
+            routes: {
+                '/': `<!doctype html>
+<html>
+  <body>
+    <button id="download-button">Download</button>
+    <script>
+      const button = document.getElementById('download-button');
+      button.addEventListener('click', () => {
+        const blob = new Blob(['playwriter-download-test'], { type: 'text/plain' });
+        const url = URL.createObjectURL(blob);
+        const anchor = document.createElement('a');
+        anchor.href = url;
+        anchor.download = 'playwriter-download-test.txt';
+        document.body.appendChild(anchor);
+        anchor.click();
+        anchor.remove();
+        setTimeout(() => {
+          URL.revokeObjectURL(url);
+        }, 1000);
+      });
+    </script>
+  </body>
+</html>`,
+            },
+        });
+        const page = await browserContext.newPage();
+        await page.goto(server.baseUrl, { waitUntil: 'domcontentloaded' });
+        await page.bringToFront();
+        await serviceWorker.evaluate(async () => {
+            await globalThis.toggleExtensionForActiveTab();
+        });
+        const directBrowser = await withTimeout({
+            promise: chromium.connectOverCDP(getCdpUrl({ port: TEST_PORT })),
+            timeoutMs: 10000,
+            errorMessage: 'Timed out connecting over CDP for download reproduction test',
+        });
+        const connectedPage = directBrowser
+            .contexts()[0]
+            .pages()
+            .find((candidatePage) => {
+            return candidatePage.url() === server.baseUrl + '/';
+        });
+        if (!connectedPage) {
+            throw new Error('Connected page not found for download reproduction test');
+        }
+        const downloadResult = await Promise.all([
+            connectedPage.waitForEvent('download', { timeout: 3000 }).then((download) => {
+                return { timedOut: false, suggestedFilename: download.suggestedFilename() };
+            }, (error) => {
+                return { timedOut: true, errorMessage: error.message };
+            }),
+            connectedPage.click('#download-button'),
+        ]);
+        expect(downloadResult[0]).toMatchInlineSnapshot(`
+      {
+        "suggestedFilename": "playwriter-download-test.txt",
+        "timedOut": false,
+      }
+    `);
+        await directBrowser.close();
+        await page.close();
+        await server.close();
+        const logLinesAfter = fs
+            .readFileSync(logFilePath, 'utf-8')
+            .split('\n')
+            .filter((line) => {
+            return line.trim().length > 0;
+        })
+            .slice(logLineCountBefore);
+        const newEntries = logLinesAfter
+            .map((line) => {
+            return tryJsonParse(line);
+        })
+            .filter((entry) => {
+            return Boolean(entry && typeof entry === 'object' && 'direction' in entry && 'message' in entry);
+        });
+        const methods = newEntries
+            .map((entry) => {
+            return {
+                direction: entry.direction,
+                method: typeof entry.message?.method === 'string' ? entry.message.method : 'response',
+            };
+        })
+            .filter((entry) => {
+            return (entry.method.includes('download') ||
+                entry.method === 'Browser.setDownloadBehavior' ||
+                entry.method === 'Page.setDownloadBehavior');
+        });
+        const summary = {
+            hasBrowserSetDownloadBehavior: methods.some((entry) => {
+                return entry.direction === 'from-playwright' && entry.method === 'Browser.setDownloadBehavior';
+            }),
+            hasPageSetDownloadBehavior: methods.some((entry) => {
+                return entry.direction === 'to-extension' && entry.method === 'Page.setDownloadBehavior';
+            }),
+            hasPageDownloadWillBegin: methods.some((entry) => {
+                return entry.method === 'Page.downloadWillBegin';
+            }),
+            hasPageDownloadProgress: methods.some((entry) => {
+                return entry.method === 'Page.downloadProgress';
+            }),
+            hasBrowserDownloadWillBegin: methods.some((entry) => {
+                return entry.method === 'Browser.downloadWillBegin';
+            }),
+            hasBrowserDownloadProgress: methods.some((entry) => {
+                return entry.method === 'Browser.downloadProgress';
+            }),
+        };
+        expect(summary).toMatchInlineSnapshot(`
+      {
+        "hasBrowserDownloadProgress": false,
+        "hasBrowserDownloadWillBegin": false,
+        "hasBrowserSetDownloadBehavior": true,
+        "hasPageDownloadProgress": false,
+        "hasPageDownloadWillBegin": false,
+        "hasPageSetDownloadBehavior": true,
+      }
+    `);
+    }, 120000);
     it('should execute code and capture console output', async () => {
         await client.callTool({
             name: 'execute',
@@ -107,6 +264,108 @@ describe('Relay Core Tests', () => {
         `);
         expect(result.content).toBeDefined();
     }, 30000);
+    // Repro test for https://github.com/remorses/playwriter/issues/66.
+    // Current limitation: extension-mode routing does not support root-session
+    // Storage.getCookies in playwriter. MUST use Network.getCookies via page CDP
+    // session instead (see test below), so this repro stays skipped.
+    it.skip('should reproduce page.route failure in MCP execute path (issue #66)', async () => {
+        const server = await createSimpleServer({
+            routes: {
+                '/': '<!doctype html><html><body>route issue repro</body></html>',
+                '/api/data': '{"ok":true}',
+            },
+        });
+        try {
+            const result = await client.callTool({
+                name: 'execute',
+                arguments: {
+                    code: js `
+            const newPage = await context.newPage();
+            state.issue66Page = newPage;
+            await newPage.goto('${server.baseUrl}', { waitUntil: 'domcontentloaded' });
+            let routeFetchError = null;
+            await newPage.route('**/api/**', async (route) => {
+              try {
+                const response = await route.fetch();
+                await route.fulfill({ response });
+              } catch (error) {
+                routeFetchError = error instanceof Error ? error.message : String(error);
+                await route.abort();
+              }
+            });
+            await newPage.evaluate(async () => {
+              await fetch('/api/data').catch(() => null);
+            });
+            return { routeFetchError };
+          `,
+                },
+            });
+            const resultWithContent = result;
+            const content = Array.isArray(resultWithContent.content) ? resultWithContent.content : [];
+            const firstContent = content[0];
+            const output = typeof firstContent === 'object' && firstContent !== null && 'text' in firstContent
+                ? String(firstContent.text ?? '')
+                : '';
+            expect(output).toContain('routeFetchError');
+            expect(output).toContain('Storage.getCookies');
+            expect(output).toContain('No tab found for method Storage.getCookies');
+        }
+        finally {
+            try {
+                await client.callTool({
+                    name: 'execute',
+                    arguments: {
+                        code: js `
+              if (state.issue66Page && !state.issue66Page.isClosed()) {
+                await state.issue66Page.close();
+              }
+              delete state.issue66Page;
+            `,
+                    },
+                });
+            }
+            catch {
+                // Ignore cleanup failure if MCP disconnected due to the repro.
+            }
+            await server.close();
+        }
+    }, 30000);
+    it('should read cookies via Network.getCookies through page CDP session', async () => {
+        const browserContext = getBrowserContext();
+        const serviceWorker = await getExtensionServiceWorker(browserContext);
+        const server = await createSimpleServer({
+            routes: {
+                '/': '<!doctype html><html><body>cookies test</body></html>',
+            },
+        });
+        const page = await browserContext.newPage();
+        try {
+            await page.goto(server.baseUrl, { waitUntil: 'domcontentloaded' });
+            await page.bringToFront();
+            await serviceWorker.evaluate(async () => {
+                await globalThis.toggleExtensionForActiveTab();
+            });
+            await new Promise((r) => {
+                setTimeout(r, 200);
+            });
+            await page.evaluate(() => {
+                document.cookie = 'issue66=ok; path=/';
+            });
+            const cdpSession = await getCDPSessionForPage({ page });
+            const cookiesResult = await cdpSession.send('Network.getCookies', { urls: [page.url()] });
+            const cookie = cookiesResult.cookies.find((value) => {
+                return value.name === 'issue66';
+            });
+            expect(cookie?.value).toBe('ok');
+        }
+        finally {
+            await page.close();
+            await server.close();
+        }
+    }, 30000);
     it('should show extension as connected for pages created via newPage()', async () => {
         const browserContext = getBrowserContext();
         const serviceWorker = await getExtensionServiceWorker(browserContext);
@@ -131,7 +390,7 @@ describe('Relay Core Tests', () => {
                 connected: !!testTab && !!testTab.id && state.tabs.has(testTab.id),
                 tabId: testTab?.id,
                 tabInfo: testTab?.id ? state.tabs.get(testTab.id) : null,
-                connectionState: state.connectionState
+                connectionState: state.connectionState,
             };
         });
         expect(extensionState.connected).toBe(true);
@@ -150,7 +409,7 @@ describe('Relay Core Tests', () => {
             },
         });
     }, 30000);
-    const accessibilitySnapshotTestCases = [
+    const snapshotTestCases = [
         {
             name: 'hacker-news',
             url: 'https://news.ycombinator.com/item?id=1',
@@ -162,7 +421,7 @@ describe('Relay Core Tests', () => {
             expectedContent: ['shadcn'],
         },
     ];
-    for (const testCase of accessibilitySnapshotTestCases) {
+    for (const testCase of snapshotTestCases) {
         it(`should get accessibility snapshot of ${testCase.name}`, async () => {
             await client.callTool({
                 name: 'execute',
@@ -181,8 +440,8 @@ describe('Relay Core Tests', () => {
                 arguments: {
                     code: js `
               await state.page.goto('${testCase.url}', { waitUntil: 'domcontentloaded' });
-              const snapshot = await accessibilitySnapshot({ page: state.page, showDiffSinceLastCall: false, interactiveOnly: true });
-              return snapshot;
+              const snap = await snapshot({ page: state.page, showDiffSinceLastCall: false, interactiveOnly: true });
+              return snap;
             `,
                 },
             });
@@ -199,8 +458,8 @@ describe('Relay Core Tests', () => {
                 name: 'execute',
                 arguments: {
                     code: js `
-              const snapshot = await accessibilitySnapshot({ page: state.page, showDiffSinceLastCall: false, interactiveOnly: false });
-              return snapshot;
+              const snap = await snapshot({ page: state.page, showDiffSinceLastCall: false, interactiveOnly: false });
+              return snap;
             `,
                 },
             });
@@ -541,21 +800,92 @@ describe('Relay Core Tests', () => {
             },
         });
     }, 30000);
-    // right now our extension always forces light mode because of a playwright cdp bug
-    it.todo('should preserve system color scheme instead of forcing light mode', async () => {
+    it('should capture console logs from cross-origin iframes', async () => {
+        // Two servers on different ports = different origins
+        const iframeServer = await createSimpleServer({
+            routes: {
+                '/iframe.html': `<!doctype html><html><body>
+          <script>
+            console.log('iframe-log-ALPHA');
+            console.error('iframe-error-BETA');
+            console.warn('iframe-warn-GAMMA');
+          </script>
+          <p>cross-origin iframe</p>
+        </body></html>`,
+            },
+        });
+        const parentServer = await createSimpleServer({
+            routes: {
+                '/': `<!doctype html><html><body>
+          <script>console.log('parent-log-DELTA');</script>
+          <iframe src="${iframeServer.baseUrl}/iframe.html"></iframe>
+        </body></html>`,
+            },
+        });
+        try {
+            // Clear logs and navigate to the parent page with cross-origin iframe
+            await client.callTool({
+                name: 'execute',
+                arguments: {
+                    code: js `
+            clearAllLogs();
+            state.iframePage = await context.newPage();
+            await state.iframePage.goto('${parentServer.baseUrl}', { waitUntil: 'networkidle' });
+            // Wait for iframe to load and logs to be captured
+            await state.iframePage.frameLocator('iframe').locator('p').waitFor({ timeout: 5000 });
+            await new Promise(resolve => setTimeout(resolve, 500));
+          `,
+                },
+            });
+            // Retrieve logs and verify both parent and iframe logs are captured
+            const logsResult = await client.callTool({
+                name: 'execute',
+                arguments: {
+                    code: js `
+            const logs = await getLatestLogs({ page: state.iframePage });
+            console.log('Cross-origin iframe logs count:', logs.length);
+            logs.forEach(log => console.log(log));
+          `,
+                },
+            });
+            const output = logsResult.content[0].text;
+            // Parent page log
+            expect(output).toContain('parent-log-DELTA');
+            // Cross-origin iframe logs
+            expect(output).toContain('iframe-log-ALPHA');
+            expect(output).toContain('iframe-error-BETA');
+            expect(output).toContain('iframe-warn-GAMMA');
+            // Clean up
+            await client.callTool({
+                name: 'execute',
+                arguments: {
+                    code: js `
+            await state.iframePage.close();
+            delete state.iframePage;
+          `,
+                },
+            });
+        }
+        finally {
+            await Promise.all([parentServer.close(), iframeServer.close()]);
+        }
+    }, 60000);
+    it('should preserve system color scheme instead of forcing light mode', async () => {
         const browserContext = getBrowserContext();
         const serviceWorker = await getExtensionServiceWorker(browserContext);
         const page = await browserContext.newPage();
         await page.goto('https://example.com');
         await page.bringToFront();
+        // test-utils launches with colorScheme: 'dark', so before MCP connection
+        // the browser should report dark mode
         const colorSchemeBefore = await page.evaluate(() => {
             return window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light';
         });
-        console.log('Color scheme before MCP connection:', colorSchemeBefore);
+        expect(colorSchemeBefore).toBe('dark');
         await serviceWorker.evaluate(async () => {
             await globalThis.toggleExtensionForActiveTab();
         });
-        await new Promise(r => setTimeout(r, 100));
+        await new Promise((r) => setTimeout(r, 500));
         const result = await client.callTool({
             name: 'execute',
             arguments: {
@@ -573,14 +903,17 @@ describe('Relay Core Tests', () => {
             },
         });
         console.log('Color scheme after MCP connection:', result.content);
+        // After MCP connection, color scheme should NOT be forced to light.
+        // The page.ts default is now 'no-override', so the browser's actual
+        // color scheme (dark, from test-utils launch config) should be preserved.
         expect(result.content).toMatchInlineSnapshot(`
-          [
-            {
-              "text": "[return value] { error: 'Page not found', urls: [ 'about:blank' ] }",
-              "type": "text",
-            },
-          ]
-        `);
+        [
+          {
+            "text": "[return value] { matchesDark: true, matchesLight: false }",
+            "type": "text",
+          },
+        ]
+      `);
         await page.close();
     }, 60000);
     it('should get clean HTML with getCleanHTML', async () => {
@@ -607,7 +940,7 @@ describe('Relay Core Tests', () => {
         await serviceWorker.evaluate(async () => {
             await globalThis.toggleExtensionForActiveTab();
         });
-        await new Promise(r => setTimeout(r, 400));
+        await new Promise((r) => setTimeout(r, 400));
         // Test basic getCleanHTML
         const result = await client.callTool({
             name: 'execute',
@@ -698,7 +1031,7 @@ describe('Relay Core Tests', () => {
         await serviceWorker.evaluate(async () => {
             await globalThis.toggleExtensionForActiveTab();
         });
-        await new Promise(r => setTimeout(r, 400));
+        await new Promise((r) => setTimeout(r, 400));
         // Test basic getPageMarkdown
         const result = await client.callTool({
             name: 'execute',
@@ -759,7 +1092,7 @@ describe('Relay Core Tests', () => {
         await serviceWorker.evaluate(async () => {
             await globalThis.disconnectEverything();
         });
-        await new Promise(r => setTimeout(r, 100));
+        await new Promise((r) => setTimeout(r, 100));
         // 2. Create first page and enable extension
         const page1 = await browserContext.newPage();
         await page1.goto('https://example.com/first-page');
@@ -767,7 +1100,7 @@ describe('Relay Core Tests', () => {
         await serviceWorker.evaluate(async () => {
             await globalThis.toggleExtensionForActiveTab();
         });
-        await new Promise(r => setTimeout(r, 100));
+        await new Promise((r) => setTimeout(r, 100));
         // 3. Reset MCP to ensure page1 becomes the default page (only page available)
         const resetResult = await client.callTool({
             name: 'reset',
@@ -793,10 +1126,10 @@ describe('Relay Core Tests', () => {
         await serviceWorker.evaluate(async () => {
             await globalThis.toggleExtensionForActiveTab();
         });
-        await new Promise(r => setTimeout(r, 100));
+        await new Promise((r) => setTimeout(r, 100));
         // 6. Close the first page (which is the default `page` in MCP scope)
         await page1.close();
-        await new Promise(r => setTimeout(r, 100));
+        await new Promise((r) => setTimeout(r, 100));
         // 7. Execute code via MCP - should NOT fail with "page closed" error
         // Instead, it should automatically switch to the second page
         const afterCloseResult = await client.callTool({
@@ -819,5 +1152,161 @@ describe('Relay Core Tests', () => {
         // Cleanup
         await page2.close();
     }, 60000);
+    it('should show descriptive error when clicking a hidden element', async () => {
+        await ensureConnectedTabForExecute();
+        // Create a fresh page and set content with a collapsed details element
+        await client.callTool({
+            name: 'execute',
+            arguments: {
+                code: js `
+          state.errorTestPage = await context.newPage();
+          await state.errorTestPage.setContent(\`
+            <details>
+              <summary>Toggle</summary>
+              <button id="hidden-btn">Hidden Button</button>
+            </details>
+          \`);
+        `,
+            },
+        });
+        const result = await client.callTool({
+            name: 'execute',
+            arguments: {
+                code: js `
+          await state.errorTestPage.click('#hidden-btn', { timeout: 100 });
+        `,
+            },
+        });
+        expect(result).toMatchInlineSnapshot(`
+      {
+        "content": [
+          {
+            "text": "
+      Error executing code: page.click: Timeout 100ms exceeded. Element is not visible — it may be hidden by CSS, inside a collapsed <details>, inactive tab, or closed accordion. Try: interact with the page to reveal it first, or use { force: true } to skip visibility checks
+      Call log:
+      [2m  - waiting for locator('#hidden-btn')[22m
+      [2m    - locator resolved to <button id="hidden-btn">Hidden Button</button>[22m
+      [2m  - attempting click action[22m
+      [2m    2 × waiting for element to be visible, enabled and stable[22m
+      [2m      - element is not visible[22m
+      [2m    - retrying click action[22m
+      [2m    - waiting 20ms[22m
+      [2m    - waiting for element to be visible, enabled and stable[22m
+      [2m    - element is not visible[22m
+      [2m  - retrying click action[22m
+      [2m    - waiting 100ms[22m
+      ",
+            "type": "text",
+          },
+        ],
+        "isError": true,
+      }
+    `);
+        // Cleanup
+        await client.callTool({ name: 'execute', arguments: { code: js `await state.errorTestPage.close(); delete state.errorTestPage;` } });
+    }, 30000);
+    it('should show descriptive error when clicking an element covered by another', async () => {
+        await ensureConnectedTabForExecute();
+        await client.callTool({
+            name: 'execute',
+            arguments: {
+                code: js `
+          state.errorTestPage = await context.newPage();
+          await state.errorTestPage.setContent(\`
+            <div style="position:relative">
+              <button id="covered-btn" style="position:absolute;top:0;left:0">Covered</button>
+              <div id="overlay" style="position:absolute;top:0;left:0;width:200px;height:200px;background:red;z-index:10">Overlay</div>
+            </div>
+          \`);
+        `,
+            },
+        });
+        const result = await client.callTool({
+            name: 'execute',
+            arguments: {
+                code: js `
+          await state.errorTestPage.click('#covered-btn', { timeout: 100 });
+        `,
+            },
+        });
+        expect(result).toMatchInlineSnapshot(`
+      {
+        "content": [
+          {
+            "text": "
+      Error executing code: page.click: Timeout 100ms exceeded. <div id="overlay">Overlay</div> intercepts pointer events
+      Call log:
+      [2m  - waiting for locator('#covered-btn')[22m
+      [2m    - locator resolved to <button id="covered-btn">Covered</button>[22m
+      [2m  - attempting click action[22m
+      [2m    2 × waiting for element to be visible, enabled and stable[22m
+      [2m      - element is visible, enabled and stable[22m
+      [2m      - scrolling into view if needed[22m
+      [2m      - done scrolling[22m
+      [2m      - <div id="overlay">Overlay</div> intercepts pointer events[22m
+      [2m    - retrying click action[22m
+      [2m    - waiting 20ms[22m
+      [2m    - waiting for element to be visible, enabled and stable[22m
+      [2m    - element is visible, enabled and stable[22m
+      [2m    - scrolling into view if needed[22m
+      [2m    - done scrolling[22m
+      [2m    - <div id="overlay">Overlay</div> intercepts pointer events[22m
+      [2m  - retrying click action[22m
+      [2m    - waiting 100ms[22m
+      ",
+            "type": "text",
+          },
+        ],
+        "isError": true,
+      }
+    `);
+        await client.callTool({ name: 'execute', arguments: { code: js `await state.errorTestPage.close(); delete state.errorTestPage;` } });
+    }, 30000);
+    it('should show descriptive error when clicking a display:none element', async () => {
+        await ensureConnectedTabForExecute();
+        await client.callTool({
+            name: 'execute',
+            arguments: {
+                code: js `
+          state.errorTestPage = await context.newPage();
+          await state.errorTestPage.setContent('<button id="invisible" style="display:none">Invisible</button>');
+        `,
+            },
+        });
+        const result = await client.callTool({
+            name: 'execute',
+            arguments: {
+                code: js `
+          await state.errorTestPage.click('#invisible', { timeout: 100 });
+        `,
+            },
+        });
+        expect(result).toMatchInlineSnapshot(`
+      {
+        "content": [
+          {
+            "text": "
+      Error executing code: page.click: Timeout 100ms exceeded. Element is not visible — it may be hidden by CSS, inside a collapsed <details>, inactive tab, or closed accordion. Try: interact with the page to reveal it first, or use { force: true } to skip visibility checks
+      Call log:
+      [2m  - waiting for locator('#invisible')[22m
+      [2m    - locator resolved to <button id="invisible">Invisible</button>[22m
+      [2m  - attempting click action[22m
+      [2m    2 × waiting for element to be visible, enabled and stable[22m
+      [2m      - element is not visible[22m
+      [2m    - retrying click action[22m
+      [2m    - waiting 20ms[22m
+      [2m    - waiting for element to be visible, enabled and stable[22m
+      [2m    - element is not visible[22m
+      [2m  - retrying click action[22m
+      [2m    - waiting 100ms[22m
+      ",
+            "type": "text",
+          },
+        ],
+        "isError": true,
+      }
+    `);
+        await client.callTool({ name: 'execute', arguments: { code: js `await state.errorTestPage.close(); delete state.errorTestPage;` } });
+    }, 30000);
 });
 //# sourceMappingURL=relay-core.test.js.map