@argos-ci/vitest 0.5.0 → 0.6.1

package/dist/index.mjs

@@ -1,18 +1,32 @@
 import { getTestRunKey, nextCaptureIndex } from "@argos-ci/util";
 //#region src/test-context.ts
 /**
+* Entry point exposing `getCurrentTest` before Vitest 4.1, and removed
+* altogether in Vitest 5.
+*
+* Held in a variable rather than written inline at the import: Vite's
+* dependency pre-bundler resolves a literal specifier eagerly, and on Vitest 5
+* that fails the whole optimize step over an export that no longer exists —
+* even though the branch importing it cannot run there.
+*/
+const LEGACY_SUITE_ENTRY = "vitest/suite";
+/**
 * Get the current Vitest test task, or `undefined` when not inside a test.
 *
 * Vitest >= 4.1 exposes `TestRunner.getCurrentTest()` from the `vitest` entry
-* point; the `vitest/suite` export is deprecated. We prefer the new API and
-* fall back to `vitest/suite` for older 4.x. Both are imported dynamically so
-* importing `@argos-ci/vitest` in a non-Vitest environment does not pull Vitest
-* in — only call this once you know Vitest is available.
+* point; the `vitest/suite` export is deprecated there and gone in Vitest 5. We
+* prefer the new API and fall back to `vitest/suite` for older 4.x. Both are
+* imported dynamically so importing `@argos-ci/vitest` in a non-Vitest
+* environment does not pull Vitest in — only call this once you know Vitest is
+* available.
 */
 async function getCurrentTest() {
 	const runner = (await import("vitest")).TestRunner;
 	if (runner?.getCurrentTest) return runner.getCurrentTest();
-	return (await import("vitest/suite")).getCurrentTest();
+	return (await import(
+		/* @vite-ignore */
+		LEGACY_SUITE_ENTRY
+)).getCurrentTest();
 }
 //#endregion
 //#region src/auto-name.ts
@@ -239,7 +253,7 @@ function C({ force: e } = {}) {
 }
 var y = C();
 //#endregion
-//#region ../../node_modules/.pnpm/@vitest+pretty-format@4.1.10/node_modules/@vitest/pretty-format/dist/index.js
+//#region ../../node_modules/.pnpm/@vitest+pretty-format@5.0.0/node_modules/@vitest/pretty-format/dist/index.js
 function _mergeNamespaces(n, m) {
 	m.forEach(function(e) {
 		e && typeof e !== "string" && !Array.isArray(e) && Object.keys(e).forEach(function(k) {
@@ -269,7 +283,7 @@ function getKeysOfEnumerableProperties(object, compareKeys) {
 * with spacing, indentation, and comma
 * without surrounding punctuation (for example, braces)
 */
-function printIteratorEntries(iterator, config, indentation, depth, refs, printer, separator = ": ") {
+function printIteratorEntries(iterator, config, indentation, depth, refs, printer, separator = ": ", length) {
 	let result = "";
 	let width = 0;
 	let current = iterator.next();
@@ -279,7 +293,7 @@ function printIteratorEntries(iterator, config, indentation, depth, refs, printe
 		while (!current.done) {
 			result += indentationNext;
 			if (width++ === config.maxWidth) {
-				result += "…";
+				result += typeof length === "number" ? `…(${length - width + 1})` : "…";
 				break;
 			}
 			const name = printer(current.value[0], config, indentationNext, depth, refs);
@@ -298,7 +312,7 @@ function printIteratorEntries(iterator, config, indentation, depth, refs, printe
 * with spacing, indentation, and comma
 * without surrounding punctuation (braces or brackets)
 */
-function printIteratorValues(iterator, config, indentation, depth, refs, printer) {
+function printIteratorValues(iterator, config, indentation, depth, refs, printer, length) {
 	let result = "";
 	let width = 0;
 	let current = iterator.next();
@@ -308,7 +322,7 @@ function printIteratorValues(iterator, config, indentation, depth, refs, printer
 		while (!current.done) {
 			result += indentationNext;
 			if (width++ === config.maxWidth) {
-				result += "…";
+				result += typeof length === "number" ? `…(${length - width + 1})` : "…";
 				break;
 			}
 			result += printer(current.value, config, indentationNext, depth, refs);
@@ -336,7 +350,7 @@ function printListItems(list, config, indentation, depth, refs, printer) {
 		for (let i = 0; i < length; i++) {
 			result += indentationNext;
 			if (i === config.maxWidth) {
-				result += "…";
+				result += `…(${length - i})`;
 				break;
 			}
 			if (isDataView(list) || i in list) result += printer(isDataView(list) ? list.getInt8(i) : list[i], config, indentationNext, depth, refs);
@@ -352,17 +366,22 @@ function printListItems(list, config, indentation, depth, refs, printer) {
 * with spacing, indentation, and comma
 * without surrounding punctuation (for example, braces)
 */
-function printObjectProperties(val, config, indentation, depth, refs, printer) {
+function printObjectProperties(val, config, indentation, depth, refs, printer, compareKeysOverride = config.compareKeys) {
 	let result = "";
-	const keys = getKeysOfEnumerableProperties(val, config.compareKeys);
+	const keys = getKeysOfEnumerableProperties(val, compareKeysOverride);
 	if (keys.length > 0) {
 		result += config.spacingOuter;
 		const indentationNext = indentation + config.indent;
 		for (let i = 0; i < keys.length; i++) {
+			result += indentationNext;
+			if (i === config.maxWidth) {
+				result += `…(${keys.length - i})`;
+				break;
+			}
 			const key = keys[i];
-			const name = printer(key, config, indentationNext, depth, refs);
+			const name = !config.quoteKeys && isUnquotableKey(key) ? key : printer(key, config, indentationNext, depth, refs);
 			const value = printer(val[key], config, indentationNext, depth, refs);
-			result += `${indentationNext + name}: ${value}`;
+			result += `${name}: ${value}`;
 			if (i < keys.length - 1) result += `,${config.spacingInner}`;
 			else if (!config.min) result += ",";
 		}
@@ -370,6 +389,10 @@ function printObjectProperties(val, config, indentation, depth, refs, printer) {
 	}
 	return result;
 }
+const keyStrRegExp = /^[a-z_]\w*$/i;
+function isUnquotableKey(key) {
+	return typeof key === "string" && key !== "__proto__" && keyStrRegExp.test(key);
+}
 const asymmetricMatcher = typeof Symbol === "function" && Symbol.for ? Symbol.for("jest.asymmetricMatcher") : 1267621;
 const SPACE$2 = " ";
 const serialize$5 = (val, config, indentation, depth, refs, printer) => {
@@ -428,7 +451,7 @@ function printProps(keys, props, config, indentation, depth, refs, printer) {
 	const colors = config.colors;
 	return keys.map((key) => {
 		const value = props[key];
-		if (typeof value === "string" && value[0] === "_" && value.startsWith("__vitest_") && value.match(/__vitest_\d+__/)) return "";
+		if (typeof value === "string" && value[0] === "_" && value.startsWith("__vitest_") && /__vitest_\d+__/.test(value)) return "";
 		let printed = printer(value, config, indentationNext, depth, refs);
 		if (typeof value !== "string") {
 			if (printed.includes("\n")) printed = config.spacingOuter + indentationNext + printed + config.spacingOuter + indentation;
@@ -905,7 +928,7 @@ function printError(val) {
 * The first port of call for printing an object, handles most of the
 * data-types in JS.
 */
-function printBasicValue(val, printFunctionName, escapeRegex, escapeString) {
+function printBasicValue(val, printFunctionName, escapeRegex, escapeString, singleQuote) {
 	if (val === true || val === false) return `${val}`;
 	if (val === void 0) return "undefined";
 	if (val === null) return "null";
@@ -913,8 +936,12 @@ function printBasicValue(val, printFunctionName, escapeRegex, escapeString) {
 	if (typeOf === "number") return printNumber(val);
 	if (typeOf === "bigint") return printBigInt(val);
 	if (typeOf === "string") {
-		if (escapeString) return `"${val.replaceAll(/"|\\/g, "\\$&")}"`;
-		return `"${val}"`;
+		const q = singleQuote ? "'" : "\"";
+		if (escapeString) {
+			const escapePattern = singleQuote ? /['\\]/g : /["\\]/g;
+			return `${q}${val.replaceAll(escapePattern, "\\$&")}${q}`;
+		}
+		return `${q}${val}${q}`;
 	}
 	if (typeOf === "function") return printFunction(val, printFunctionName);
 	if (typeOf === "symbol") return printSymbol(val);
@@ -945,10 +972,10 @@ function printComplexValue(val, config, indentation, depth, refs, hasCalledToJSO
 	if (config.callToJSON && !hitMaxDepth && val.toJSON && typeof val.toJSON === "function" && !hasCalledToJSON) return printer(val.toJSON(), config, indentation, depth, refs, true);
 	const toStringed = toString.call(val);
 	if (toStringed === "[object Arguments]") return hitMaxDepth ? "[Arguments]" : `${min ? "" : "Arguments "}[${printListItems(val, config, indentation, depth, refs, printer)}]`;
-	if (isToStringedArrayType(toStringed)) return hitMaxDepth ? `[${val.constructor.name}]` : `${min ? "" : !config.printBasicPrototype && val.constructor.name === "Array" ? "" : `${val.constructor.name} `}[${printListItems(val, config, indentation, depth, refs, printer)}]`;
-	if (toStringed === "[object Map]") return hitMaxDepth ? "[Map]" : `Map {${printIteratorEntries(val.entries(), config, indentation, depth, refs, printer, " => ")}}`;
-	if (toStringed === "[object Set]") return hitMaxDepth ? "[Set]" : `Set {${printIteratorValues(val.values(), config, indentation, depth, refs, printer)}}`;
-	return hitMaxDepth || isWindow(val) ? `[${getConstructorName(val)}]` : `${min ? "" : !config.printBasicPrototype && getConstructorName(val) === "Object" ? "" : `${getConstructorName(val)} `}{${printObjectProperties(val, config, indentation, depth, refs, printer)}}`;
+	if (isToStringedArrayType(toStringed)) return hitMaxDepth ? `[${val.constructor.name}]` : `${!config.printBasicPrototype && val.constructor.name === "Array" ? "" : `${val.constructor.name} `}[${printListItems(val, config, indentation, depth, refs, printer)}]`;
+	if (toStringed === "[object Map]") return hitMaxDepth ? "[Map]" : `Map {${printIteratorEntries(val.entries(), config, indentation, depth, refs, printer, " => ", val.size)}}`;
+	if (toStringed === "[object Set]") return hitMaxDepth ? "[Set]" : `Set {${printIteratorValues(val.values(), config, indentation, depth, refs, printer, val.size)}}`;
+	return hitMaxDepth || isWindow(val) ? `[${getConstructorName(val)}]` : `${!config.printBasicPrototype && getConstructorName(val) === "Object" ? "" : `${getConstructorName(val)} `}{${printObjectProperties(val, config, indentation, depth, refs, printer)}}`;
 }
 const ErrorPlugin = {
 	test: (val) => val && val instanceof Error,
@@ -964,7 +991,7 @@ const ErrorPlugin = {
 			...rest
 		};
 		const name = val.name !== "Error" ? val.name : getConstructorName(val);
-		return hitMaxDepth ? `[${name}]` : `${name} {${printIteratorEntries(Object.entries(entries).values(), config, indentation, depth, refs, printer)}}`;
+		return hitMaxDepth ? `[${name}]` : `${name} {${printObjectProperties(entries, config, indentation, depth, refs, printer, null)}}`;
 	}
 };
 function isNewPlugin(plugin) {
@@ -1000,7 +1027,7 @@ function printer(val, config, indentation, depth, refs, hasCalledToJSON) {
 	const plugin = findPlugin(config.plugins, val);
 	if (plugin !== null) result = printPlugin(plugin, val, config, indentation, depth, refs);
 	else {
-		const basicResult = printBasicValue(val, config.printFunctionName, config.escapeRegex, config.escapeString);
+		const basicResult = printBasicValue(val, config.printFunctionName, config.escapeRegex, config.escapeString, config.singleQuote);
 		if (basicResult !== null) result = basicResult;
 		else result = printComplexValue(val, config, indentation, depth, refs, hasCalledToJSON);
 	}
@@ -1032,7 +1059,11 @@ const DEFAULT_OPTIONS = {
 	printBasicPrototype: true,
 	printFunctionName: true,
 	printShadowRoot: true,
-	theme: DEFAULT_THEME
+	theme: DEFAULT_THEME,
+	singleQuote: false,
+	quoteKeys: true,
+	spacingInner: "\n",
+	spacingOuter: "\n"
 };
 function validateOptions(options) {
 	for (const key of Object.keys(options)) if (!Object.hasOwn(DEFAULT_OPTIONS, key)) throw new Error(`pretty-format: Unknown option "${key}".`);
@@ -1077,11 +1108,13 @@ function getConfig(options) {
 		maxWidth: options?.maxWidth ?? DEFAULT_OPTIONS.maxWidth,
 		min: options?.min ?? DEFAULT_OPTIONS.min,
 		plugins: options?.plugins ?? DEFAULT_OPTIONS.plugins,
-		printBasicPrototype: options?.printBasicPrototype ?? true,
+		printBasicPrototype: options?.printBasicPrototype ?? !options?.min,
 		printFunctionName: getPrintFunctionName(options),
 		printShadowRoot: options?.printShadowRoot ?? true,
-		spacingInner: options?.min ? " " : "\n",
-		spacingOuter: options?.min ? "" : "\n",
+		spacingInner: options?.spacingInner ?? (options?.min ? " " : "\n"),
+		spacingOuter: options?.spacingOuter ?? (options?.min ? "" : "\n"),
+		singleQuote: options?.singleQuote ?? DEFAULT_OPTIONS.singleQuote,
+		quoteKeys: options?.quoteKeys ?? DEFAULT_OPTIONS.quoteKeys,
 		maxOutputLength: options?.maxOutputLength ?? DEFAULT_OPTIONS.maxOutputLength,
 		_outputLengthPerDepth: []
 	};
@@ -1095,16 +1128,13 @@ function createIndent(indent) {
 * @param options Custom settings
 */
 function format(val, options) {
-	if (options) {
-		validateOptions(options);
-		if (options.plugins) {
-			const plugin = findPlugin(options.plugins, val);
-			if (plugin !== null) return printPlugin(plugin, val, getConfig(options), "", 0, []);
-		}
-	}
-	const basicResult = printBasicValue(val, getPrintFunctionName(options), getEscapeRegex(options), getEscapeString(options));
+	if (options) validateOptions(options);
+	const config = getConfig(options);
+	const plugin = findPlugin(config.plugins, val);
+	if (plugin !== null) return printPlugin(plugin, val, config, "", 0, []);
+	const basicResult = printBasicValue(val, config.printFunctionName, config.escapeRegex, config.escapeString, config.singleQuote);
 	if (basicResult !== null) return basicResult;
-	return printComplexValue(val, getConfig(options), "", 0, []);
+	return printComplexValue(val, config, "", 0, []);
 }
 const plugins = {
 	AsymmetricMatcher: plugin$5,

package/dist/internal.d.mts

@@ -7,14 +7,25 @@ import { ViewportSize } from "@argos-ci/browser";
  */
 declare const VITEST_IFRAME_SELECTOR = "iframe[data-vitest=\"true\"]";
 /**
- * ID of the Vitest "tester" element that wraps the iframe with a `scale(...)`
- * transform.
+ * ID of the Vitest "tester" element wrapping the iframe.
  */
 declare const VITEST_TESTER_ID = "vitest-tester";
 /**
- * Remove the scale from the Vitest `#vitest-tester` element before taking a
- * screenshot to avoid ending up with small screenshots.
- * @returns A function to restore the scale after the screenshot.
+ * Undo the scale Vitest applies to the `#vitest-tester` element, so the
+ * screenshot is captured at full size instead of shrunk.
+ *
+ * Only some Vitest versions scale the tester. Up to Vitest 4 a viewport larger
+ * than the browser window is emulated by sizing the tester to the requested
+ * viewport and shrinking it with a CSS `transform: scale(...)`. From Vitest 5
+ * the real browser viewport is resized instead, so the tester carries no
+ * transform and there is nothing to undo — which is why an unscaled tester is
+ * a no-op rather than an error.
+ *
+ * Detection reads the *computed* transform, so a scale set from a stylesheet
+ * counts too, while the override goes on the inline style, which is the only
+ * layer guaranteed to win.
+ *
+ * @returns A function restoring the transform after the screenshot.
  */
 declare function resetTesterScale(ctx: BrowserCommandContext): Promise<() => Promise<void>>;
 /**

package/dist/internal.mjs

@@ -7,11 +7,30 @@ import { readVersionFromPackage } from "@argos-ci/util";
 */
 const VITEST_IFRAME_SELECTOR = "iframe[data-vitest=\"true\"]";
 /**
-* ID of the Vitest "tester" element that wraps the iframe with a `scale(...)`
-* transform.
+* ID of the Vitest "tester" element wrapping the iframe.
 */
 const VITEST_TESTER_ID = "vitest-tester";
 /**
+* Dataset key holding the tester's inline `transform` from before Argos reset
+* it.
+*
+* The presence of the key — not the value it holds — is what marks the
+* transform as backed up: the original inline `transform` is usually an empty
+* string, which is indistinguishable from "nothing was saved yet".
+*/
+const TRANSFORM_BACKUP_KEY = "argosBckTransform";
+/**
+* Dataset key counting the screenshots currently holding the tester unscaled.
+*
+* Captures nest: a story calling `argosScreenshot` from its play function runs
+* one inside the automatic screenshot taken after the test. Both share this one
+* element, so without a count the inner restore would hand the scale back while
+* the outer capture is still to come — and the outer screenshot would come out
+* shrunk. Only the first reset saves and overrides the transform, and only the
+* last restore puts it back.
+*/
+const SCALE_HOLD_KEY = "argosScaleHold";
+/**
 * Attribute holding the iframe's inline size from before Argos resized it, as
 * JSON.
 *
@@ -21,27 +40,79 @@ const VITEST_TESTER_ID = "vitest-tester";
 */
 const SIZE_BACKUP_ATTRIBUTE = "data-argos-size-backup";
 /**
-* Remove the scale from the Vitest `#vitest-tester` element before taking a
-* screenshot to avoid ending up with small screenshots.
-* @returns A function to restore the scale after the screenshot.
+* Undo the scale Vitest applies to the `#vitest-tester` element, so the
+* screenshot is captured at full size instead of shrunk.
+*
+* Only some Vitest versions scale the tester. Up to Vitest 4 a viewport larger
+* than the browser window is emulated by sizing the tester to the requested
+* viewport and shrinking it with a CSS `transform: scale(...)`. From Vitest 5
+* the real browser viewport is resized instead, so the tester carries no
+* transform and there is nothing to undo — which is why an unscaled tester is
+* a no-op rather than an error.
+*
+* Detection reads the *computed* transform, so a scale set from a stylesheet
+* counts too, while the override goes on the inline style, which is the only
+* layer guaranteed to win.
+*
+* @returns A function restoring the transform after the screenshot.
 */
 async function resetTesterScale(ctx) {
-	await ctx.page.evaluate((testerId) => {
-		const tester = document.getElementById(testerId);
-		if (!(tester instanceof HTMLElement)) return;
-		if (!tester.getAttribute("data-scale")) throw new Error("Vitest iframe data-scale attribute not found");
-		tester.dataset.bckTransform = tester.style.transform;
-		tester.style.transform = `scale(1)`;
-	}, VITEST_TESTER_ID);
+	await ctx.page.evaluate(resetTesterScaleInPage, {
+		testerId: VITEST_TESTER_ID,
+		backupKey: TRANSFORM_BACKUP_KEY,
+		holdKey: SCALE_HOLD_KEY
+	});
 	return async () => {
-		await ctx.page.evaluate((testerId) => {
-			const tester = document.getElementById(testerId);
-			if (!(tester instanceof HTMLElement)) return;
-			tester.style.transform = tester.dataset.bckTransform ?? "";
-		}, VITEST_TESTER_ID);
+		await ctx.page.evaluate(restoreTesterScaleInPage, {
+			testerId: VITEST_TESTER_ID,
+			backupKey: TRANSFORM_BACKUP_KEY,
+			holdKey: SCALE_HOLD_KEY
+		});
 	};
 }
 /**
+* Body of {@link resetTesterScale}, running in the page.
+*
+* Exported for tests only, and self-contained on purpose: it is serialized to
+* the browser by `page.evaluate`, so it can reference nothing but its argument
+* and page globals.
+*/
+function resetTesterScaleInPage(args) {
+	const { testerId, backupKey, holdKey } = args;
+	const tester = document.getElementById(testerId);
+	if (!(tester instanceof HTMLElement)) return;
+	const held = Number(tester.dataset[holdKey] ?? "0");
+	tester.dataset[holdKey] = String(held + 1);
+	if (held > 0) return;
+	const { transform } = getComputedStyle(tester);
+	if (!transform || transform === "none") return;
+	const matrix = new DOMMatrixReadOnly(transform);
+	if (matrix.a === 1 && matrix.d === 1) return;
+	tester.dataset[backupKey] = tester.style.transform;
+	tester.style.transform = "scale(1)";
+}
+/**
+* Body of the function {@link resetTesterScale} returns, running in the page.
+*
+* Exported for tests only, and self-contained for the same reason as
+* {@link resetTesterScaleInPage}.
+*/
+function restoreTesterScaleInPage(args) {
+	const { testerId, backupKey, holdKey } = args;
+	const tester = document.getElementById(testerId);
+	if (!(tester instanceof HTMLElement)) return;
+	const held = Math.max(0, Number(tester.dataset[holdKey] ?? "0") - 1);
+	if (held > 0) {
+		tester.dataset[holdKey] = String(held);
+		return;
+	}
+	delete tester.dataset[holdKey];
+	const backup = tester.dataset[backupKey];
+	if (backup === void 0) return;
+	tester.style.transform = backup;
+	delete tester.dataset[backupKey];
+}
+/**
 * Resize the Vitest iframe.
 *
 * The story/test renders inside an `<iframe data-vitest="true">` on the host

package/dist/plugin.d.mts

@@ -3,8 +3,7 @@ import { StabilizationPluginOptions, ViewportOption } from "@argos-ci/browser";
 import { ScreenshotMetadata } from "@argos-ci/util";
 import { UploadParameters } from "@argos-ci/core";
 import { Plugin } from "vitest/config";
-import { BrowserCommand, Vitest } from "vitest/node";
-import { Reporter } from "vitest/reporters";
+import { BrowserCommand, Reporter, Vitest } from "vitest/node";
 //#region src/options.d.ts
 /**
  * Configuration for the Argos Vitest reporter.

package/dist/plugin.mjs

@@ -11,11 +11,30 @@ import { getSnapshotMimeType, readConfig, upload } from "@argos-ci/core";
 */
 const VITEST_IFRAME_SELECTOR = "iframe[data-vitest=\"true\"]";
 /**
-* ID of the Vitest "tester" element that wraps the iframe with a `scale(...)`
-* transform.
+* ID of the Vitest "tester" element wrapping the iframe.
 */
 const VITEST_TESTER_ID = "vitest-tester";
 /**
+* Dataset key holding the tester's inline `transform` from before Argos reset
+* it.
+*
+* The presence of the key — not the value it holds — is what marks the
+* transform as backed up: the original inline `transform` is usually an empty
+* string, which is indistinguishable from "nothing was saved yet".
+*/
+const TRANSFORM_BACKUP_KEY = "argosBckTransform";
+/**
+* Dataset key counting the screenshots currently holding the tester unscaled.
+*
+* Captures nest: a story calling `argosScreenshot` from its play function runs
+* one inside the automatic screenshot taken after the test. Both share this one
+* element, so without a count the inner restore would hand the scale back while
+* the outer capture is still to come — and the outer screenshot would come out
+* shrunk. Only the first reset saves and overrides the transform, and only the
+* last restore puts it back.
+*/
+const SCALE_HOLD_KEY = "argosScaleHold";
+/**
 * Attribute holding the iframe's inline size from before Argos resized it, as
 * JSON.
 *
@@ -25,27 +44,79 @@ const VITEST_TESTER_ID = "vitest-tester";
 */
 const SIZE_BACKUP_ATTRIBUTE = "data-argos-size-backup";
 /**
-* Remove the scale from the Vitest `#vitest-tester` element before taking a
-* screenshot to avoid ending up with small screenshots.
-* @returns A function to restore the scale after the screenshot.
+* Undo the scale Vitest applies to the `#vitest-tester` element, so the
+* screenshot is captured at full size instead of shrunk.
+*
+* Only some Vitest versions scale the tester. Up to Vitest 4 a viewport larger
+* than the browser window is emulated by sizing the tester to the requested
+* viewport and shrinking it with a CSS `transform: scale(...)`. From Vitest 5
+* the real browser viewport is resized instead, so the tester carries no
+* transform and there is nothing to undo — which is why an unscaled tester is
+* a no-op rather than an error.
+*
+* Detection reads the *computed* transform, so a scale set from a stylesheet
+* counts too, while the override goes on the inline style, which is the only
+* layer guaranteed to win.
+*
+* @returns A function restoring the transform after the screenshot.
 */
 async function resetTesterScale(ctx) {
-	await ctx.page.evaluate((testerId) => {
-		const tester = document.getElementById(testerId);
-		if (!(tester instanceof HTMLElement)) return;
-		if (!tester.getAttribute("data-scale")) throw new Error("Vitest iframe data-scale attribute not found");
-		tester.dataset.bckTransform = tester.style.transform;
-		tester.style.transform = `scale(1)`;
-	}, VITEST_TESTER_ID);
+	await ctx.page.evaluate(resetTesterScaleInPage, {
+		testerId: VITEST_TESTER_ID,
+		backupKey: TRANSFORM_BACKUP_KEY,
+		holdKey: SCALE_HOLD_KEY
+	});
 	return async () => {
-		await ctx.page.evaluate((testerId) => {
-			const tester = document.getElementById(testerId);
-			if (!(tester instanceof HTMLElement)) return;
-			tester.style.transform = tester.dataset.bckTransform ?? "";
-		}, VITEST_TESTER_ID);
+		await ctx.page.evaluate(restoreTesterScaleInPage, {
+			testerId: VITEST_TESTER_ID,
+			backupKey: TRANSFORM_BACKUP_KEY,
+			holdKey: SCALE_HOLD_KEY
+		});
 	};
 }
 /**
+* Body of {@link resetTesterScale}, running in the page.
+*
+* Exported for tests only, and self-contained on purpose: it is serialized to
+* the browser by `page.evaluate`, so it can reference nothing but its argument
+* and page globals.
+*/
+function resetTesterScaleInPage(args) {
+	const { testerId, backupKey, holdKey } = args;
+	const tester = document.getElementById(testerId);
+	if (!(tester instanceof HTMLElement)) return;
+	const held = Number(tester.dataset[holdKey] ?? "0");
+	tester.dataset[holdKey] = String(held + 1);
+	if (held > 0) return;
+	const { transform } = getComputedStyle(tester);
+	if (!transform || transform === "none") return;
+	const matrix = new DOMMatrixReadOnly(transform);
+	if (matrix.a === 1 && matrix.d === 1) return;
+	tester.dataset[backupKey] = tester.style.transform;
+	tester.style.transform = "scale(1)";
+}
+/**
+* Body of the function {@link resetTesterScale} returns, running in the page.
+*
+* Exported for tests only, and self-contained for the same reason as
+* {@link resetTesterScaleInPage}.
+*/
+function restoreTesterScaleInPage(args) {
+	const { testerId, backupKey, holdKey } = args;
+	const tester = document.getElementById(testerId);
+	if (!(tester instanceof HTMLElement)) return;
+	const held = Math.max(0, Number(tester.dataset[holdKey] ?? "0") - 1);
+	if (held > 0) {
+		tester.dataset[holdKey] = String(held);
+		return;
+	}
+	delete tester.dataset[holdKey];
+	const backup = tester.dataset[backupKey];
+	if (backup === void 0) return;
+	tester.style.transform = backup;
+	delete tester.dataset[backupKey];
+}
+/**
 * Resize the Vitest iframe.
 *
 * The story/test renders inside an `<iframe data-vitest="true">` on the host

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@argos-ci/vitest",
   "description": "Vitest SDK for visual testing with Argos.",
-  "version": "0.5.0",
+  "version": "0.6.1",
   "author": "Smooth Code",
   "license": "MIT",
   "repository": {
@@ -52,8 +52,8 @@
   },
   "dependencies": {
     "@argos-ci/browser": "6.4.5",
-    "@argos-ci/core": "6.8.3",
-    "@argos-ci/playwright": "7.5.0",
+    "@argos-ci/core": "6.8.4",
+    "@argos-ci/playwright": "7.5.1",
     "@argos-ci/util": "4.2.0"
   },
   "peerDependencies": {
@@ -64,9 +64,9 @@
   },
   "devDependencies": {
     "@types/node": "catalog:",
-    "@vitest/browser": "^4.1.10",
-    "@vitest/browser-playwright": "^4.1.10",
-    "@vitest/pretty-format": "^4.1.10",
+    "@vitest/browser": "^5.0.0",
+    "@vitest/browser-playwright": "^5.0.0",
+    "@vitest/pretty-format": "^5.0.0",
     "playwright": "^1.62.1",
     "vitest": "catalog:"
   },
@@ -77,9 +77,10 @@
     "install-playwright": "playwright install chromium --with-deps",
     "build-e2e": "pnpm run install-playwright",
     "e2e": "cross-env BUILD_NAME=\"argos-vitest-e2e-node-$NODE_VERSION-$OS\" UPLOAD_TO_ARGOS=true pnpm run test-e2e",
+    "e2e-compat": "cross-env BUILD_NAME=\"argos-vitest4-e2e-node-$NODE_VERSION-$OS\" UPLOAD_TO_ARGOS=true pnpm run test-e2e",
     "check-types": "tsc",
     "check-format": "prettier --check --ignore-unknown --ignore-path=./.gitignore --ignore-path=../../.gitignore --ignore-path=../../.prettierignore .",
     "lint": "eslint ."
   },
-  "gitHead": "b2a9a9d84dc14e148a68295f56cfdfec03f887f1"
+  "gitHead": "212ed2c37ce532dd32c87ac685b55e2ab6e154c4"
 }