From 2fac870578fd4c1b450877ac197d2db6bad43997 Mon Sep 17 00:00:00 2001 From: Simon Knott Date: Wed, 12 Feb 2025 11:00:39 +0100 Subject: [PATCH] rewrite tests --- .../src/utils/isomorphic/llm.ts | 4 +- packages/trace-viewer/src/sw/main.ts | 5 + tests/playwright-test/ui-mode-llm.spec.ts | 113 ++++++------------ 3 files changed, 44 insertions(+), 78 deletions(-) diff --git a/packages/playwright-core/src/utils/isomorphic/llm.ts b/packages/playwright-core/src/utils/isomorphic/llm.ts index 157541b6f2..401bfe7748 100644 --- a/packages/playwright-core/src/utils/isomorphic/llm.ts +++ b/packages/playwright-core/src/utils/isomorphic/llm.ts @@ -54,6 +54,7 @@ export class OpenAI implements LLM { headers: { 'Content-Type': 'application/json', 'Authorization': `Bearer ${this.apiKey}`, + 'x-pw-serviceworker': 'forward', }, body: JSON.stringify({ model: 'gpt-4o', @@ -86,7 +87,8 @@ export class Anthropic implements LLM { headers: { 'Content-Type': 'application/json', 'x-api-key': this.apiKey, - 'anthropic-version': '2023-06-01' + 'anthropic-version': '2023-06-01', + 'x-pw-serviceworker': 'forward', }, body: JSON.stringify({ model: 'claude-3-5-sonnet-20241022', diff --git a/packages/trace-viewer/src/sw/main.ts b/packages/trace-viewer/src/sw/main.ts index 108d7d69a0..d965cabc9d 100644 --- a/packages/trace-viewer/src/sw/main.ts +++ b/packages/trace-viewer/src/sw/main.ts @@ -88,6 +88,11 @@ async function doFetch(event: FetchEvent): Promise { if (event.request.url.startsWith('chrome-extension://')) return fetch(event.request); + if (event.request.headers.get('x-pw-serviceworker') === 'forward') { + event.request.headers.delete('x-pw-serviceworker'); + return fetch(event.request); + } + const request = event.request; const client = await self.clients.get(event.clientId); diff --git a/tests/playwright-test/ui-mode-llm.spec.ts b/tests/playwright-test/ui-mode-llm.spec.ts index 23b8552e8d..5504379bda 100644 --- a/tests/playwright-test/ui-mode-llm.spec.ts +++ b/tests/playwright-test/ui-mode-llm.spec.ts @@ -18,29 +18,28 @@ import { test, expect, retries } from './ui-mode-fixtures'; test.describe.configure({ mode: 'parallel', retries }); -test('openai', async ({ runUITest, server }) => { - const OPENAI_API_KEY = 'fake-key'; +test('openai', async ({ runUITest }) => { + const { page } = await runUITest({ + 'a.test.ts': ` + import { test, expect } from '@playwright/test'; + test('trace test', async ({ page }) => { + await page.setContent(''); + expect(1).toBe(2); + }); + `, + }, { + OPENAI_API_KEY: 'fake-key' + }); - server.setRoute('/v1/chat/completions', (req, res) => { - expect(req.headers['authorization']).toBe('Bearer ' + OPENAI_API_KEY); + await page.route('https://api.openai.com/**', async (route, request) => { + expect(await request.headerValue('authorization')).toBe('Bearer fake-key'); const event = { object: 'chat.completion.chunk', choices: [{ delta: { content: 'This is a mock response' } }] }; - res.end(`\n\ndata: ${JSON.stringify(event)}\n\n`); - }); - - const { page } = await runUITest({ - 'a.test.ts': ` - import { test, expect } from '@playwright/test'; - test('trace test', async ({ page }) => { - await page.setContent(''); - expect(1).toBe(2); - }); - `, - }, { - OPENAI_API_KEY, - OPENAI_BASE_URL: server.PREFIX, + await route.fulfill({ + body: `\n\ndata: ${JSON.stringify(event)}\n\n` + }); }); await page.getByTitle('Run all').click(); @@ -56,29 +55,28 @@ test('openai', async ({ runUITest, server }) => { `); }); -test('anthropic', async ({ runUITest, server }) => { - const ANTHROPIC_API_KEY = 'fake-key'; +test('anthropic', async ({ runUITest }) => { + const { page } = await runUITest({ + 'a.test.ts': ` + import { test, expect } from '@playwright/test'; + test('trace test', async ({ page }) => { + await page.setContent(''); + expect(1).toBe(2); + }); + `, + }, { + ANTHROPIC_API_KEY: 'fake-key' + }); - server.setRoute('/v1/messages', (req, res) => { - expect(req.headers['x-api-key']).toBe(ANTHROPIC_API_KEY); + await page.route('https://api.anthropic.com/**', async (route, request) => { + expect(await request.headerValue('x-api-key')).toBe('fake-key'); const event = { - type: 'content_block_delta', - delta: { text: 'This is a mock response' } + object: 'chat.completion.chunk', + choices: [{ delta: { content: 'This is a mock response' } }] }; - res.end(`\n\ndata: ${JSON.stringify(event)}\n\n`); - }); - - const { page } = await runUITest({ - 'a.test.ts': ` - import { test, expect } from '@playwright/test'; - test('trace test', async ({ page }) => { - await page.setContent(''); - expect(1).toBe(2); - }); - `, - }, { - ANTHROPIC_API_KEY, - ANTHROPIC_BASE_URL: server.PREFIX, + await route.fulfill({ + body: `\n\ndata: ${JSON.stringify(event)}\n\n` + }); }); await page.getByTitle('Run all').click(); @@ -93,42 +91,3 @@ test('anthropic', async ({ runUITest, server }) => { - paragraph: This is a mock response `); }); - -test('invisible without key', async ({ runUITest }) => { - const { page } = await runUITest({ - 'a.test.ts': ` - import { test, expect } from '@playwright/test'; - test('trace test', async ({ page }) => { - await page.setContent(''); - expect(1).toBe(2); - }); - `, - }); - - await page.getByTitle('Run all').click(); - await page.getByText('Errors', { exact: true }).click(); - await page.getByRole('button', { name: 'Fix with AI' }).click(); - await expect(page.getByRole('tabpanel', { name: 'AI' })).not.toBeVisible(); -}); - -test('tab stays visible once activated', async ({ runUITest }) => { - const { page } = await runUITest({ - 'a.test.ts': ` - import { test, expect } from '@playwright/test'; - test('trace test', async ({ page }) => { - await page.setContent(''); - expect(1).toBe(2); - }); - `, - }, { - ANTHROPIC_API_KEY: 'fake-key', - }); - - await page.getByTitle('Run all').click(); - await page.getByText('Errors', { exact: true }).click(); - await page.getByRole('button', { name: 'Fix with AI' }).click(); - await expect(page.getByRole('tabpanel', { name: 'AI' })).toBeVisible(); - - await page.reload(); - await expect(page.getByRole('tabpanel', { name: 'AI' })).toBeVisible(); -});