From 4272983a3f88b569fd8239be46e7ba3daad2d413 Mon Sep 17 00:00:00 2001 From: Vladimir Sheremet Date: Mon, 3 Jun 2024 12:31:52 +0200 Subject: [PATCH 1/3] feat(browser): rename none provider to preview, make it default --- packages/browser/providers.d.ts | 10 +++++----- packages/browser/src/node/plugins/pluginContext.ts | 4 ++-- packages/browser/src/node/providers/index.ts | 4 ++-- .../browser/src/node/providers/{none.ts => preview.ts} | 6 +++--- packages/vitest/src/integrations/browser.ts | 10 +++------- packages/vitest/src/node/cli/cli-config.ts | 2 +- packages/vitest/src/types/browser.ts | 4 ++-- 7 files changed, 18 insertions(+), 22 deletions(-) rename packages/browser/src/node/providers/{none.ts => preview.ts} (78%) diff --git a/packages/browser/providers.d.ts b/packages/browser/providers.d.ts index ff23a3519604..1106f2d6db06 100644 --- a/packages/browser/providers.d.ts +++ b/packages/browser/providers.d.ts @@ -1,7 +1,7 @@ -import type { BrowserProvider } from 'vitest/node' +import type { BrowserProviderModule } from 'vitest/node' -declare const webdriverio: BrowserProvider -declare const playwright: BrowserProvider -declare const none: BrowserProvider +declare const webdriverio: BrowserProviderModule +declare const playwright: BrowserProviderModule +declare const preview: BrowserProviderModule -export { webdriverio, playwright, none } +export { webdriverio, playwright, preview } diff --git a/packages/browser/src/node/plugins/pluginContext.ts b/packages/browser/src/node/plugins/pluginContext.ts index 5e3ead71ec63..4a13535fcd14 100644 --- a/packages/browser/src/node/plugins/pluginContext.ts +++ b/packages/browser/src/node/plugins/pluginContext.ts @@ -116,7 +116,7 @@ function getPathTo(element) { } async function getUserEventImport(provider: BrowserProvider, resolve: (id: string, importer: string) => Promise) { - if (provider.name !== 'none') + if (provider.name !== 'preview') return '' const resolved = await resolve('@testing-library/user-event', __dirname) if (!resolved) @@ -125,7 +125,7 @@ async function getUserEventImport(provider: BrowserProvider, resolve: (id: strin } function getUserEventScript(project: WorkspaceProject) { - if (project.browserProvider?.name === 'none') + if (project.browserProvider?.name === 'preview') return `__vitest_user_event__` return `{ async click(element, options) { diff --git a/packages/browser/src/node/providers/index.ts b/packages/browser/src/node/providers/index.ts index aca17df8fde6..6618ede96e05 100644 --- a/packages/browser/src/node/providers/index.ts +++ b/packages/browser/src/node/providers/index.ts @@ -1,7 +1,7 @@ import { PlaywrightBrowserProvider } from './playwright' import { WebdriverBrowserProvider } from './webdriver' -import { NoneBrowserProvider } from './none' +import { PreviewBrowserProvider } from './preview' export const webdriverio = WebdriverBrowserProvider export const playwright = PlaywrightBrowserProvider -export const none = NoneBrowserProvider +export const preview = PreviewBrowserProvider diff --git a/packages/browser/src/node/providers/none.ts b/packages/browser/src/node/providers/preview.ts similarity index 78% rename from packages/browser/src/node/providers/none.ts rename to packages/browser/src/node/providers/preview.ts index 20613a9522d3..1ba86445452d 100644 --- a/packages/browser/src/node/providers/none.ts +++ b/packages/browser/src/node/providers/preview.ts @@ -1,7 +1,7 @@ import type { BrowserProvider, WorkspaceProject } from 'vitest/node' -export class NoneBrowserProvider implements BrowserProvider { - public name = 'none' +export class PreviewBrowserProvider implements BrowserProvider { + public name = 'preview' private ctx!: WorkspaceProject private open = false @@ -18,7 +18,7 @@ export class NoneBrowserProvider implements BrowserProvider { this.ctx = ctx this.open = false if (ctx.config.browser.headless) - throw new Error('You\'ve enabled headless mode for "none" provider but it doesn\'t support it.') + throw new Error('You\'ve enabled headless mode for "preview" provider but it doesn\'t support it.') } async openPage(_url: string) { diff --git a/packages/vitest/src/integrations/browser.ts b/packages/vitest/src/integrations/browser.ts index 277d9e484e80..4a028eb809b9 100644 --- a/packages/vitest/src/integrations/browser.ts +++ b/packages/vitest/src/integrations/browser.ts @@ -1,17 +1,13 @@ import type { WorkspaceProject } from '../node/workspace' import type { BrowserProviderModule, ResolvedBrowserOptions } from '../types/browser' -const builtinProviders = ['webdriverio', 'playwright', 'none'] +const builtinProviders = ['webdriverio', 'playwright', 'preview'] export async function getBrowserProvider(options: ResolvedBrowserOptions, project: WorkspaceProject): Promise { if (options.provider == null || builtinProviders.includes(options.provider)) { await project.ctx.packageInstaller.ensureInstalled('@vitest/browser', project.config.root) - const providers = await project.runner.executeId('@vitest/browser/providers') as { - webdriverio: BrowserProviderModule - playwright: BrowserProviderModule - none: BrowserProviderModule - } - const provider = (options.provider || 'webdriverio') as 'webdriverio' | 'playwright' | 'none' + const providers = await project.runner.executeId('@vitest/browser/providers') as typeof import('@vitest/browser/providers') + const provider = (options.provider || 'preview') as 'webdriverio' | 'playwright' | 'preview' return providers[provider] } diff --git a/packages/vitest/src/node/cli/cli-config.ts b/packages/vitest/src/node/cli/cli-config.ts index f6ead1f715f2..63ab4753a020 100644 --- a/packages/vitest/src/node/cli/cli-config.ts +++ b/packages/vitest/src/node/cli/cli-config.ts @@ -332,7 +332,7 @@ export const cliOptionsConfig: VitestCLIOptions = { subcommands: apiConfig(defaultBrowserPort), }, provider: { - description: 'Provider used to run browser tests. Some browsers are only available for specific providers. Can be "webdriverio", "playwright", or the path to a custom provider. Visit [`browser.provider`](https://vitest.dev/config/#browser-provider) for more information (default: `"webdriverio"`)', + description: 'Provider used to run browser tests. Some browsers are only available for specific providers. Can be "webdriverio", "playwright", "preview", or the path to a custom provider. Visit [`browser.provider`](https://vitest.dev/config/#browser-provider) for more information (default: `"preview"`)', argument: '', subcommands: null, // don't support custom objects }, diff --git a/packages/vitest/src/types/browser.ts b/packages/vitest/src/types/browser.ts index 9b5465d18c4f..10ba97d9165c 100644 --- a/packages/vitest/src/types/browser.ts +++ b/packages/vitest/src/types/browser.ts @@ -41,9 +41,9 @@ export interface BrowserConfigOptions { /** * Browser provider * - * @default 'webdriverio' + * @default 'preview' */ - provider?: 'webdriverio' | 'playwright' | 'none' | (string & {}) + provider?: 'webdriverio' | 'playwright' | 'preview' | (string & {}) /** * Options that are passed down to a browser provider. From b577f3eb9c646d5e265255b61d5e5600eb8bf0b7 Mon Sep 17 00:00:00 2001 From: Vladimir Sheremet Date: Mon, 3 Jun 2024 12:39:24 +0200 Subject: [PATCH 2/3] chore: finish the rename --- docs/guide/browser.md | 6 +++--- packages/browser/context.d.ts | 2 +- 2 files changed, 4 insertions(+), 4 deletions(-) diff --git a/docs/guide/browser.md b/docs/guide/browser.md index 0a46fd83230d..05bc06559a08 100644 --- a/docs/guide/browser.md +++ b/docs/guide/browser.md @@ -8,7 +8,7 @@ This page provides information about the experimental browser mode feature in th ## Installation -By default, Browser Mode doesn't require any provider to run tests locally because it reuses your existing browser. +By default, Browser Mode doesn't require any additional E2E provider to run tests locally because it reuses your existing browser. ::: code-group ```bash [npm] @@ -26,7 +26,7 @@ bun add -D vitest @vitest/browser ::: ::: warning -However, to run tests in CI you need to install either [`playwright`](https://npmjs.com/package/playwright) or [`webdriverio`](https://www.npmjs.com/package/webdriverio). We also recommend switching to either one of them for testing locally instead of using the default `none` provider since it relies on simulating events instead of using Chrome DevTools Protocol. +However, to run tests in CI you need to install either [`playwright`](https://npmjs.com/package/playwright) or [`webdriverio`](https://www.npmjs.com/package/webdriverio). We also recommend switching to either one of them for testing locally instead of using the default `preview` provider since it relies on simulating events instead of using Chrome DevTools Protocol. ::: ### Using Playwright @@ -208,7 +208,7 @@ export const server: { /** * Handler for user interactions. The support is provided by the browser provider (`playwright` or `webdriverio`). - * If used with `none` provider, fallbacks to simulated events via `@testing-library/user-event`. + * If used with `preview` provider, fallbacks to simulated events via `@testing-library/user-event`. * @experimental */ export const userEvent: { diff --git a/packages/browser/context.d.ts b/packages/browser/context.d.ts index 0e6eb1c4c932..44c9951d75d3 100644 --- a/packages/browser/context.d.ts +++ b/packages/browser/context.d.ts @@ -88,7 +88,7 @@ export const server: { /** * Handler for user interactions. The support is provided by the browser provider (`playwright` or `webdriverio`). - * If used with `none` provider, fallbacks to simulated events via `@testing-library/user-event`. + * If used with `preview` provider, fallbacks to simulated events via `@testing-library/user-event`. * @experimental */ export const userEvent: UserEvent From 64aa564f92aeef5cef9aa383feb9d2913e36b73e Mon Sep 17 00:00:00 2001 From: Vladimir Sheremet Date: Mon, 3 Jun 2024 12:53:55 +0200 Subject: [PATCH 3/3] fix: specify the provider --- examples/lit/vite.config.ts | 1 + test/browser/fixtures/mocking/vitest.config.ts | 1 - test/config/fixtures/bail/vitest.config.ts | 1 + 3 files changed, 2 insertions(+), 1 deletion(-) diff --git a/examples/lit/vite.config.ts b/examples/lit/vite.config.ts index 2ec9222e7ae7..03207e4e0492 100644 --- a/examples/lit/vite.config.ts +++ b/examples/lit/vite.config.ts @@ -10,6 +10,7 @@ export default defineConfig({ browser: { enabled: true, name: 'chrome', + provider: 'webdriverio', }, }, }) diff --git a/test/browser/fixtures/mocking/vitest.config.ts b/test/browser/fixtures/mocking/vitest.config.ts index 43d698a3716e..63c6c3b3985c 100644 --- a/test/browser/fixtures/mocking/vitest.config.ts +++ b/test/browser/fixtures/mocking/vitest.config.ts @@ -11,7 +11,6 @@ export default defineConfig({ provider, name, headless: true, - fileParallelism: false, }, }, }) diff --git a/test/config/fixtures/bail/vitest.config.ts b/test/config/fixtures/bail/vitest.config.ts index 7482dfe640d6..43f27f8a1aca 100644 --- a/test/config/fixtures/bail/vitest.config.ts +++ b/test/config/fixtures/bail/vitest.config.ts @@ -30,6 +30,7 @@ export default defineConfig({ browser: { headless: true, name: 'chrome', + provider: 'webdriverio', }, }, })