vitest-plugin-vis 1.5.0 → 1.6.0

package/esm/client/ctx.d.ts

@@ -1,5 +1,5 @@
 export declare const ctx: {
-    getCurrentTest: () => import("vitest").RunnerTestCase<object> | import("vitest").RunnerCustomCase<object> | undefined;
+    getCurrentTest: () => import("vitest").RunnerTestCase<object> | undefined;
     __test__reset(): void;
 };
 //# sourceMappingURL=ctx.d.ts.map

package/esm/client/image_snapshot_matcher.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"image_snapshot_matcher.d.ts","sourceRoot":"","sources":["../../src/client/image_snapshot_matcher.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAClC,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,KAAK,EAAE,qCAAqC,EAAE,MAAM,yDAAyD,CAAA;AACpH,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4CAA4C,CAAA;AAK3F,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAA;AAO5F,wBAAgB,oBAAoB,CACnC,QAAQ,EAAE,qCAAqC,GAAG,yBAAyB,GAAG,6BAA6B,UAE5D,IAAI,WAAW,GAAG,YAAY,2BAA2B,CAAC,GAAG,CAAC,mBAgE7G;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,GAAG,OAOrD"}
+{"version":3,"file":"image_snapshot_matcher.d.ts","sourceRoot":"","sources":["../../src/client/image_snapshot_matcher.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,IAAI,EAAE,MAAM,QAAQ,CAAA;AAClC,OAAO,KAAK,EAAE,6BAA6B,EAAE,MAAM,gBAAgB,CAAA;AACnE,OAAO,KAAK,EAAE,qCAAqC,EAAE,MAAM,yDAAyD,CAAA;AACpH,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,4CAA4C,CAAA;AAI3F,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAA;AAO5F,wBAAgB,oBAAoB,CACnC,QAAQ,EAAE,qCAAqC,GAAG,yBAAyB,GAAG,6BAA6B,UAE5D,IAAI,WAAW,GAAG,YAAY,2BAA2B,CAAC,GAAG,CAAC,mBAgE7G;AAED;;GAEG;AACH,wBAAgB,yBAAyB,CAAC,OAAO,EAAE,GAAG,OAOrD"}

package/esm/client/snapshot_options.d.ts

@@ -1,6 +1,7 @@
+import type { AutoSnapshotOptions } from '../config/types.ts';
 import type { ComparisonMethod } from '../shared/types.ts';
 import type { ToMatchImageSnapshotOptions } from './expect/to_match_image_snapshot.types.ts';
-export type SnapshotMeta<M extends ComparisonMethod> = ToMatchImageSnapshotOptions<M> & {
+export type SnapshotMeta<M extends ComparisonMethod> = ToMatchImageSnapshotOptions<M> & AutoSnapshotOptions & {
     enable?: boolean | undefined;
 };
 type Suite = {

package/esm/client/snapshot_options.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"snapshot_options.d.ts","sourceRoot":"","sources":["../../src/client/snapshot_options.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE1D,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAA;AAE5F,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,gBAAgB,IAAI,2BAA2B,CAAC,CAAC,CAAC,GAAG;IAAE,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAAE,CAAA;AAExH,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,CAAA;CAAE,CAAA;AAErE,MAAM,MAAM,QAAQ,GACjB;IACA,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;KAAE,GAAG,SAAS,CAAA;IAChD,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,CAAA;IACzB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACxB,GACD,SAAS,CAAA;AAEZ;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,gBAAgB,EAChE,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,OAAO,GAC7B,IAAI,CAAA;AACP,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,gBAAgB,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,OAAO,GAAG,IAAI,CAAA"}
+{"version":3,"file":"snapshot_options.d.ts","sourceRoot":"","sources":["../../src/client/snapshot_options.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAA;AAE7D,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE1D,OAAO,KAAK,EAAE,2BAA2B,EAAE,MAAM,2CAA2C,CAAA;AAE5F,MAAM,MAAM,YAAY,CAAC,CAAC,SAAS,gBAAgB,IAAI,2BAA2B,CAAC,CAAC,CAAC,GACpF,mBAAmB,GAAG;IACrB,MAAM,CAAC,EAAE,OAAO,GAAG,SAAS,CAAA;CAC5B,CAAA;AAEF,KAAK,KAAK,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;IAAC,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,CAAA;CAAE,CAAA;AAErE,MAAM,MAAM,QAAQ,GACjB;IACA,IAAI,CAAC,EAAE;QAAE,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;KAAE,GAAG,SAAS,CAAA;IAChD,KAAK,CAAC,EAAE,KAAK,GAAG,SAAS,CAAA;IACzB,IAAI,EAAE,MAAM,CAAC,MAAM,EAAE,GAAG,CAAC,CAAA;CACxB,GACD,SAAS,CAAA;AAEZ;;;;;;;;;;;;;;GAcG;AACH,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,gBAAgB,EAChE,IAAI,EAAE,QAAQ,EACd,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,OAAO,GAC7B,IAAI,CAAA;AACP,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,gBAAgB,EAAE,IAAI,EAAE,YAAY,CAAC,CAAC,CAAC,GAAG,OAAO,GAAG,IAAI,CAAA"}

package/esm/client/vitest_suite_proxy.d.ts

@@ -1,2 +1,2 @@
-export declare const getCurrentTest: () => import("vitest").RunnerTestCase<object> | import("vitest").RunnerCustomCase<object> | undefined;
+export declare const getCurrentTest: () => import("vitest").RunnerTestCase<object> | undefined;
 //# sourceMappingURL=vitest_suite_proxy.d.ts.map

package/esm/client/vitest_suite_proxy.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vitest_suite_proxy.d.ts","sourceRoot":"","sources":["../../src/client/vitest_suite_proxy.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,cAAc,uGAAsC,CAAA"}
+{"version":3,"file":"vitest_suite_proxy.d.ts","sourceRoot":"","sources":["../../src/client/vitest_suite_proxy.ts"],"names":[],"mappings":"AAQA,eAAO,MAAM,cAAc,2DAAsC,CAAA"}

package/esm/config/types.d.ts

@@ -1,6 +1,6 @@
 import type { ComparisonMethod, ImageSnapshotCompareOptions, ImageSnapshotIdOptions, ImageSnapshotTimeoutOptions } from '../shared/types.ts';
 export type { ComparisonMethod };
-export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTimeoutOptions & ImageSnapshotIdOptions & ImageSnapshotCompareOptions<M> & {
+export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTimeoutOptions & ImageSnapshotIdOptions & ImageSnapshotCompareOptions<M> & AutoSnapshotOptions & {
     /**
      * Loads the `test.setupFiles` of the specified preset.
      */
@@ -41,4 +41,13 @@ export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTime
      */
     customizeSnapshotSubpath?: (subPath: string) => string;
 };
+export type AutoSnapshotOptions = {
+    /**
+     * Specify the data-testid of the subject element. Default is `subject`.
+     *
+     * If the test does not have an element with the specified data-testid,
+     * the `body` element will be used.
+     */
+    subjectDataTestId?: string | undefined;
+};
 //# sourceMappingURL=types.d.ts.map

package/esm/config/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/config/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,gBAAgB,EAChB,2BAA2B,EAC3B,sBAAsB,EACtB,2BAA2B,EAC3B,MAAM,oBAAoB,CAAA;AAE3B,YAAY,EAAE,gBAAgB,EAAE,CAAA;AAEhC,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,gBAAgB,GAAG,OAAO,IAAI,2BAA2B,GACzF,sBAAsB,GACtB,2BAA2B,CAAC,CAAC,CAAC,GAAG;IAChC;;OAEG;IACH,MAAM,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;IAC/C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACpC;;;;;;;;;;;;;;;;;;;OAmBG;IACH,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAA;CACtD,CAAA"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../src/config/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACX,gBAAgB,EAChB,2BAA2B,EAC3B,sBAAsB,EACtB,2BAA2B,EAC3B,MAAM,oBAAoB,CAAA;AAE3B,YAAY,EAAE,gBAAgB,EAAE,CAAA;AAEhC,MAAM,MAAM,UAAU,CAAC,CAAC,SAAS,gBAAgB,GAAG,OAAO,IAAI,2BAA2B,GACzF,sBAAsB,GACtB,2BAA2B,CAAC,CAAC,CAAC,GAC9B,mBAAmB,GAAG;IACrB;;OAEG;IACH,MAAM,CAAC,EAAE,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;IAC/C;;;;;;OAMG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IACpC;;;;;;;;;;;;;;;;;;;OAmBG;IACH,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAA;CACtD,CAAA;AAEF,MAAM,MAAM,mBAAmB,GAAG;IACjC;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;CACtC,CAAA"}

package/esm/server/commands/match_image_snapshot.js

@@ -41,8 +41,8 @@ export const matchImageSnapshot = async (context, taskId, subject, options) => {
 
 				The image size changed form ${baselineImage.width}x${baselineImage.height} to ${resultImage.width}x${resultImage.height}
 
-				Expected:   ${resolve(context.project.runner.root, info.baselinePath)}
-				Actual:     ${resolve(context.project.runner.root, info.resultPath)}`);
+				Expected:   ${resolve(context.project.config.root, info.baselinePath)}
+				Actual:     ${resolve(context.project.config.root, info.resultPath)}`);
     }
     if (context.project.config.snapshotOptions.updateSnapshot === 'all') {
         await writeSnapshotBuffer(info.baselinePath, resultImage.data);
@@ -59,9 +59,9 @@ export const matchImageSnapshot = async (context, taskId, subject, options) => {
 
 			Options:    ${JSON.stringify(options)}
 
-			Expected:   ${resolve(context.project.runner.root, info.baselinePath)}
-			Actual:     ${resolve(context.project.runner.root, info.resultPath)}
-			Difference: ${resolve(context.project.runner.root, info.diffPath)}`);
+			Expected:   ${resolve(context.project.config.root, info.baselinePath)}
+			Actual:     ${resolve(context.project.config.root, info.resultPath)}
+			Difference: ${resolve(context.project.config.root, info.diffPath)}`);
 };
 function alignImageSizes(baseline, result) {
     if (isSameSize(baseline, result))

package/esm/server/commands/prepare_image_snapshot_comparison.js

@@ -23,7 +23,7 @@ export const prepareImageSnapshotComparison = async (context, taskId, subject, o
     const resultBuffer = await takeSnapshot(context, info.resultPath, subject, options);
     return {
         ...info,
-        projectRoot: context.project.runner.root,
+        projectRoot: context.project.config.root,
         baseline: baselineBuffer.toString('base64'),
         result: resultBuffer.toString('base64'),
     };

package/esm/server/commands/setup_vis_suite.d.ts

@@ -7,7 +7,9 @@ export interface SetupVisSuiteCommand {
      *
      * In subsequent runs, it will only remove the results and diffs directory of the current suite.
      */
-    setupVisSuite: () => Promise<void>;
+    setupVisSuite: () => Promise<{
+        subjectDataTestId: string | undefined;
+    }>;
 }
 export declare const setupVisSuite: BrowserCommand<[]>;
 //# sourceMappingURL=setup_vis_suite.d.ts.map

package/esm/server/commands/setup_vis_suite.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"setup_vis_suite.d.ts","sourceRoot":"","sources":["../../../src/server/commands/setup_vis_suite.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAIjD,MAAM,WAAW,oBAAoB;IACpC;;;;;;OAMG;IACH,aAAa,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;CAClC;AAED,eAAO,MAAM,aAAa,EAAE,cAAc,CAAC,EAAE,CAI5C,CAAA"}
+{"version":3,"file":"setup_vis_suite.d.ts","sourceRoot":"","sources":["../../../src/server/commands/setup_vis_suite.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,cAAc,EAAE,MAAM,aAAa,CAAA;AAIjD,MAAM,WAAW,oBAAoB;IACpC;;;;;;OAMG;IACH,aAAa,EAAE,MAAM,OAAO,CAAC;QAAE,iBAAiB,EAAE,MAAM,GAAG,SAAS,CAAA;KAAE,CAAC,CAAA;CACvE;AAED,eAAO,MAAM,aAAa,EAAE,cAAc,CAAC,EAAE,CAM5C,CAAA"}

package/esm/server/commands/setup_vis_suite.js

@@ -2,5 +2,5 @@ import { visContext } from "../vis_context.js";
 import { assertTestPathDefined } from "./_assertions.js";
 export const setupVisSuite = async (context) => {
     assertTestPathDefined(context, 'setupVisSuite');
-    await visContext.setupSuite(context);
+    return visContext.setupSuite(context);
 };

package/esm/server/vis_context.d.ts

@@ -3,7 +3,7 @@ export declare const visContext: {
     __test__getOptions(): import("../config.ts").VisOptions<any>;
     __test__reset(): void;
     __test__getState(): import("./vis_context.types.ts").VisState;
-    setupSuite(context: import("./vis_context.logic.ts").PartialBrowserCommandContext): Promise<void>;
+    setupSuite(context: import("./vis_context.logic.ts").PartialBrowserCommandContext): Promise<import("type-plus").Pick._<import("./vis_context.types.ts").VisState, "subjectDataTestId">>;
     getSnapshotInfo(testPath: string, name: string, options?: {
         snapshotFileId?: string | undefined;
     }): {

package/esm/server/vis_context.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vis_context.d.ts","sourceRoot":"","sources":["../../src/server/vis_context.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;sBAC2mD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CADvlD,CAAA"}
+{"version":3,"file":"vis_context.d.ts","sourceRoot":"","sources":["../../src/server/vis_context.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,UAAU;;;;;;;sBACspD,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CADloD,CAAA"}

package/esm/server/vis_context.logic.d.ts

@@ -23,7 +23,7 @@ export declare function createVisContext(): {
      * Test files include vitest test files and storybook story files.
      * It needs to make sure there is no race condition between the test files.
      */
-    setupSuite(context: PartialBrowserCommandContext): Promise<void>;
+    setupSuite(context: PartialBrowserCommandContext): Promise<import("type-plus").Pick._<VisState, "subjectDataTestId">>;
     getSnapshotInfo(testPath: string, name: string, options?: {
         snapshotFileId?: string | undefined;
     }): {

package/esm/server/vis_context.logic.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vis_context.logic.d.ts","sourceRoot":"","sources":["../../src/server/vis_context.logic.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAKpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAEtD,MAAM,MAAM,4BAA4B,GAAG;IAC1C,OAAO,EAAE;QACR,MAAM,EAAE;YACP,IAAI,EAAE,MAAM,CAAA;YACZ,eAAe,EAAE;gBAChB,cAAc,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,CAAA;aACtC,CAAA;YACD,WAAW,EAAE,MAAM,CAAA;YACnB,WAAW,EAAE,MAAM,CAAA;SACnB,CAAA;KACD,CAAA;IACD,QAAQ,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,wBAAgB,gBAAgB;eAMnB,CAAC,SAAS,OAAO,GAAG,MAAM,YAAW,UAAU,CAAC,CAAC,CAAC;;;;IAY7D;;;;OAIG;wBACuB,4BAA4B;8BAY5B,MAAM,QAAQ,MAAM,YAAY;QAAE,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;KAAE;;;;;;;;;;;;;;;;;;;2BAkB1E,MAAM,UAAU,MAAM;+BAGlB,MAAM,UAAU,MAAM,kBAAkB,MAAM,GAAG,SAAS;8BAI3D;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE;YAAE,KAAK,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,kBAAkB,MAAM,GAAG,SAAS;2BAMlF,MAAM,UAAU,MAAM;;;;;;;;;;EAe9C;AA0BD,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,0BAA0B,CAAC;;;;;;;;EAWnH;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,0BAA0B,CAAC,UAElH"}
+{"version":3,"file":"vis_context.logic.d.ts","sourceRoot":"","sources":["../../src/server/vis_context.logic.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,oBAAoB,CAAA;AAKpD,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAA;AAEtD,MAAM,MAAM,4BAA4B,GAAG;IAC1C,OAAO,EAAE;QACR,MAAM,EAAE;YACP,IAAI,EAAE,MAAM,CAAA;YACZ,eAAe,EAAE;gBAChB,cAAc,EAAE,KAAK,GAAG,KAAK,GAAG,MAAM,CAAA;aACtC,CAAA;YACD,WAAW,EAAE,MAAM,CAAA;YACnB,WAAW,EAAE,MAAM,CAAA;SACnB,CAAA;KACD,CAAA;IACD,QAAQ,EAAE,MAAM,CAAA;CAChB,CAAA;AAED,wBAAgB,gBAAgB;eAMnB,CAAC,SAAS,OAAO,GAAG,MAAM,YAAW,UAAU,CAAC,CAAC,CAAC;;;;IAY7D;;;;OAIG;wBACuB,4BAA4B;8BAa5B,MAAM,QAAQ,MAAM,YAAY;QAAE,cAAc,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;KAAE;;;;;;;;;;;;;;;;;;;2BAkB1E,MAAM,UAAU,MAAM;+BAGlB,MAAM,UAAU,MAAM,kBAAkB,MAAM,GAAG,SAAS;8BAI3D;QAAE,MAAM,EAAE,MAAM,CAAC;QAAC,IAAI,EAAE;YAAE,KAAK,EAAE,MAAM,CAAA;SAAE,CAAA;KAAE,kBAAkB,MAAM,GAAG,SAAS;2BAMlF,MAAM,UAAU,MAAM;;;;;;;;;;EAe9C;AA2BD,wBAAgB,WAAW,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,0BAA0B,CAAC;;;;;;;;EAWnH;AAED,wBAAgB,UAAU,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,EAAE,MAAM,EAAE,OAAO,EAAE,IAAI,CAAC,UAAU,EAAE,0BAA0B,CAAC,UAElH"}

package/esm/server/vis_context.logic.js

@@ -37,6 +37,7 @@ export function createVisContext() {
             const { suiteId, suite } = createSuite(state, context.testPath, visOptions);
             state.suites[suiteId] = suite;
             await Promise.allSettled([ctx.rimraf(suite.diffDir), ctx.rimraf(suite.resultDir)]);
+            return pick(state, 'subjectDataTestId');
         },
         getSnapshotInfo(testPath, name, options) {
             const info = context.getSuiteInfo(testPath, name);
@@ -96,6 +97,7 @@ async function setupState(suite, visOptions) {
         snapshotResultDir: join(snapshotRootDir, RESULT_DIR),
         snapshotDiffDir: join(snapshotRootDir, DIFF_DIR),
         snapshotRootPath: join(projectPath, snapshotRootDir),
+        subjectDataTestId: visOptions.subjectDataTestId,
         suites: {},
     };
     await Promise.allSettled([ctx.rimraf(join(state.snapshotDiffDir)), ctx.rimraf(join(state.snapshotResultDir))]);

package/esm/server/vis_context.types.d.ts

@@ -8,6 +8,7 @@ export type VisState = {
     snapshotResultDir: string;
     snapshotDiffDir: string;
     snapshotRootPath: string;
+    subjectDataTestId: string | undefined;
     suites: Record<string, {
         baselineDir: string;
         resultDir: string;

package/esm/server/vis_context.types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vis_context.types.d.ts","sourceRoot":"","sources":["../../src/server/vis_context.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,QAAQ,GAAG;IACtB,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,MAAM,CAAA;IACnB,eAAe,EAAE,MAAM,CAAA;IACvB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,iBAAiB,EAAE,MAAM,CAAA;IACzB,eAAe,EAAE,MAAM,CAAA;IACvB,gBAAgB,EAAE,MAAM,CAAA;IACxB,MAAM,EAAE,MAAM,CACb,MAAM,EACN;QACC,WAAW,EAAE,MAAM,CAAA;QACnB,SAAS,EAAE,MAAM,CAAA;QACjB,OAAO,EAAE,MAAM,CAAA;QACf,KAAK,EAAE,MAAM,CACZ,MAAM,EACN;YACC,KAAK,EAAE,MAAM,CAAA;SACb,CACD,CAAA;KACD,CACD,CAAA;CACD,CAAA"}
+{"version":3,"file":"vis_context.types.d.ts","sourceRoot":"","sources":["../../src/server/vis_context.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,QAAQ,GAAG;IACtB,WAAW,EAAE,MAAM,CAAA;IACnB,QAAQ,EAAE,MAAM,CAAA;IAChB,WAAW,EAAE,MAAM,CAAA;IACnB,WAAW,EAAE,MAAM,CAAA;IACnB,eAAe,EAAE,MAAM,CAAA;IACvB,mBAAmB,EAAE,MAAM,CAAA;IAC3B,iBAAiB,EAAE,MAAM,CAAA;IACzB,eAAe,EAAE,MAAM,CAAA;IACvB,gBAAgB,EAAE,MAAM,CAAA;IACxB,iBAAiB,EAAE,MAAM,GAAG,SAAS,CAAA;IACrC,MAAM,EAAE,MAAM,CACb,MAAM,EACN;QACC,WAAW,EAAE,MAAM,CAAA;QACnB,SAAS,EAAE,MAAM,CAAA;QACjB,OAAO,EAAE,MAAM,CAAA;QACf,KAAK,EAAE,MAAM,CACZ,MAAM,EACN;YACC,KAAK,EAAE,MAAM,CAAA;SACb,CACD,CAAA;KACD,CACD,CAAA;CACD,CAAA"}

package/esm/setup/create_vis.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"create_vis.d.ts","sourceRoot":"","sources":["../../src/setup/create_vis.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAA;AAEjF,wBAAgB,SAAS,CAAC,QAAQ,EAAE,oBAAoB;;QAMrD;;WAEG;;QAIH;;;;WAIG;;QAKH;;;;;;;;;;;;;;WAcG;sBACW,MAAM,CAAC,MAAM,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;;;;;;;8BAgBlC,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;;EAqClE"}
+{"version":3,"file":"create_vis.d.ts","sourceRoot":"","sources":["../../src/setup/create_vis.ts"],"names":[],"mappings":"AAMA,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAA;AAEjF,wBAAgB,SAAS,CAAC,QAAQ,EAAE,oBAAoB;;QAOrD;;WAEG;;QAIH;;;;WAIG;;QAKH;;;;;;;;;;;;;;WAcG;sBACW,MAAM,CAAC,MAAM,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;;;;;;;8BAiBlC,MAAM,CAAC,MAAM,EAAE,MAAM,OAAO,CAAC,IAAI,CAAC,GAAG,IAAI,CAAC;;EAoClE"}

package/esm/setup/create_vis.js

@@ -5,6 +5,7 @@ import { ctx } from "../client/ctx.js";
 import { shouldTakeSnapshot } from "../client/should_take_snapshot.js";
 import { getAutoSnapshotOptions } from '../client/snapshot_options.internal.js';
 export function createVis(commands) {
+    let subjectDataTestId;
     /**
      * Visual test configuration on the client side.
      */
@@ -47,7 +48,7 @@ export function createVis(commands) {
         },
         beforeAll: {
             async setup() {
-                await commands.setupVisSuite();
+                subjectDataTestId = (await commands.setupVisSuite()).subjectDataTestId;
             },
         },
         afterEach: {
@@ -55,7 +56,7 @@ export function createVis(commands) {
                 const meta = getAutoSnapshotOptions(ctx.getCurrentTest());
                 if (!shouldTakeSnapshot(meta))
                     return;
-                await expect(document.body).toMatchImageSnapshot(meta);
+                await expect(getSubject(meta?.subjectDataTestId ?? subjectDataTestId)).toMatchImageSnapshot(meta);
             },
             matchPerTheme(themes) {
                 return async function matchImageSnapshot() {
@@ -67,7 +68,7 @@ export function createVis(commands) {
                     for (const themeId in themes) {
                         try {
                             await themes[themeId]();
-                            await expect(document.body).toMatchImageSnapshot({
+                            await expect(getSubject(meta?.subjectDataTestId ?? subjectDataTestId)).toMatchImageSnapshot({
                                 ...meta,
                                 customizeSnapshotId: (id) => `${id}-${themeId}`,
                             });
@@ -94,3 +95,11 @@ export function createVis(commands) {
     };
     return vis;
 }
+function getSubject(subjectDataTestId) {
+    if (subjectDataTestId) {
+        const subject = document.querySelector(`[data-testid="${subjectDataTestId}"]`);
+        if (subject)
+            return subject;
+    }
+    return document.body;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitest-plugin-vis",
-  "version": "1.5.0",
+  "version": "1.6.0",
   "description": "Vitest visual testing plugin",
   "keywords": [
     "image-snapshot",
@@ -77,10 +77,10 @@
     "@types/is-ci": "^3.0.4",
     "@types/pngjs": "^6.0.5",
     "@types/react": "^19.0.2",
-    "@vitest/browser": "^2.1.8",
-    "@vitest/coverage-istanbul": "^2.1.8",
-    "@vitest/coverage-v8": "^2.1.8",
-    "@vitest/expect": "^2.1.8",
+    "@vitest/browser": "^3.0.0",
+    "@vitest/coverage-istanbul": "^3.0.0",
+    "@vitest/coverage-v8": "^3.0.0",
+    "@vitest/expect": "^3.0.0",
     "cross-env": "^7.0.3",
     "never-fail": "^1.1.4",
     "npm-run-all2": "^7.0.2",
@@ -88,13 +88,14 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "typescript": "^5.7.2",
-    "vite": "^5.3.5",
-    "vitest": "^2.1.3",
+    "vite": "^6.0.0",
+    "vitest": "^3.0.0",
     "vitest-browser-react": "^0.0.4",
-    "webdriverio": "^9.4.1"
+    "webdriverio": "^9.5.7"
   },
   "peerDependencies": {
-    "@vitest/browser": "^2.1.3"
+    "@vitest/browser": "^2 || ^3",
+    "vitest": "^2 || ^3"
   },
   "publishConfig": {
     "access": "public"
@@ -108,11 +109,14 @@
     "dev": "run-p build:watch w",
     "nuke": "rimraf node_modules",
     "test": "vitest run",
+    "t:node": "vitest --project=vpv:node",
+    "t:pw": "vitest run --project=\"vpv:pw (*)\"",
+    "t:wd": "vitest run --project=\"vpv:wd (*)\"",
     "v": "run-p build cov",
     "w": "vitest",
     "w:cov": "cross-env COVERAGE=true vitest --coverage",
     "w:node": "vitest --project=vpv:node",
-    "w:pw": "vitest --project=vpv:pw",
-    "w:wd": "vitest --project=vpv:wd"
+    "w:pw": "vitest --project=\"vpv:pw (*)\"",
+    "w:wd": "vitest --project=\"vpv:wd (*)\""
   }
 }

package/readme.md

@@ -19,7 +19,7 @@ yarn add --save-dev vitest-plugin-vis
 
 ## Config
 
-Vitest visual testing plugin supports zero-config setup.
+The `vitest-plugin-vis` plugin can be used without customization.
 
 ```ts
 // vitest.config.ts
@@ -41,9 +41,10 @@ export default defineConfig({
 
 This default configuration will:
 
-- Use `pixelmatch` as the image comparison method.
 - Use the `auto` preset, taking image snapshot at the end on each rendering test.
+- Use `pixelmatch` as the image comparison method.
 - Set config to compare image snapshot with a failure threshold of `0 pixels`.
+- Timeout for image comparison is set to `30000 ms`.
 - Local (non-CI) image snapshots are saved in the `<root>/__vis__/local` directory.
 - CI image snapshots are saved in the `<root>/__vis__/<process.platform>` directory.
 - Image snapshots of the current test run are saved in the `<root>/__vis__/__results__` directory.
@@ -64,16 +65,18 @@ export default defineConfig({
 			platform: '...', // {process.platform} or `local`
 			customizeSnapshotSubpath: (subpath) => trimCommonFolder(subpath),
 			customizeSnapshotId: (id, index) => `${id}-${index}`,
+			// set a default subject (e.g. 'subject') to capture image snapshot
+			subjectDataTestId: undefined,
 			comparisonMethod: 'pixel',
 			// pixelmatch or ssim.js options, depending on `comparisonMethod`.
 			diffOptions: undefined,
+			timeout: 30000,
 			failureThresholdType: 'pixel',
 			failureThreshold: 0,
-			timeout: 30000
 		})
 	],
 	test:{
-		browser:{/* ... */}
+		browser: {/* ... */}
 	}
 })
 ```

package/src/client/image_snapshot_matcher.ts

@@ -6,7 +6,6 @@ import type { PrepareImageSnapshotComparisonCommand } from '../server/commands/p
 import type { WriteImageSnapshotCommand } from '../server/commands/write_image_snapshot.ts'
 import { isBase64String } from '../shared/base64.ts'
 import { compareImage } from '../shared/compare_image.ts'
-import type { ComparisonMethod } from '../shared/types.ts'
 import { alignImagesToSameSize } from './align_images.ts'
 import type { ToMatchImageSnapshotOptions } from './expect/to_match_image_snapshot.types.ts'
 import { toDataURL, toImageData } from './image_data.ts'

package/src/client/snapshot_options.ts

@@ -1,9 +1,13 @@
+import type { AutoSnapshotOptions } from '../config/types.ts'
 import { NAME } from '../shared/constants.ts'
 import type { ComparisonMethod } from '../shared/types.ts'
 import { ctx } from './ctx.ts'
 import type { ToMatchImageSnapshotOptions } from './expect/to_match_image_snapshot.types.ts'
 
-export type SnapshotMeta<M extends ComparisonMethod> = ToMatchImageSnapshotOptions<M> & { enable?: boolean | undefined }
+export type SnapshotMeta<M extends ComparisonMethod> = ToMatchImageSnapshotOptions<M> &
+	AutoSnapshotOptions & {
+		enable?: boolean | undefined
+	}
 
 type Suite = { meta: Record<string, any>; suite?: Suite | undefined }
 

package/src/config/types.ts

@@ -9,7 +9,8 @@ export type { ComparisonMethod }
 
 export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTimeoutOptions &
 	ImageSnapshotIdOptions &
-	ImageSnapshotCompareOptions<M> & {
+	ImageSnapshotCompareOptions<M> &
+	AutoSnapshotOptions & {
 		/**
 		 * Loads the `test.setupFiles` of the specified preset.
 		 */
@@ -50,3 +51,13 @@ export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTime
 		 */
 		customizeSnapshotSubpath?: (subPath: string) => string
 	}
+
+export type AutoSnapshotOptions = {
+	/**
+	 * Specify the data-testid of the subject element. Default is `subject`.
+	 *
+	 * If the test does not have an element with the specified data-testid,
+	 * the `body` element will be used.
+	 */
+	subjectDataTestId?: string | undefined
+}

package/src/server/commands/match_image_snapshot.ts

@@ -76,8 +76,8 @@ export const matchImageSnapshot: BrowserCommand<
 
 				The image size changed form ${baselineImage.width}x${baselineImage.height} to ${resultImage.width}x${resultImage.height}
 
-				Expected:   ${resolve(context.project.runner.root, info.baselinePath)}
-				Actual:     ${resolve(context.project.runner.root, info.resultPath)}`,
+				Expected:   ${resolve(context.project.config.root, info.baselinePath)}
+				Actual:     ${resolve(context.project.config.root, info.resultPath)}`,
 		)
 	}
 
@@ -101,9 +101,9 @@ export const matchImageSnapshot: BrowserCommand<
 
 			Options:    ${JSON.stringify(options)}
 
-			Expected:   ${resolve(context.project.runner.root, info.baselinePath)}
-			Actual:     ${resolve(context.project.runner.root, info.resultPath)}
-			Difference: ${resolve(context.project.runner.root, info.diffPath)}`,
+			Expected:   ${resolve(context.project.config.root, info.baselinePath)}
+			Actual:     ${resolve(context.project.config.root, info.resultPath)}
+			Difference: ${resolve(context.project.config.root, info.diffPath)}`,
 	)
 }
 

package/src/server/commands/prepare_image_snapshot_comparison.ts

@@ -54,7 +54,7 @@ export const prepareImageSnapshotComparison: BrowserCommand<
 	const resultBuffer = await takeSnapshot(context, info.resultPath, subject, options)
 	return {
 		...info,
-		projectRoot: context.project.runner.root,
+		projectRoot: context.project.config.root,
 		baseline: baselineBuffer.toString('base64'),
 		result: resultBuffer.toString('base64'),
 	}

package/src/server/commands/setup_vis_suite.ts

@@ -10,11 +10,13 @@ export interface SetupVisSuiteCommand {
 	 *
 	 * In subsequent runs, it will only remove the results and diffs directory of the current suite.
 	 */
-	setupVisSuite: () => Promise<void>
+	setupVisSuite: () => Promise<{ subjectDataTestId: string | undefined }>
 }
 
-export const setupVisSuite: BrowserCommand<[]> = async (context) => {
+export const setupVisSuite: BrowserCommand<[]> = async (
+	context,
+): Promise<{ subjectDataTestId: string | undefined }> => {
 	assertTestPathDefined(context, 'setupVisSuite')
 
-	await visContext.setupSuite(context)
+	return visContext.setupSuite(context)
 }

package/src/server/vis_context.logic.ts

@@ -55,6 +55,7 @@ export function createVisContext() {
 			const { suiteId, suite } = createSuite(state, context.testPath, visOptions)
 			state.suites[suiteId] = suite
 			await Promise.allSettled([ctx.rimraf(suite.diffDir), ctx.rimraf(suite.resultDir)])
+			return pick(state, 'subjectDataTestId')
 		},
 		getSnapshotInfo(testPath: string, name: string, options?: { snapshotFileId?: string | undefined }) {
 			const info = context.getSuiteInfo(testPath, name)
@@ -106,7 +107,7 @@ export function createVisContext() {
 
 async function setupState(
 	suite: PartialBrowserCommandContext,
-	visOptions: Pick<VisOptions, 'snapshotRootDir' | 'platform'>,
+	visOptions: Pick<VisOptions, 'snapshotRootDir' | 'platform' | 'subjectDataTestId'>,
 ) {
 	const snapshotRootDir = resolveSnapshotRootDir(visOptions)
 	const projectPath = suite.project.config.root
@@ -122,6 +123,7 @@ async function setupState(
 		snapshotResultDir: join(snapshotRootDir, RESULT_DIR),
 		snapshotDiffDir: join(snapshotRootDir, DIFF_DIR),
 		snapshotRootPath: join(projectPath, snapshotRootDir),
+		subjectDataTestId: visOptions.subjectDataTestId,
 		suites: {},
 	}
 	await Promise.allSettled([ctx.rimraf(join(state.snapshotDiffDir)), ctx.rimraf(join(state.snapshotResultDir))])

package/src/server/vis_context.types.ts

@@ -8,6 +8,7 @@ export type VisState = {
 	snapshotResultDir: string
 	snapshotDiffDir: string
 	snapshotRootPath: string
+	subjectDataTestId: string | undefined
 	suites: Record<
 		string,
 		{

package/src/setup/create_vis.ts

@@ -7,6 +7,7 @@ import { getAutoSnapshotOptions } from '../client/snapshot_options.internal.js'
 import type { SetupVisSuiteCommand } from '../server/commands/setup_vis_suite.ts'
 
 export function createVis(commands: SetupVisSuiteCommand) {
+	let subjectDataTestId: string | undefined
 	/**
 	 * Visual test configuration on the client side.
 	 */
@@ -49,26 +50,26 @@ export function createVis(commands: SetupVisSuiteCommand) {
 		},
 		beforeAll: {
 			async setup() {
-				await commands.setupVisSuite()
+				subjectDataTestId = (await commands.setupVisSuite()).subjectDataTestId
 			},
 		},
 		afterEach: {
 			async matchImageSnapshot() {
 				const meta = getAutoSnapshotOptions(ctx.getCurrentTest())
 				if (!shouldTakeSnapshot(meta)) return
-				await expect(document.body).toMatchImageSnapshot(meta)
+
+				await expect(getSubject(meta?.subjectDataTestId ?? subjectDataTestId)).toMatchImageSnapshot(meta)
 			},
 			matchPerTheme(themes: Record<string, () => Promise<void> | void>) {
 				return async function matchImageSnapshot() {
 					const test = ctx.getCurrentTest()
 					const meta = getAutoSnapshotOptions(test)
 					if (!shouldTakeSnapshot(meta)) return
-
 					const errors: any[] = []
 					for (const themeId in themes) {
 						try {
 							await themes[themeId]!()
-							await expect(document.body).toMatchImageSnapshot({
+							await expect(getSubject(meta?.subjectDataTestId ?? subjectDataTestId)).toMatchImageSnapshot({
 								...meta,
 								customizeSnapshotId: (id) => `${id}-${themeId}`,
 							})
@@ -96,3 +97,12 @@ export function createVis(commands: SetupVisSuiteCommand) {
 	}
 	return vis
 }
+
+function getSubject(subjectDataTestId: string | undefined) {
+	if (subjectDataTestId) {
+		const subject = document.querySelector(`[data-testid="${subjectDataTestId}"]`)
+		if (subject) return subject
+	}
+
+	return document.body
+}