@vitest/browser-playwright 5.0.0-beta.5 → 5.0.0-beta.7

package/dist/index.js

@@ -1,4 +1,4 @@
-import { parseKeyDef, resolveScreenshotPath, defineBrowserProvider } from '@vitest/browser';
+import { parseKeyDef, resolveScreenshotPath, assertBrowserApiWrite, assertBrowserFileAccess, defineBrowserProvider } from '@vitest/browser';
 export { defineBrowserCommand } from '@vitest/browser';
 import { createManualModuleSource } from '@vitest/mocker/node';
 import c from 'tinyrainbow';
@@ -522,6 +522,8 @@ async function takeScreenshot(context, name, options) {
 	let savePath;
 	if (options.save) {
 		savePath = normalize(path);
+		assertBrowserApiWrite(context.project, savePath);
+		assertBrowserFileAccess(context.project, savePath);
 		await mkdir(dirname(savePath), { recursive: true });
 	}
 	const mask = options.mask?.map((selector) => getDescribedLocator(context, selector));
@@ -622,6 +624,8 @@ const startChunkTrace = async (command, { name, title }) => {
 const stopChunkTrace = async (context, { name }) => {
 	if (isPlaywrightProvider(context.provider)) {
 		const path = resolveTracesPath(context, name);
+		assertBrowserApiWrite(context.project, path);
+		assertBrowserFileAccess(context.project, path);
 		context.provider.pendingTraces.delete(path);
 		await context.context.tracing.stopChunk({ path });
 		return { tracePath: path };
@@ -708,6 +712,10 @@ const deleteTracing = async (context, { traces }) => {
 		throw new Error(`stopChunkTrace cannot be called outside of the test file.`);
 	}
 	if (isPlaywrightProvider(context.provider)) {
+		for (const trace of traces) {
+			assertBrowserApiWrite(context.project, trace);
+			assertBrowserFileAccess(context.project, trace);
+		}
 		return Promise.all(traces.map((trace) => unlink(trace).catch((err) => {
 			if (err.code === "ENOENT") {
 				// Ignore the error if the file doesn't exist
@@ -722,6 +730,8 @@ const deleteTracing = async (context, { traces }) => {
 const annotateTraces = async ({ project }, { testId, traces }) => {
 	const vitest = project.vitest;
 	await Promise.all(traces.map((trace) => {
+		assertBrowserApiWrite(project, trace);
+		assertBrowserFileAccess(project, trace);
 		const entity = vitest.state.getReportedEntityById(testId);
 		const location = entity?.location ? {
 			file: entity.module.moduleId,
@@ -766,7 +776,9 @@ const upload = async (context, selector, files, options) => {
 	const root = context.project.config.root;
 	const playwrightFiles = files.map((file) => {
 		if (typeof file === "string") {
-			return resolve(root, file);
+			const filepath = resolve(root, file);
+			assertBrowserFileAccess(context.project, filepath);
+			return filepath;
 		}
 		return {
 			name: file.name,
@@ -835,11 +847,102 @@ function playwright(options = {}) {
 		name: "playwright",
 		supportedBrowser: playwrightBrowsers,
 		options,
+		prewarm(ctx) {
+			prewarmBrowser(ctx, options);
+		},
 		providerFactory(project) {
 			return new PlaywrightBrowserProvider(project, options);
 		}
 	});
 }
+// The resolved config object is passed unchanged to the eventual TestProject,
+// so it identifies the browser this project can adopt.
+const warmBrowsers = new WeakMap();
+const pendingWarmBrowsers = new WeakMap();
+// starts importing playwright and launching the browser while the node side
+// is still creating the vite server, so the launch latency overlaps it. The
+// launch options are resolved by the same code as the real launch — if they
+// still differ by the time the provider opens the browser, the warm instance
+// is discarded, so this is always safe
+function prewarmBrowser(project, options) {
+	const browserName = project.config.browser.name;
+	if (options.connectOptions || options.persistentContext || project.vitest.config.inspector.enabled) {
+		return;
+	}
+	if (!browserName || !playwrightBrowsers.includes(browserName)) {
+		return;
+	}
+	if (warmBrowsers.has(project.config)) {
+		return;
+	}
+	let pending = pendingWarmBrowsers.get(project.vitest);
+	if (!pending) {
+		const pendingBrowsers = new Set();
+		pending = pendingBrowsers;
+		pendingWarmBrowsers.set(project.vitest, pendingBrowsers);
+		// Browsers whose projects never initialize a provider (they have no test
+		// files to run) are cleaned up when Vitest closes.
+		project.vitest.onClose(() => closeWarmBrowsers(pendingBrowsers));
+	}
+	const launchOptions = resolveLaunchOptions(project.config.browser, project.vitest.config.inspector, options, browserName);
+	const entry = {
+		launchOptionsJson: JSON.stringify(launchOptions),
+		pending,
+		promise: (async () => {
+			debug?.("[%s] prewarming the browser", browserName);
+			const playwright = await import('playwright');
+			return playwright[browserName].launch(launchOptions);
+		})()
+	};
+	// if the warm launch fails, drop it so the real launch retries
+	// and surfaces the error through the normal path
+	entry.promise.catch(() => {
+		if (warmBrowsers.get(project.config) === entry) {
+			warmBrowsers.delete(project.config);
+			entry.pending.delete(entry);
+		}
+	});
+	pending.add(entry);
+	warmBrowsers.set(project.config, entry);
+}
+function takeWarmBrowser(config) {
+	const warm = warmBrowsers.get(config);
+	if (warm) {
+		warmBrowsers.delete(config);
+		warm.pending.delete(warm);
+	}
+	return warm;
+}
+async function closeWarmBrowsers(pending) {
+	const closing = Array.from(pending, (warm) => warm.promise.then((browser) => browser.close()).catch(() => {}));
+	pending.clear();
+	await Promise.all(closing);
+}
+function resolveLaunchOptions(browser, inspector, providerOptions, browserName) {
+	const launchOptions = {
+		...providerOptions.launchOptions,
+		headless: browser.headless
+	};
+	if (typeof browser.trace === "object" && browser.trace.tracesDir) {
+		launchOptions.tracesDir = browser.trace.tracesDir;
+	}
+	if (inspector.enabled) {
+		// NodeJS equivalent defaults: https://nodejs.org/en/learn/getting-started/debugging#enable-inspector
+		const port = inspector.port || 9229;
+		launchOptions.args ||= [];
+		launchOptions.args.push(`--remote-debugging-port=${port}`);
+	}
+	// start Vitest UI maximized only on supported browsers
+	if (browser.ui && browserName === "chromium") {
+		if (!launchOptions.args) {
+			launchOptions.args = [];
+		}
+		if (!launchOptions.args.includes("--start-maximized") && !launchOptions.args.includes("--start-fullscreen")) {
+			launchOptions.args.push("--start-maximized");
+		}
+	}
+	return launchOptions;
+}
 class PlaywrightBrowserProvider {
 	name = "playwright";
 	supportsParallelism = true;
@@ -889,36 +992,17 @@ class PlaywrightBrowserProvider {
 			return this.browser;
 		}
 		this.browserPromise = (async () => {
-			const options = this.project.config.browser;
 			const playwright = await import('playwright');
-			const launchOptions = {
-				...this.options.launchOptions,
-				headless: options.headless
-			};
-			if (typeof options.trace === "object" && options.trace.tracesDir) {
-				launchOptions.tracesDir = options.trace?.tracesDir;
-			}
+			const launchOptions = resolveLaunchOptions(this.project.config.browser, this.project.vitest.config.inspector, this.options, this.browserName);
 			const inspector = this.project.vitest.config.inspector;
 			if (inspector.enabled) {
-				// NodeJS equivalent defaults: https://nodejs.org/en/learn/getting-started/debugging#enable-inspector
 				const port = inspector.port || 9229;
 				const host = inspector.host || "127.0.0.1";
-				launchOptions.args ||= [];
-				launchOptions.args.push(`--remote-debugging-port=${port}`);
 				if (host !== "localhost" && host !== "127.0.0.1" && host !== "::1") {
 					this.project.vitest.logger.warn(`Custom inspector host "${host}" will be ignored. Chromium only allows remote debugging on localhost.`);
 				}
 				this.project.vitest.logger.log(`Debugger listening on ws://127.0.0.1:${port}`);
 			}
-			// start Vitest UI maximized only on supported browsers
-			if (this.project.config.browser.ui && this.browserName === "chromium") {
-				if (!launchOptions.args) {
-					launchOptions.args = [];
-				}
-				if (!launchOptions.args.includes("--start-maximized") && !launchOptions.args.includes("--start-fullscreen")) {
-					launchOptions.args.push("--start-maximized");
-				}
-			}
 			debug?.("[%s] initializing the browser with launch options: %O", this.browserName, launchOptions);
 			if (this.options.connectOptions) {
 				let { wsEndpoint, headers = {}, ...connectOptions } = this.options.connectOptions;
@@ -951,6 +1035,19 @@ class PlaywrightBrowserProvider {
 				});
 				this.browser = this.persistentContext.browser();
 			} else {
+				const warm = takeWarmBrowser(this.project.config);
+				if (warm && warm.launchOptionsJson === JSON.stringify(launchOptions)) {
+					const browser = await warm.promise.catch(() => null);
+					if (browser?.isConnected()) {
+						debug?.("[%s] adopting the prewarmed browser", this.browserName);
+						this.browser = browser;
+						this.browserPromise = null;
+						return this.browser;
+					}
+				} else if (warm) {
+					debug?.("[%s] discarding the prewarmed browser, launch options changed", this.browserName);
+					void warm.promise.then((browser) => browser.close()).catch(() => {});
+				}
 				this.browser = await playwright[this.browserName].launch(launchOptions);
 			}
 			this.browserPromise = null;
@@ -1069,7 +1166,7 @@ class PlaywrightBrowserProvider {
 			clear: async (sessionId) => {
 				const page = this.getPage(sessionId);
 				const ids = sessionIds.get(sessionId) ?? new Set();
-				const promises = [...ids].map((id) => {
+				const promises = Array.from(ids, (id) => {
 					const key = predicateKey(sessionId, id);
 					const predicate = idPredicates.get(key);
 					if (predicate) {
@@ -1111,7 +1208,11 @@ class PlaywrightBrowserProvider {
 			...contextOptions,
 			ignoreHTTPSErrors: true
 		};
-		if (this.project.config.browser.ui) {
+		// A `null` viewport lets the page adopt the real window size, which is only
+		// meaningful for a headed UI. In headless mode there is no real window, so it
+		// would inherit the host's device scale factor and produce screenshots that
+		// differ from non-UI runs on the same machine.
+		if (this.project.config.browser.ui && !this.project.config.browser.headless) {
 			options.viewport = null;
 		}
 		return options;
@@ -1201,18 +1302,23 @@ class PlaywrightBrowserProvider {
 		process.off("SIGTERM", this.onSIGTERM);
 		debug?.("[%s] closing provider", this.browserName);
 		this.closing = true;
+		// a prewarmed browser that was never adopted must not outlive the provider
+		const warm = takeWarmBrowser(this.project.config);
+		if (warm) {
+			void warm.promise.then((browser) => browser.close()).catch(() => {});
+		}
 		if (this.browserPromise) {
 			await this.browserPromise;
 			this.browserPromise = null;
 		}
 		const browser = this.browser;
 		this.browser = null;
-		await Promise.all([...this.pages.values()].map((p) => p.close()));
+		await Promise.all(Array.from(this.pages.values(), (p) => p.close()));
 		this.pages.clear();
 		if (this.persistentContext) {
 			await this.persistentContext.close();
 		} else {
-			await Promise.all([...this.contexts.values()].map((c) => c.close()));
+			await Promise.all(Array.from(this.contexts.values(), (c) => c.close()));
 		}
 		this.contexts.clear();
 		await browser?.close();

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@vitest/browser-playwright",
   "type": "module",
-  "version": "5.0.0-beta.5",
+  "version": "5.0.0-beta.7",
   "description": "Browser running for Vitest using playwright",
   "license": "MIT",
   "funding": "https://opencollective.com/vitest",
@@ -42,7 +42,7 @@
   ],
   "peerDependencies": {
     "playwright": "*",
-    "vitest": "5.0.0-beta.5"
+    "vitest": "5.0.0-beta.7"
   },
   "peerDependenciesMeta": {
     "playwright": {
@@ -51,12 +51,12 @@
   },
   "dependencies": {
     "tinyrainbow": "^3.1.0",
-    "@vitest/browser": "5.0.0-beta.5",
-    "@vitest/mocker": "5.0.0-beta.5"
+    "@vitest/browser": "5.0.0-beta.7",
+    "@vitest/mocker": "5.0.0-beta.7"
   },
   "devDependencies": {
-    "playwright": "^1.60.0",
-    "vitest": "5.0.0-beta.5"
+    "playwright": "^1.61.0",
+    "vitest": "5.0.0-beta.7"
   },
   "scripts": {
     "build": "premove dist && pnpm rollup -c",