@ralphralphai/playwright 2.4.0 → 2.5.0

package/dist/{upload-CUtC_rnN.mjs → upload-jup_jLlm.mjs}

@@ -45,7 +45,7 @@ function snapshot(value) {
 }
 //#endregion
 //#region package.json
-var version = "2.4.0";
+var version = "2.5.0";
 //#endregion
 //#region src/actions.ts
 const BINDING = "__ralphAction";
@@ -703,6 +703,8 @@ function keepShown(node, viewportWidth) {
 		return kept === void 0 ? [] : [kept];
 	});
 	if (!shown && children.length === 0) return;
+	const [only] = children;
+	if (node.role === "generic" && !node.name && (node.children?.length ?? 0) > 1 && children.length === 1 && typeof only !== "string" && only?.ref !== void 0) return only;
 	return node.children === void 0 ? node : {
 		...node,
 		children
@@ -800,6 +802,179 @@ async function describe(page, child, inherited, insideDynamic) {
 	};
 }
 //#endregion
+//#region src/animation_observer.ts
+/** Runs in the page. Keeps native animations and DOM changes observable without app hooks. */
+function observeAnimations() {
+	const paused = /* @__PURE__ */ new Set();
+	const roots = /* @__PURE__ */ new Set();
+	let dirty = true;
+	const observer = new MutationObserver(() => {
+		dirty = true;
+	});
+	const collect = (root, all) => {
+		if (!roots.has(root)) {
+			roots.add(root);
+			observer.observe(root, {
+				subtree: true,
+				childList: true,
+				attributes: true,
+				characterData: true
+			});
+			dirty = true;
+		}
+		root.getAnimations().forEach((animation) => all.add(animation));
+		for (const element of root.querySelectorAll("*")) if (element.shadowRoot) collect(element.shadowRoot, all);
+	};
+	return {
+		sample(finishFinite) {
+			const all = /* @__PURE__ */ new Set();
+			collect(document, all);
+			let changed = dirty;
+			dirty = false;
+			for (const animation of all) {
+				if (animation.playState !== "running") continue;
+				if (finishFinite && animation.playbackRate !== 0 && Number.isFinite(animation.effect?.getComputedTiming().endTime)) animation.finish();
+				else {
+					animation.pause();
+					paused.add(animation);
+				}
+				changed = true;
+			}
+			return changed;
+		},
+		async ready() {
+			await Promise.all([...paused].map((animation) => animation.ready));
+		},
+		resume() {
+			observer.disconnect();
+			for (const animation of paused) if (animation.playState === "paused") animation.play();
+		}
+	};
+}
+//#endregion
+//#region src/capture_freezer.ts
+const PAUSE_LEAD_MS = 100;
+const ANIMATION_QUIET_MS = 150;
+const MAX_ANIMATION_SETTLE_MS = 1500;
+/** One owner of the context-wide clock; captures in different tabs queue here. */
+var CaptureFreezer = class {
+	context;
+	tail = Promise.resolve();
+	closed = false;
+	constructor(context) {
+		this.context = context;
+		context.once("close", () => {
+			this.closed = true;
+		});
+	}
+	install() {
+		if (this.context.pages().some((page) => page.url() !== "about:blank")) throw new Error("Ralph freezeDuringCapture requires the clock before page scripts run. Await ralph.observe(context) before creating or navigating pages in a custom context.");
+		return this.context.clock.install();
+	}
+	async capture(page, signal, capture, deadline = Date.now() + 5e3) {
+		const task = this.tail.then(async () => {
+			signal.throwIfAborted();
+			const animations = /* @__PURE__ */ new Map();
+			try {
+				await this.settleAnimations(page, animations, signal, deadline);
+				await this.pauseClock(page, signal);
+				signal.throwIfAborted();
+				for (let pass = 0; pass < 2; pass++) {
+					await this.sampleAnimations(page, animations, signal, false);
+					await this.waitForAnimationsReady(animations, signal);
+				}
+				return await capture();
+			} finally {
+				try {
+					await this.resumeAnimations(animations);
+				} finally {
+					if (!this.closed) await this.context.clock.resume();
+				}
+			}
+		});
+		this.tail = task.catch(() => void 0);
+		return task;
+	}
+	async settleAnimations(page, animations, signal, deadline) {
+		const now = Date.now();
+		const endsAt = now + Math.min(MAX_ANIMATION_SETTLE_MS, Math.max(0, (deadline - now) / 2));
+		let quietSince = now;
+		while (Date.now() < endsAt) {
+			if (await this.sampleAnimations(page, animations, signal, true)) quietSince = Date.now();
+			if (Date.now() - quietSince >= ANIMATION_QUIET_MS) return;
+			await setTimeout$1(Math.max(0, Math.min(50, endsAt - Date.now())), void 0, { signal }).catch((error) => {
+				signal.throwIfAborted();
+				throw error;
+			});
+		}
+	}
+	async sampleAnimations(page, animations, signal, finishFinite) {
+		let changed = false;
+		for (const frame of page.frames()) {
+			signal.throwIfAborted();
+			try {
+				let handle = animations.get(frame);
+				if (!handle) {
+					handle = await frame.evaluateHandle(observeAnimations);
+					animations.set(frame, handle);
+				}
+				changed = await handle.evaluate((state, finish) => state.sample(finish), finishFinite) || changed;
+			} catch (error) {
+				if (!frame.isDetached()) throw error;
+			}
+		}
+		signal.throwIfAborted();
+		return changed;
+	}
+	async waitForAnimationsReady(animations, signal) {
+		signal.throwIfAborted();
+		let onAbort;
+		const aborted = new Promise((_, reject) => {
+			onAbort = () => reject(signal.reason);
+			signal.addEventListener("abort", onAbort, { once: true });
+		});
+		try {
+			await Promise.race([Promise.all([...animations].map(async ([frame, handle]) => {
+				if (frame.isDetached()) return;
+				try {
+					await handle.evaluate((state) => state.ready());
+				} catch (error) {
+					if (!frame.isDetached()) throw error;
+				}
+			})), aborted]);
+		} finally {
+			signal.removeEventListener("abort", onAbort);
+		}
+	}
+	async resumeAnimations(animations) {
+		const restored = await Promise.allSettled([...animations.values()].map(async (handle) => {
+			try {
+				await handle.evaluate((state) => state.resume());
+			} catch (error) {
+				if (!destroyedContext(error)) throw error;
+			} finally {
+				await handle.dispose();
+			}
+		}));
+		for (const result of restored) if (result.status === "rejected") throw result.reason;
+	}
+	async pauseClock(page, signal) {
+		for (let attempt = 0;; attempt++) {
+			const time = await page.evaluate(() => Date.now());
+			signal.throwIfAborted();
+			try {
+				await this.context.clock.pauseAt(time + PAUSE_LEAD_MS);
+				return;
+			} catch (error) {
+				if (attempt > 0 || !(error instanceof Error) || !error.message.includes("Cannot fast-forward to the past")) throw error;
+			}
+		}
+	}
+};
+function destroyedContext(error) {
+	return error instanceof Error && /Execution context was destroyed|Cannot find context|Target page, context or browser has been closed|Frame was detached/.test(error.message);
+}
+//#endregion
 //#region src/conditions.ts
 const declared = (declaration = {}) => {
 	const conditions = {};
@@ -861,11 +1036,11 @@ function nodeKey(conditions) {
 */
 const WEBP_QUALITY = 80;
 const WEBP_MAX_DIMENSION = 16383;
-async function takeScreenshot(page, deadline) {
+async function takeScreenshot(page, deadline, frozen = false) {
 	const options = {
 		fullPage: true,
 		scale: "css",
-		animations: "disabled"
+		animations: frozen ? "allow" : "disabled"
 	};
 	const webp = await page.screenshot({
 		...options,
@@ -1094,22 +1269,30 @@ var Recorder = class {
 	/** Starts recording URL changes in every current and future tab of `context`. */
 	observe(context) {
 		if (this.closed) throw new Error("The Ralph recorder has finished.");
-		if (this.contexts.has(context)) return;
+		const existing = this.contexts.get(context);
+		if (existing) return existing.ready;
+		const freezer = this.options.freezeDuringCapture ? new CaptureFreezer(context) : void 0;
+		const ready = freezer?.install() ?? Promise.resolve();
 		const onPage = (page) => this.watchPage(page);
-		this.contexts.set(context, onPage);
+		this.contexts.set(context, {
+			onPage,
+			ready,
+			freezer
+		});
 		this.actions.observe(context);
 		context.on("page", onPage);
 		for (const page of context.pages()) onPage(page);
+		return ready;
 	}
 	async recordNode(page, options) {
-		this.observe(page.context());
+		await this.observe(page.context());
 		const state = this.pages.get(page);
 		if (!state) throw new Error("Cannot record a closed browser page.");
 		if (this.paused) return;
 		await this.enqueueCreateNodeRequest(state, "explicit", options);
 	}
 	async setNodeConditions(page, declaration) {
-		this.observe(page.context());
+		await this.observe(page.context());
 		const state = this.pages.get(page);
 		if (!state) throw new Error("Cannot tag a closed browser page.");
 		const key = Symbol();
@@ -1140,8 +1323,11 @@ var Recorder = class {
 	}
 	/** Stops watching `context` and waits for its queued recordings. */
 	async stopContext(context) {
-		const onPage = this.contexts.get(context);
-		if (onPage) context.off("page", onPage);
+		const observed = this.contexts.get(context);
+		if (observed) {
+			context.off("page", observed.onPage);
+			await observed.ready;
+		}
 		const states = [...this.pages.values()].filter((state) => state.page.context() === context);
 		for (const state of states) state.page.off("framenavigated", state.onNavigation);
 		await Promise.all(states.map((state) => state.tail));
@@ -1257,6 +1443,7 @@ var Recorder = class {
 		};
 		try {
 			check();
+			await wait(this.contexts.get(page.context()).ready);
 			if (request.trigger !== "explicit") await this.waitForPageToSettle(page, deadline, check);
 			check();
 			const conditions = this.declaredConditions(state);
@@ -1269,18 +1456,27 @@ var Recorder = class {
 				warnedNoTracker = true;
 				console.warn("Ralph: this page runs no tracker, so the node conditions the test declares cannot be checked against the tags the app reports. Production events must carry the same tags, or these nodes will match no visitors.");
 			}
-			if (this.options.reduceMotion) {
+			const freezer = this.contexts.get(page.context()).freezer;
+			if (this.options.reduceMotion && !freezer) {
 				check();
 				await wait(waitForAnimations(page, (deadline.endsAt - Date.now()) / 2));
 			}
-			check();
-			const before = await wait(readLayout(page));
-			check();
-			const image = await wait(takeScreenshot(page, deadline.endsAt));
-			check();
-			const after = await wait(readLayout(page));
-			check();
-			const snapshot = await Promise.race([captureAriaSnapshot(page, after).catch(() => void 0), setTimeout$1(Math.max(0, deadline.endsAt - Date.now()), void 0, { ref: false })]);
+			const capture = async () => {
+				check();
+				const before = await wait(readLayout(page));
+				check();
+				const image = await wait(takeScreenshot(page, deadline.endsAt, !!freezer));
+				check();
+				const after = await wait(readLayout(page));
+				check();
+				return {
+					before,
+					image,
+					after,
+					snapshot: await Promise.race([captureAriaSnapshot(page, after).catch(() => void 0), setTimeout$1(Math.max(0, deadline.endsAt - Date.now()), void 0, { ref: false })])
+				};
+			};
+			const { before, image, after, snapshot } = freezer ? await freezer.capture(page, deadline.signal, capture, deadline.endsAt) : await capture();
 			checkPage();
 			const recorded = {
 				...request,
@@ -1711,4 +1907,4 @@ async function responseDetail(response) {
 //#endregion
 export { resolveMode as _, prepareArtifactUpload as a, resultLink as c, REPORTER_ENV as d, Recorder as f, loadConfigSync as g, loadConfig as h, createRawGraphBundle as i, uploadRawGraph as l, version as m, bundleImagePath as n, registerDeployment as o, visitAllLinks as p, bundleSnapshotPath as r, resolveUploadOptions as s, RAW_GRAPH_BUNDLE_INDEX as t, MANIFEST_ATTACHMENT as u };
 
-//# sourceMappingURL=upload-CUtC_rnN.mjs.map
+//# sourceMappingURL=upload-jup_jLlm.mjs.map