@vitest/browser 5.0.0-beta.2 → 5.0.0-beta.4

package/dist/client/__vitest_browser__/orchestrator-B44yH1M4.js

@@ -0,0 +1,343 @@
+import { c as relative, n as getBrowserState, r as getConfig, t as _defineProperty } from "./defineProperty-C3k2g8Sk.js";
+import { channel, client, globalChannel } from "@vitest/browser/client";
+import { Traces } from "vitest/internal/traces";
+
+//#region src/client/ui.ts
+/* @__NO_SIDE_EFFECTS__ */
+function getUiAPI() {
+	return window.__vitest_ui_api__;
+}
+
+//#endregion
+//#region src/client/orchestrator.ts
+var ID_ALL = "__vitest_all__";
+var IframeOrchestrator = class {
+	constructor() {
+		_defineProperty(this, "cancelled", false);
+		_defineProperty(this, "recreateNonIsolatedIframe", false);
+		_defineProperty(this, "iframes", /* @__PURE__ */ new Map());
+		_defineProperty(this, "eventTarget", new EventTarget());
+		_defineProperty(this, "traces", void 0);
+		_defineProperty(this, "loggedIframe", /* @__PURE__ */ new WeakSet());
+		_defineProperty(this, "iframeEvents", /* @__PURE__ */ new WeakMap());
+		debug("init orchestrator", (/* @__PURE__ */ getBrowserState()).sessionId);
+		const otelConfig = (/* @__PURE__ */ getBrowserState()).config.experimental.openTelemetry;
+		this.traces = new Traces({
+			enabled: !!((otelConfig === null || otelConfig === void 0 ? void 0 : otelConfig.enabled) && otelConfig.browserSdkPath),
+			sdkPath: `/@fs/${otelConfig === null || otelConfig === void 0 ? void 0 : otelConfig.browserSdkPath}`
+		});
+		channel.addEventListener("message", (e) => this.onIframeEvent(e));
+		globalChannel.addEventListener("message", (e) => this.onGlobalChannelEvent(e));
+	}
+	async createTesters(options) {
+		await this.traces.waitInit();
+		this.traces.recordInitSpan(this.traces.getContextFromCarrier((/* @__PURE__ */ getBrowserState()).otelCarrier));
+		const orchestratorSpan = this.traces.startContextSpan("vitest.browser.orchestrator.run", this.traces.getContextFromCarrier(options.otelCarrier));
+		orchestratorSpan.span.setAttributes({ "vitest.browser.files": options.files.map((f) => f.filepath) });
+		const endSpan = async () => {
+			orchestratorSpan.span.end();
+			await this.traces.flush();
+		};
+		const startTime = performance.now();
+		this.cancelled = false;
+		const config = getConfig();
+		debug("create testers", ...options.files.join(", "));
+		const container = await getContainer(config);
+		if (config.browser.ui) {
+			container.setAttribute("data-ready", "true");
+			if (container.textContent) container.textContent = "";
+		}
+		if (config.browser.isolate === false) {
+			await this.runNonIsolatedTests(container, options, startTime, orchestratorSpan.context);
+			await endSpan();
+			return;
+		}
+		this.iframes.forEach((iframe) => iframe.remove());
+		this.iframes.clear();
+		for (let i = 0; i < options.files.length; i++) {
+			if (this.cancelled) {
+				await endSpan();
+				return;
+			}
+			const file = options.files[i];
+			debug("create iframe", file.filepath);
+			await this.runIsolatedTestInIframe(container, file, options, startTime, orchestratorSpan.context);
+		}
+		await endSpan();
+	}
+	async cleanupTesters() {
+		if (getConfig().browser.isolate) {
+			const files = Array.from(this.iframes.keys());
+			const ui = /* @__PURE__ */ getUiAPI();
+			if (ui && files[0]) {
+				const id = generateFileId(files[0]);
+				ui.setCurrentFileId(id);
+			}
+			return;
+		}
+		if (!this.iframes.get(ID_ALL)) return;
+		await this.sendEventToIframe({
+			event: "cleanup",
+			iframeId: ID_ALL
+		});
+		this.recreateNonIsolatedIframe = true;
+	}
+	async runNonIsolatedTests(container, options, startTime, otelContext) {
+		if (this.recreateNonIsolatedIframe) {
+			this.recreateNonIsolatedIframe = false;
+			this.iframes.get(ID_ALL).remove();
+			this.iframes.delete(ID_ALL);
+			debug("recreate non-isolated iframe");
+		}
+		if (!this.iframes.has(ID_ALL)) {
+			debug("preparing non-isolated iframe");
+			await this.prepareIframe(container, ID_ALL, startTime, otelContext);
+		}
+		const { width, height } = getConfig().browser.viewport;
+		await setIframeViewport(width, height);
+		debug("run non-isolated tests", options.files.join(", "));
+		await this.sendEventToIframe({
+			event: "execute",
+			iframeId: ID_ALL,
+			files: options.files,
+			method: options.method,
+			context: options.providedContext
+		});
+		debug("finished running tests", options.files.join(", "));
+	}
+	async runIsolatedTestInIframe(container, spec, options, startTime, otelContext) {
+		const { width, height } = getConfig().browser.viewport;
+		const file = spec.filepath;
+		if (this.iframes.has(file)) {
+			this.iframes.get(file).remove();
+			this.iframes.delete(file);
+		}
+		await this.prepareIframe(container, file, startTime, otelContext);
+		await setIframeViewport(width, height);
+		await this.sendEventToIframe({
+			event: "execute",
+			files: [spec],
+			method: options.method,
+			iframeId: file,
+			context: options.providedContext
+		});
+		await this.sendEventToIframe({
+			event: "cleanup",
+			iframeId: file
+		});
+	}
+	dispatchIframeError(error) {
+		const event = new CustomEvent("iframeerror", { detail: error });
+		this.eventTarget.dispatchEvent(event);
+		return error;
+	}
+	async prepareIframe(container, iframeId, startTime, otelContext) {
+		const iframe = this.createTestIframe(iframeId);
+		container.appendChild(iframe);
+		await new Promise((resolve, reject) => {
+			iframe.onload = () => {
+				const href = this.getIframeHref(iframe);
+				debug("iframe loaded with href", href);
+				if (href !== iframe.src) reject(this.dispatchIframeError(/* @__PURE__ */ new Error(`Cannot connect to the iframe. Did you change the location or submitted a form? If so, don't forget to call \`event.preventDefault()\` to avoid reloading the page.
+
+Received URL: ${href || "unknown due to CORS"}\nExpected: ${iframe.src}`)));
+				else if (this.iframes.has(iframeId)) {
+					const events = this.iframeEvents.get(iframe);
+					if (events === null || events === void 0 ? void 0 : events.size) this.dispatchIframeError(new Error(this.createWarningMessage(iframeId, "during a test")));
+					else this.warnReload(iframe, iframeId);
+				} else {
+					this.iframes.set(iframeId, iframe);
+					this.sendEventToIframe({
+						event: "prepare",
+						iframeId,
+						startTime,
+						otelCarrier: this.traces.getContextCarrier(otelContext)
+					}).then(resolve, (error) => reject(this.dispatchIframeError(error)));
+				}
+			};
+			iframe.onerror = (e) => {
+				if (typeof e === "string") reject(this.dispatchIframeError(new Error(e)));
+				else if (e instanceof ErrorEvent) reject(this.dispatchIframeError(e.error));
+				else reject(this.dispatchIframeError(/* @__PURE__ */ new Error(`Cannot load the iframe ${iframeId}.`)));
+			};
+		});
+		return iframe;
+	}
+	createWarningMessage(iframeId, location) {
+		return `The iframe${iframeId === ID_ALL ? "" : ` for "${iframeId}"`} was reloaded ${location}. This can lead to unexpected behavior during tests, duplicated test results or tests hanging.\n\nMake sure that your test code does not change window's location, submit forms without preventing default behavior, or imports unoptimized dependencies.\nIf you are using a framework that manipulates browser history (like React Router), consider using memory-based routing for tests. If you think this is a false positive, open an issue with a reproduction: https://github.com/vitest-dev/vitest/issues/new`;
+	}
+	warnReload(iframe, iframeId) {
+		if (this.loggedIframe.has(iframe)) return;
+		this.loggedIframe.add(iframe);
+		const message = `\x1B[41m WARNING \x1B[49m ${this.createWarningMessage(iframeId, "multiple times")}`;
+		client.rpc.sendLog("run", {
+			type: "stderr",
+			time: Date.now(),
+			content: message,
+			size: message.length,
+			taskId: iframeId === ID_ALL ? void 0 : generateFileId(iframeId)
+		}).catch(() => {});
+	}
+	getIframeHref(iframe) {
+		try {
+			var _iframe$contentWindow;
+			return (_iframe$contentWindow = iframe.contentWindow) === null || _iframe$contentWindow === void 0 ? void 0 : _iframe$contentWindow.location.href;
+		} catch {
+			return;
+		}
+	}
+	createTestIframe(iframeId) {
+		const iframe = document.createElement("iframe");
+		const src = `/?sessionId=${(/* @__PURE__ */ getBrowserState()).sessionId}&iframeId=${iframeId}`;
+		const config = getConfig();
+		iframe.setAttribute("loading", "eager");
+		iframe.setAttribute("src", src);
+		iframe.setAttribute("data-vitest", "true");
+		iframe.setAttribute("allowfullscreen", "true");
+		iframe.setAttribute("allow", "clipboard-write;");
+		iframe.setAttribute("name", "vitest-iframe");
+		iframe.style.setProperty("border", "none");
+		iframe.style.setProperty("background-color", "#fff");
+		iframe.style.setProperty("width", "var(--viewport-width)");
+		iframe.style.setProperty("height", "var(--viewport-height)");
+		if (config.browser.ui) {
+			if (config.browser.name !== "firefox") iframe.style.setProperty("transform", "scale(min(1, calc(100cqw / var(--viewport-width)), calc(100cqh / var(--viewport-height))))");
+			else {
+				iframe.style.setProperty("--container-width", "100cqw");
+				iframe.style.setProperty("--container-height", "100cqh");
+				iframe.style.setProperty("transform", "scale(min(1, tan(atan2(var(--container-width), var(--viewport-width))), tan(atan2(var(--container-height), var(--viewport-height)))))");
+			}
+			iframe.style.setProperty("transform-origin", "top left");
+		}
+		return iframe;
+	}
+	async onGlobalChannelEvent(e) {
+		debug("global channel event", JSON.stringify(e.data));
+		switch (e.data.type) {
+			case "cancel":
+				this.cancelled = true;
+				break;
+		}
+	}
+	async onIframeEvent(e) {
+		debug("iframe event", JSON.stringify(e.data));
+		switch (e.data.event) {
+			case "viewport": {
+				const { width, height, iframeId: id } = e.data;
+				if (!this.iframes.get(id)) {
+					const error = `Cannot find iframe with id ${id}`;
+					channel.postMessage({
+						event: "viewport:fail",
+						iframeId: id,
+						error
+					});
+					await client.rpc.onUnhandledError({
+						name: "Teardown Error",
+						message: error
+					}, "Teardown Error");
+					break;
+				}
+				await setIframeViewport(width, height);
+				channel.postMessage({
+					event: "viewport:done",
+					iframeId: id
+				});
+				break;
+			}
+			default:
+				if (typeof e.data.event === "string" && e.data.event.startsWith("response:")) break;
+				await client.rpc.onUnhandledError({
+					name: "Unexpected Event",
+					message: `Unexpected event: ${e.data.event}`
+				}, "Unexpected Event");
+		}
+	}
+	async sendEventToIframe(event) {
+		const iframe = this.iframes.get(event.iframeId);
+		if (!iframe) throw new Error(`Cannot find iframe with id ${event.iframeId}`);
+		let events = this.iframeEvents.get(iframe);
+		if (!events) {
+			events = /* @__PURE__ */ new Set();
+			this.iframeEvents.set(iframe, events);
+		}
+		events.add(event.event);
+		channel.postMessage(event);
+		return new Promise((resolve, reject) => {
+			const cleanupEvents = () => {
+				channel.removeEventListener("message", onReceived);
+				this.eventTarget.removeEventListener("iframeerror", onError);
+			};
+			function onReceived(e) {
+				if (e.data.iframeId === event.iframeId && e.data.event === `response:${event.event}`) {
+					resolve();
+					cleanupEvents();
+					events.delete(event.event);
+				}
+			}
+			function onError(e) {
+				reject(e.detail);
+				cleanupEvents();
+				events.delete(event.event);
+			}
+			this.eventTarget.addEventListener("iframeerror", onError);
+			channel.addEventListener("message", onReceived);
+		});
+	}
+};
+var orchestrator = new IframeOrchestrator();
+(/* @__PURE__ */ getBrowserState()).orchestrator = orchestrator;
+async function getContainer(config) {
+	if (config.browser.ui) {
+		const element = document.querySelector("#tester-ui");
+		if (!element) return new Promise((resolve) => {
+			queueMicrotask(() => {
+				resolve(getContainer(config));
+			});
+		});
+		return element;
+	}
+	return document.querySelector("#vitest-tester");
+}
+function generateFileId(file) {
+	const config = getConfig();
+	return generateFileHash(relative(config.root, file), config.name, {
+		typecheck: config.pool === "typescript",
+		__vitest_label__: config.mergeReportsLabel
+	});
+}
+function generateFileHash(file, projectName, meta) {
+	return generateHash([
+		file,
+		projectName || "",
+		(meta === null || meta === void 0 ? void 0 : meta.typecheck) ? "__typecheck__" : "",
+		(meta === null || meta === void 0 ? void 0 : meta.__vitest_label__) || ""
+	].join("\0"));
+}
+function generateHash(str) {
+	let hash = 0;
+	if (str.length === 0) return `${hash}`;
+	for (let i = 0; i < str.length; i++) {
+		const char = str.charCodeAt(i);
+		hash = (hash << 5) - hash + char;
+		hash = hash & hash;
+	}
+	return `${hash}`;
+}
+async function setIframeViewport(width, height) {
+	const ui = /* @__PURE__ */ getUiAPI();
+	if (ui) await ui.setIframeViewport(width, height);
+	else {
+		document.body.style.setProperty("--viewport-width", `${width}px`);
+		document.body.style.setProperty("--viewport-height", `${height}px`);
+		await client.rpc.triggerCommand((/* @__PURE__ */ getBrowserState()).sessionId, "__vitest_viewport", void 0, [{
+			width,
+			height
+		}]);
+	}
+}
+function debug(...args) {
+	const debug = getConfig().env.VITEST_BROWSER_DEBUG;
+	if (debug && debug !== "false") client.rpc.debug(...args.map(String));
+}
+
+//#endregion