From dc36b0158a9c688fbf6cf83942c290c0ffdff57e Mon Sep 17 00:00:00 2001 From: Pavel Feldman Date: Fri, 6 May 2022 13:53:38 -0800 Subject: [PATCH] chore: dedupe ct fixtures (#14002) --- packages/playwright-ct-react/index.js | 28 +------------- packages/playwright-ct-svelte/index.js | 28 +------------- packages/playwright-ct-vue/index.js | 28 +------------- packages/playwright-test/src/mount.ts | 38 +++++++++++++++---- .../playwright-test/src/plugins/vitePlugin.ts | 2 +- 5 files changed, 37 insertions(+), 87 deletions(-) diff --git a/packages/playwright-ct-react/index.js b/packages/playwright-ct-react/index.js index 1cfa5de35b..ee45d28d91 100644 --- a/packages/playwright-ct-react/index.js +++ b/packages/playwright-ct-react/index.js @@ -15,7 +15,7 @@ */ const { test: baseTest, expect, devices, _addRunnerPlugin } = require('@playwright/test'); -const { mount } = require('@playwright/test/lib/mount'); +const { fixtures } = require('@playwright/test/lib/mount'); const path = require('path'); _addRunnerPlugin(() => { @@ -26,30 +26,6 @@ _addRunnerPlugin(() => { () => require('@vitejs/plugin-react')()); }); -const test = baseTest.extend({ - _workerPage: [async ({ browser }, use) => { - const page = await browser._wrapApiCall(async () => { - const page = await browser.newPage(); - await page.addInitScript('navigator.serviceWorker.register = () => {}'); - return page; - }); - await use(page); - }, { scope: 'worker' }], - - context: async ({ page }, use) => { - await use(page.context()); - }, - - page: async ({ _workerPage }, use) => { - await use(_workerPage); - }, - - mount: async ({ page, baseURL, viewport }, use) => { - await use(async (component, options) => { - const selector = await mount(page, component, options, baseURL, viewport); - return page.locator(selector); - }); - }, -}); +const test = baseTest.extend(fixtures); module.exports = { test, expect, devices }; diff --git a/packages/playwright-ct-svelte/index.js b/packages/playwright-ct-svelte/index.js index ebdf48a25e..bb2c91837a 100644 --- a/packages/playwright-ct-svelte/index.js +++ b/packages/playwright-ct-svelte/index.js @@ -15,7 +15,7 @@ */ const { test: baseTest, expect, devices, _addRunnerPlugin } = require('@playwright/test'); -const { mount } = require('@playwright/test/lib/mount'); +const { fixtures } = require('@playwright/test/lib/mount'); const path = require('path'); _addRunnerPlugin(() => { @@ -26,30 +26,6 @@ _addRunnerPlugin(() => { () => require('@sveltejs/vite-plugin-svelte').svelte()); }); -const test = baseTest.extend({ - _workerPage: [async ({ browser }, use) => { - const page = await browser._wrapApiCall(async () => { - const page = await browser.newPage(); - await page.addInitScript('navigator.serviceWorker.register = () => {}'); - return page; - }); - await use(page); - }, { scope: 'worker' }], - - context: async ({ page }, use) => { - await use(page.context()); - }, - - page: async ({ _workerPage }, use) => { - await use(_workerPage); - }, - - mount: async ({ page, baseURL, viewport }, use) => { - await use(async (component, options) => { - const selector = await mount(page, component, options, baseURL, viewport); - return page.locator(selector); - }); - }, -}); +const test = baseTest.extend(fixtures); module.exports = { test, expect, devices }; diff --git a/packages/playwright-ct-vue/index.js b/packages/playwright-ct-vue/index.js index f69856f172..b73a8073e6 100644 --- a/packages/playwright-ct-vue/index.js +++ b/packages/playwright-ct-vue/index.js @@ -15,7 +15,7 @@ */ const { test: baseTest, expect, devices, _addRunnerPlugin } = require('@playwright/test'); -const { mount } = require('@playwright/test/lib/mount'); +const { fixtures } = require('@playwright/test/lib/mount'); const path = require('path'); _addRunnerPlugin(() => { @@ -26,30 +26,6 @@ _addRunnerPlugin(() => { () => require('@vitejs/plugin-vue')()); }); -const test = baseTest.extend({ - _workerPage: [async ({ browser }, use) => { - const page = await browser._wrapApiCall(async () => { - const page = await browser.newPage(); - await page.addInitScript('navigator.serviceWorker.register = () => {}'); - return page; - }); - await use(page); - }, { scope: 'worker' }], - - context: async ({ page }, use) => { - await use(page.context()); - }, - - page: async ({ _workerPage }, use) => { - await use(_workerPage); - }, - - mount: async ({ page, baseURL, viewport }, use) => { - await use(async (component, options) => { - const selector = await mount(page, component, options, baseURL, viewport); - return page.locator(selector); - }); - }, -}); +const test = baseTest.extend(fixtures); module.exports = { test, expect, devices }; diff --git a/packages/playwright-test/src/mount.ts b/packages/playwright-test/src/mount.ts index 3bb7132f9e..099aac44ce 100644 --- a/packages/playwright-test/src/mount.ts +++ b/packages/playwright-test/src/mount.ts @@ -14,21 +14,43 @@ * limitations under the License. */ -import type { Page, ViewportSize } from '@playwright/test'; +import type { Fixtures, Locator, Page, PlaywrightTestArgs, PlaywrightTestOptions, PlaywrightWorkerArgs, ViewportSize } from './types'; import { createGuid } from 'playwright-core/lib/utils'; -export async function mount(page: Page, jsxOrType: any, options: any, baseURL: string, viewport: ViewportSize): Promise { - return await (page as any)._wrapApiCall(async () => { - return await innerMount(page, jsxOrType, options, baseURL, viewport); - }, true); -} +export const fixtures: Fixtures Promise }, PlaywrightWorkerArgs & { _workerPage: Page }> = { + _workerPage: [async ({ browser }, use) => { + const page = await (browser as any)._wrapApiCall(async () => { + const page = await browser.newPage(); + await page.addInitScript('navigator.serviceWorker.register = () => {}'); + return page; + }); + await use(page); + }, { scope: 'worker' }], -async function innerMount(page: Page, jsxOrType: any, options: any, baseURL: string, viewport: ViewportSize): Promise { + context: async ({ page }, use) => { + await use(page.context()); + }, + + page: async ({ _workerPage }, use) => { + await use(_workerPage); + }, + + mount: async ({ page, viewport }, use) => { + await use(async (component, options) => { + const selector = await (page as any)._wrapApiCall(async () => { + return await innerMount(page, component, options, viewport || { width: 1280, height: 800 }); + }, true); + return page.locator(selector); + }); + }, +}; + +async function innerMount(page: Page, jsxOrType: any, options: any, viewport: ViewportSize): Promise { await page.goto('about:blank'); await (page as any)._resetForReuse(); await (page.context() as any)._resetForReuse(); await page.setViewportSize(viewport); - await page.goto(baseURL); + await page.goto(process.env.PLAYWRIGHT_VITE_COMPONENTS_BASE_URL!); let component; if (typeof jsxOrType === 'string') diff --git a/packages/playwright-test/src/plugins/vitePlugin.ts b/packages/playwright-test/src/plugins/vitePlugin.ts index 5708fbc835..8263b99060 100644 --- a/packages/playwright-test/src/plugins/vitePlugin.ts +++ b/packages/playwright-test/src/plugins/vitePlugin.ts @@ -40,7 +40,7 @@ export function createPlugin( configDir = configDirectory; - process.env.PLAYWRIGHT_TEST_BASE_URL = `http://localhost:${port}/playwright/index.html`; + process.env.PLAYWRIGHT_VITE_COMPONENTS_BASE_URL = `http://localhost:${port}/playwright/index.html`; viteConfig.root = viteConfig.root || configDir; viteConfig.plugins = viteConfig.plugins || [