diff --git a/tests/playwright-test/esm.spec.ts b/tests/playwright-test/esm.spec.ts index a672aff78a..20c796ee00 100644 --- a/tests/playwright-test/esm.spec.ts +++ b/tests/playwright-test/esm.spec.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { test, expect } from './playwright-test-fixtures'; +import { test, expect, playwrightCtConfigText } from './playwright-test-fixtures'; test('should load nested as esm when package.json has type module', async ({ runInlineTest }) => { const result = await runInlineTest({ @@ -481,10 +481,7 @@ test('should resolve no-extension import to .jsx file in ESM mode', async ({ run test('should resolve .js import to .tsx file in ESM mode for components', async ({ runInlineTest }) => { const result = await runInlineTest({ 'package.json': `{ "type": "module" }`, - 'playwright.config.ts': ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ projects: [{name: 'foo'}] }); - `, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, diff --git a/tests/playwright-test/loader.spec.ts b/tests/playwright-test/loader.spec.ts index 39f6b26174..98796644b5 100644 --- a/tests/playwright-test/loader.spec.ts +++ b/tests/playwright-test/loader.spec.ts @@ -14,7 +14,7 @@ * limitations under the License. */ -import { test, expect } from './playwright-test-fixtures'; +import { test, expect, playwrightCtConfigText } from './playwright-test-fixtures'; import path from 'path'; test('should return the location of a syntax error', async ({ runInlineTest }) => { @@ -756,10 +756,7 @@ test('should resolve .js import to .tsx file in non-ESM mode', async ({ runInlin test('should resolve .js import to .tsx file in non-ESM mode for components', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ projects: [{name: 'foo'}] }); - `, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, diff --git a/tests/playwright-test/playwright-test-fixtures.ts b/tests/playwright-test/playwright-test-fixtures.ts index 37497ed430..1e22b7c8e8 100644 --- a/tests/playwright-test/playwright-test-fixtures.ts +++ b/tests/playwright-test/playwright-test-fixtures.ts @@ -437,3 +437,13 @@ export function parseTestRunnerOutput(output: string) { didNotRun, }; } + +export const playwrightCtConfigText = ` +import { defineConfig } from '@playwright/experimental-ct-react'; +export default defineConfig({ + use: { + ctPort: ${3200 + (+process.env.TEST_PARALLEL_INDEX)} + }, + projects: [{name: 'default'}], +}); +`; \ No newline at end of file diff --git a/tests/playwright-test/playwright.ct-build.spec.ts b/tests/playwright-test/playwright.ct-build.spec.ts index 6304b44a12..d518bcccac 100644 --- a/tests/playwright-test/playwright.ct-build.spec.ts +++ b/tests/playwright-test/playwright.ct-build.spec.ts @@ -14,24 +14,14 @@ * limitations under the License. */ -import { test, expect } from './playwright-test-fixtures'; +import { test, expect, playwrightCtConfigText } from './playwright-test-fixtures'; import fs from 'fs'; test.describe.configure({ mode: 'parallel' }); -const playwrightConfig = ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ - use: { - ctPort: ${3200 + (+process.env.TEST_PARALLEL_INDEX)} - }, - projects: [{name: 'foo'}], - }); -`; - test('should work with the empty component list', async ({ runInlineTest }, testInfo) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ``, @@ -55,7 +45,7 @@ test('should work with the empty component list', async ({ runInlineTest }, test test('should extract component list', async ({ runInlineTest }, testInfo) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, @@ -202,7 +192,7 @@ test('should cache build', async ({ runInlineTest }, testInfo) => { await test.step('original test', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, @@ -229,7 +219,7 @@ test('should cache build', async ({ runInlineTest }, testInfo) => { await test.step('re-run same test', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, }, { workers: 1 }); expect(result.exitCode).toBe(0); expect(result.passed).toBe(1); @@ -239,7 +229,7 @@ test('should cache build', async ({ runInlineTest }, testInfo) => { await test.step('modify test', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'src/button.test.tsx': ` import { test, expect } from '@playwright/experimental-ct-react'; import { Button } from './button.tsx'; @@ -258,7 +248,7 @@ test('should cache build', async ({ runInlineTest }, testInfo) => { await test.step('modify source', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'src/button.tsx': ` export const Button = () => ; `, @@ -275,7 +265,7 @@ test('should grow cache', async ({ runInlineTest }, testInfo) => { await test.step('original test', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button1.tsx': ` @@ -310,7 +300,7 @@ test('should grow cache', async ({ runInlineTest }, testInfo) => { await test.step('run second test', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, }, { workers: 1 }, undefined, { additionalArgs: ['button2'] }); expect(result.exitCode).toBe(0); expect(result.passed).toBe(1); @@ -320,7 +310,7 @@ test('should grow cache', async ({ runInlineTest }, testInfo) => { await test.step('run first test again', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, }, { workers: 1 }, undefined, { additionalArgs: ['button2'] }); expect(result.exitCode).toBe(0); expect(result.passed).toBe(1); @@ -331,7 +321,7 @@ test('should grow cache', async ({ runInlineTest }, testInfo) => { test('should not use global config for preview', async ({ runInlineTest }) => { const result1 = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ``, 'vite.config.js': ` @@ -352,7 +342,7 @@ test('should not use global config for preview', async ({ runInlineTest }) => { expect(result1.passed).toBe(1); const result2 = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, }, { workers: 1 }); expect(result2.exitCode).toBe(0); expect(result2.passed).toBe(1); @@ -391,7 +381,7 @@ test('should work with https enabled', async ({ runInlineTest }) => { test('list compilation cache should not clash with the run one', async ({ runInlineTest }) => { const listResult = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.tsx': ` @@ -419,7 +409,7 @@ test('should retain deps when test changes', async ({ runInlineTest }, testInfo) await test.step('original test', async () => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.tsx': ` @@ -483,7 +473,7 @@ test('should retain deps when test changes', async ({ runInlineTest }, testInfo) test('should render component via re-export', async ({ runInlineTest }, testInfo) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.tsx': ` @@ -509,7 +499,7 @@ test('should render component via re-export', async ({ runInlineTest }, testInfo test('should render component exported via fixture', async ({ runInlineTest }, testInfo) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.tsx': ` @@ -539,7 +529,7 @@ test('should render component exported via fixture', async ({ runInlineTest }, t test('should pass imported images from test to component', async ({ runInlineTest }, testInfo) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/image.png': Buffer.from('iVBORw0KGgoAAAANSUhEUgAAADAAAAAwCAQAAAD9CzEMAAACMElEQVRYw+1XT0tCQRD/9Qci0Cw7mp1C6BMYnt5niMhPEEFCh07evNk54XnuGkhFehA/QxHkqYMEFWXpscMTipri7fqeu+vbfY+EoBkQ3Zn5zTo7MzsL/NNfoClkUUQNN3jCJ/ETfavRSpYkkSmFQzz8wMr4gaSp8OBJ2HCU4Iwd0kqGgd9GPxCccZ+0jWgWVW1wxlWy0qR51I3hv7lOllq7b4SC/+aGzr+QBadjEKgAykvzJGXwr/Lj4JfRk5hUSLKIa00HPUJRki0xeMWSWxVXmi5sddXKymqTyxdwquXAUVV3WREeLx3gTcNFWQY/jXtB8QIzgt4qTvAR4OCe0ATKCmrnmFMEM0Pp2BvrIisaFUdUjgKKZgYWSjjDLR5J+x13lATHuHSti6JBzQP+gq2QHXjfRaiJojbPgYqbmGFow0VpiyIW0/VIF9QKLzeBWA2MHmwCu8QJQV++Ps/joHQQH4HpuO0uobUeVztgIcr4Vnf4we9orWfUIWKHbEVyYKkPmaVpIVKICuo0ZYXWjHTITXWhsVYxkIDpUoKsla1i2Oz2QjvYG9fshu36GbFQ8DGyHNOuvRdOKZSDUtCFM7wyHeSM4XN8e7bOpd9F2gg+TRYal753bGkbuEjzMg0YW/yDV1czUDm+e43Byz86OnRwsYDMKXlmkYbeAOwffrtU/nGpXpwkXfPhVza+D9AiMAtrtOMYfVr0q8Wr1nh8n8ADZCJPqAk8AifyjP2n36cvkA6/Wln9MokAAAAASUVORK5CYII=', 'base64'), @@ -559,7 +549,7 @@ test('should pass imported images from test to component', async ({ runInlineTes test('should pass dates, regex, urls and bigints', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.tsx': ` @@ -596,7 +586,7 @@ test('should pass dates, regex, urls and bigints', async ({ runInlineTest }) => test('should pass undefined value as param', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/component.tsx': ` diff --git a/tests/playwright-test/playwright.ct-react.spec.ts b/tests/playwright-test/playwright.ct-react.spec.ts index 7e27149317..a92f8297f1 100644 --- a/tests/playwright-test/playwright.ct-react.spec.ts +++ b/tests/playwright-test/playwright.ct-react.spec.ts @@ -14,21 +14,11 @@ * limitations under the License. */ -import { test, expect } from './playwright-test-fixtures'; - -const playwrightConfig = ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ - use: { - ctPort: ${3200 + (+process.env.TEST_PARALLEL_INDEX)} - }, - projects: [{name: 'foo'}], - }); -`; +import { test, expect, playwrightCtConfigText } from './playwright-test-fixtures'; test('should work with TSX', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ` `, @@ -52,7 +42,7 @@ test('should work with TSX', async ({ runInlineTest }) => { test('should work with JSX', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ` `, @@ -78,7 +68,7 @@ test('should work with JSX', async ({ runInlineTest }) => { test('should work with JSX in JS', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ` `, @@ -104,7 +94,7 @@ test('should work with JSX in JS', async ({ runInlineTest }) => { test('should work with JSX in JS and in JSX', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ` `, @@ -141,7 +131,7 @@ test('should work with JSX in JS and in JSX', async ({ runInlineTest }) => { test('should work with stray TSX import', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ` `, @@ -172,7 +162,7 @@ test('should work with stray TSX import', async ({ runInlineTest }) => { test('should work with stray JSX import', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ` `, @@ -203,7 +193,7 @@ test('should work with stray JSX import', async ({ runInlineTest }) => { test('should work with stray JS import', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ` `, @@ -234,7 +224,7 @@ test('should work with stray JS import', async ({ runInlineTest }) => { test('should work with JSX in variable', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ` `, @@ -262,7 +252,7 @@ test('should work with JSX in variable', async ({ runInlineTest }) => { test('should return root locator for fragments', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.js': ``, @@ -288,7 +278,7 @@ test('should return root locator for fragments', async ({ runInlineTest }) => { test('should respect default property values', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/label.tsx': ` @@ -312,7 +302,7 @@ test('should respect default property values', async ({ runInlineTest }) => { test('should bundle public folder', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ` `, @@ -345,7 +335,7 @@ test('should bundle public folder', async ({ runInlineTest }) => { test('should work with property expressions in JSX', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ` `, @@ -470,7 +460,7 @@ test('should prioritize the vite host config over the baseUrl config', async ({ test('should normalize children', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/component.tsx': ` @@ -504,7 +494,7 @@ test('should normalize children', async ({ runInlineTest }) => { test('should allow props children', async ({ runInlineTest }) => { const result = await runInlineTest({ - 'playwright.config.ts': playwrightConfig, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/component.spec.tsx': ` diff --git a/tests/playwright-test/watch.spec.ts b/tests/playwright-test/watch.spec.ts index 5239d9fd97..c4b978819f 100644 --- a/tests/playwright-test/watch.spec.ts +++ b/tests/playwright-test/watch.spec.ts @@ -15,7 +15,7 @@ */ import path from 'path'; -import { test, expect } from './playwright-test-fixtures'; +import { test, expect, playwrightCtConfigText } from './playwright-test-fixtures'; test.describe.configure({ mode: 'parallel' }); @@ -563,10 +563,7 @@ test('should not watch unfiltered files', async ({ runWatchTest, writeFiles }) = test('should run CT on changed deps', async ({ runWatchTest, writeFiles }) => { const testProcess = await runWatchTest({ - 'playwright.config.ts': ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ projects: [{name: 'default'}] }); - `, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.tsx': ` @@ -606,10 +603,7 @@ test('should run CT on changed deps', async ({ runWatchTest, writeFiles }) => { test('should run CT on indirect deps change', async ({ runWatchTest, writeFiles }) => { const testProcess = await runWatchTest({ - 'playwright.config.ts': ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ projects: [{name: 'default'}] }); - `, + 'playwright.config.ts': playwrightCtConfigText, 'playwright/index.html': ``, 'playwright/index.ts': ``, 'src/button.css': ` @@ -652,10 +646,7 @@ test('should run CT on indirect deps change', async ({ runWatchTest, writeFiles test('should run CT on indirect deps change ESM mode', async ({ runWatchTest, writeFiles }) => { const testProcess = await runWatchTest({ - 'playwright.config.ts': ` - import { defineConfig } from '@playwright/experimental-ct-react'; - export default defineConfig({ projects: [{name: 'default'}] }); - `, + 'playwright.config.ts': playwrightCtConfigText, 'package.json': `{ "type": "module" }`, 'playwright/index.html': ``, 'playwright/index.ts': ``,