vitest-plugin-vis 2.1.1 → 2.2.0

package/esm/client/ctx.d.ts

@@ -1,4 +1,5 @@
 export declare const ctx: {
+    autoEnabled: boolean;
     getCurrentTest: () => import("vitest").RunnerTestCase<object> | undefined;
     getCurrentSuite: () => import("vitest").SuiteCollector<object>;
     __test__reset(): void;

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

@@ -1 +1 @@
-{"version":3,"file":"ctx.d.ts","sourceRoot":"","sources":["../../src/client/ctx.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,GAAG;;;;CAOf,CAAA"}
+{"version":3,"file":"ctx.d.ts","sourceRoot":"","sources":["../../src/client/ctx.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,GAAG;;;;;CASf,CAAA"}

package/esm/client/ctx.js

@@ -1,9 +1,11 @@
 import { getCurrentSuite, getCurrentTest } from "./vitest_suite_proxy.js";
 export const ctx = {
+    autoEnabled: false,
     getCurrentTest,
     getCurrentSuite,
     __test__reset() {
         ctx.getCurrentTest = getCurrentTest;
         ctx.getCurrentSuite = getCurrentSuite;
+        ctx.autoEnabled = false;
     },
 };

package/esm/client/should_take_snapshot.d.ts

@@ -1,4 +1,4 @@
-import type { SnapshotMeta } from './snapshot_options.ts';
+import { type SnapshotMeta } from './snapshot_options.ts';
 /**
  * Determine should snapshot be taken.
  *
@@ -6,5 +6,5 @@ import type { SnapshotMeta } from './snapshot_options.ts';
  * no `snapshot` tag: false
  * disabled by `!snapshot` tag: false
  */
-export declare function shouldTakeSnapshot(meta?: SnapshotMeta<any> | undefined): boolean;
+export declare function shouldTakeSnapshot(meta?: SnapshotMeta<any> | undefined): boolean | undefined;
 //# sourceMappingURL=should_take_snapshot.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"should_take_snapshot.d.ts","sourceRoot":"","sources":["../../src/client/should_take_snapshot.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEzD;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,GAAG,SAAS,WAGtE"}
+{"version":3,"file":"should_take_snapshot.d.ts","sourceRoot":"","sources":["../../src/client/should_take_snapshot.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,KAAK,YAAY,EAA0B,MAAM,uBAAuB,CAAA;AAEjF;;;;;;GAMG;AACH,wBAAgB,kBAAkB,CAAC,IAAI,CAAC,EAAE,YAAY,CAAC,GAAG,CAAC,GAAG,SAAS,uBAGtE"}

package/esm/client/should_take_snapshot.js

@@ -1,5 +1,5 @@
 import { ctx } from "./ctx.js";
-import { getAutoSnapshotOptions } from "./snapshot_options.internal.js";
+import { getAutoSnapshotOptions } from "./snapshot_options.js";
 /**
  * Determine should snapshot be taken.
  *
@@ -9,5 +9,5 @@ import { getAutoSnapshotOptions } from "./snapshot_options.internal.js";
  */
 export function shouldTakeSnapshot(meta) {
     const m = meta ?? getAutoSnapshotOptions(ctx.getCurrentTest());
-    return document.body.childElementCount > 0 && m?.enable !== false;
+    return document.body.childElementCount > 0 && m?.enable;
 }

package/esm/client/snapshot_options.d.ts

@@ -15,6 +15,7 @@ export type MetaTask = {
     suite?: Suite | undefined;
     meta: Record<string, any>;
 } | undefined;
+export declare function enableAuto(): void;
 /**
  * Set the snapshot options for auto snapshot.
  *
@@ -32,5 +33,6 @@ export type MetaTask = {
  */
 export declare function setAutoSnapshotOptions<M extends ComparisonMethod>(task: MetaTask, meta: SnapshotMeta<M> | boolean): void;
 export declare function setAutoSnapshotOptions<M extends ComparisonMethod>(meta: SnapshotMeta<M> | boolean): void;
+export declare function getAutoSnapshotOptions<M extends SnapshotMeta<any> = SnapshotMeta<any>>(task: MetaTask): M | undefined;
 export {};
 //# sourceMappingURL=snapshot_options.d.ts.map

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":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE/E,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;IAC5B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACtB,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"}
+{"version":3,"file":"snapshot_options.d.ts","sourceRoot":"","sources":["../../src/client/snapshot_options.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,mBAAmB,EAAE,gBAAgB,EAAE,MAAM,oBAAoB,CAAA;AAE/E,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;IAC5B,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACtB,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,wBAAgB,UAAU,SAEzB;AAED;;;;;;;;;;;;;;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;AAwBzG,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,GAAG,YAAY,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,GAAG,CAAC,GAAG,SAAS,CAqBrH"}

package/esm/client/snapshot_options.js

@@ -1,6 +1,8 @@
-import { getCurrentTest } from 'vitest/suite';
 import { NAME } from "../shared/constants.js";
 import { ctx } from "./ctx.js";
+export function enableAuto() {
+    ctx.autoEnabled = true;
+}
 export function setAutoSnapshotOptions(...args) {
     const [task, meta] = parseArgs(args);
     if (task)
@@ -17,3 +19,22 @@ function parseArgs(args) {
 function parseMeta(meta) {
     return typeof meta === 'boolean' ? { enable: meta } : { enable: true, ...meta };
 }
+export function getAutoSnapshotOptions(task) {
+    if (!task)
+        return;
+    const list = [];
+    let current = task;
+    while (current?.suite) {
+        list.unshift(current.suite.meta);
+        current = current.suite;
+    }
+    list.unshift(task.file?.meta);
+    list.push(task.meta);
+    return list.reduce((acc, cur) => {
+        if (cur?.[NAME]) {
+            const { [NAME]: meta } = cur;
+            return Object.assign({}, acc, meta);
+        }
+        return acc;
+    }, { enable: ctx.autoEnabled });
+}

package/esm/client.d.ts

@@ -2,7 +2,7 @@ export * from './client/expect/expectation_result.ts';
 export type * from './client/expect/to_match_image_snapshot.types.ts';
 export * from './client/image_snapshot_matcher.ts';
 export * from './client/should_take_snapshot.ts';
-export * from './client/snapshot_options.ts';
+export { type MetaTask, type SnapshotMeta, setAutoSnapshotOptions } from './client/snapshot_options.ts';
 export * from './client/task_id.ts';
 export type * from './shared/types.ts';
 //# sourceMappingURL=client.d.ts.map

package/esm/client.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAA;AACrD,mBAAmB,kDAAkD,CAAA;AACrE,cAAc,oCAAoC,CAAA;AAClD,cAAc,kCAAkC,CAAA;AAChD,cAAc,8BAA8B,CAAA;AAC5C,cAAc,qBAAqB,CAAA;AACnC,mBAAmB,mBAAmB,CAAA"}
+{"version":3,"file":"client.d.ts","sourceRoot":"","sources":["../src/client.ts"],"names":[],"mappings":"AAAA,cAAc,uCAAuC,CAAA;AACrD,mBAAmB,kDAAkD,CAAA;AACrE,cAAc,oCAAoC,CAAA;AAClD,cAAc,kCAAkC,CAAA;AAChD,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,YAAY,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA;AACvG,cAAc,qBAAqB,CAAA;AACnC,mBAAmB,mBAAmB,CAAA"}

package/esm/client.js

@@ -1,5 +1,5 @@
 export * from "./client/expect/expectation_result.js";
 export * from "./client/image_snapshot_matcher.js";
 export * from "./client/should_take_snapshot.js";
-export * from "./client/snapshot_options.js";
+export { setAutoSnapshotOptions } from "./client/snapshot_options.js";
 export * from "./client/task_id.js";

package/esm/config/types.d.ts

@@ -4,7 +4,7 @@ export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTime
     /**
      * Loads the `test.setupFiles` of the specified preset.
      */
-    preset?: 'manual' | 'auto' | 'none' | undefined;
+    preset?: 'enable' | 'manual' | 'auto' | 'none' | undefined;
     /**
      * The name of the subdirectory that the baseline snapshots get saved in.
      *

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,mBAAmB,EACnB,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;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B;;;;OAIG;IACH,eAAe,CAAC,EACb,MAAM,GACN,CAAC,CAAC,OAAO,EAAE;QACX,EAAE,EAAE,OAAO,CAAA;QACX,WAAW,EAAE,MAAM,CAAA;QACnB,YAAY,EAAE,MAAM,CAAA;QACpB,QAAQ,EAAE,MAAM,CAAA;QAChB,kBAAkB,EAAE,OAAO,GAAG,SAAS,CAAA;QACvC,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAA;KACtC,KAAK,MAAM,CAAC,GACb,SAAS,CAAA;IACZ;;;;;;;;;;;;;;;;;;;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,mBAAmB,EACnB,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,QAAQ,GAAG,MAAM,GAAG,MAAM,GAAG,SAAS,CAAA;IAC1D;;;;;;;;OAQG;IACH,QAAQ,CAAC,EAAE,MAAM,GAAG,SAAS,CAAA;IAC7B;;;;OAIG;IACH,eAAe,CAAC,EACb,MAAM,GACN,CAAC,CAAC,OAAO,EAAE;QACX,EAAE,EAAE,OAAO,CAAA;QACX,WAAW,EAAE,MAAM,CAAA;QACnB,YAAY,EAAE,MAAM,CAAA;QACpB,QAAQ,EAAE,MAAM,CAAA;QAChB,kBAAkB,EAAE,OAAO,GAAG,SAAS,CAAA;QACvC,mBAAmB,EAAE,MAAM,GAAG,SAAS,CAAA;KACtC,KAAK,MAAM,CAAC,GACb,SAAS,CAAA;IACZ;;;;;;;;;;;;;;;;;;;OAmBG;IACH,wBAAwB,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,MAAM,CAAA;CACtD,CAAA"}

package/esm/index.d.ts

@@ -1,4 +1,4 @@
 import './client/expect/augment.ts';
 import './client/page/augment.ts';
-export * from './client/snapshot_options.ts';
+export { type MetaTask, type SnapshotMeta, setAutoSnapshotOptions } from './client/snapshot_options.ts';
 //# sourceMappingURL=index.d.ts.map

package/esm/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,4BAA4B,CAAA;AACnC,OAAO,0BAA0B,CAAA;AAEjC,cAAc,8BAA8B,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,4BAA4B,CAAA;AACnC,OAAO,0BAA0B,CAAA;AAEjC,OAAO,EAAE,KAAK,QAAQ,EAAE,KAAK,YAAY,EAAE,sBAAsB,EAAE,MAAM,8BAA8B,CAAA"}

package/esm/index.js

@@ -1,4 +1,4 @@
 // `vitest-plugin-vis` provides code that can be used in test files.
 import "./client/expect/augment.js";
 import "./client/page/augment.js";
-export * from "./client/snapshot_options.js";
+export { setAutoSnapshotOptions } from "./client/snapshot_options.js";

package/esm/presets/enable.d.ts

@@ -0,0 +1,3 @@
+import '../client/expect/extend.ts';
+import '../client/page/extend.ts';
+//# sourceMappingURL=enable.d.ts.map

package/esm/presets/enable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"enable.d.ts","sourceRoot":"","sources":["../../src/presets/enable.ts"],"names":[],"mappings":"AACA,OAAO,4BAA4B,CAAA;AACnC,OAAO,0BAA0B,CAAA"}

package/esm/presets/enable.js

@@ -0,0 +1,4 @@
+import { vis } from "../setup/vis.js";
+import "../client/expect/extend.js";
+import "../client/page/extend.js";
+vis.presets.enable();

package/esm/server/vis_context.d.ts

@@ -11,15 +11,17 @@ export declare const visContext: {
         resultPath: string;
         diffPath: string;
         timeout?: number | undefined | undefined;
-        comparisonMethod: any;
-        diffOptions?: Partial<import("ssim.js").Options> | undefined;
         failureThresholdType?: "pixel" | "percent" | undefined | undefined;
         failureThreshold?: number | undefined | undefined;
+        comparisonMethod: any;
+        diffOptions?: Partial<import("ssim.js").Options> | undefined;
     } | {
         baselinePath: string;
         resultPath: string;
         diffPath: string;
         timeout?: number | undefined | undefined;
+        failureThresholdType?: "pixel" | "percent" | undefined | undefined;
+        failureThreshold?: number | undefined | undefined;
         comparisonMethod?: any;
         diffOptions?: {
             threshold?: number | undefined;
@@ -30,8 +32,6 @@ export declare const visContext: {
             diffColorAlt?: [number, number, number] | undefined;
             diffMask?: boolean | undefined;
         } | undefined;
-        failureThresholdType?: "pixel" | "percent" | undefined | undefined;
-        failureThreshold?: number | undefined | undefined;
     };
     getTaskCount(testPath: string, taskId: string): number;
     hasImageSnapshot(testPath: string, taskId: string, snapshotFileId: string | undefined): Promise<boolean>;

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

@@ -18,15 +18,17 @@ export declare function createVisContext(): {
         resultPath: string;
         diffPath: string;
         timeout?: number | undefined | undefined;
-        comparisonMethod: any;
-        diffOptions?: Partial<import("ssim.js").Options> | undefined;
         failureThresholdType?: "pixel" | "percent" | undefined | undefined;
         failureThreshold?: number | undefined | undefined;
+        comparisonMethod: any;
+        diffOptions?: Partial<import("ssim.js").Options> | undefined;
     } | {
         baselinePath: string;
         resultPath: string;
         diffPath: string;
         timeout?: number | undefined | undefined;
+        failureThresholdType?: "pixel" | "percent" | undefined | undefined;
+        failureThreshold?: number | undefined | undefined;
         comparisonMethod?: any;
         diffOptions?: {
             threshold?: number | undefined;
@@ -37,8 +39,6 @@ export declare function createVisContext(): {
             diffColorAlt?: [number, number, number] | undefined;
             diffMask?: boolean | undefined;
         } | undefined;
-        failureThresholdType?: "pixel" | "percent" | undefined | undefined;
-        failureThreshold?: number | undefined | undefined;
     };
     getTaskCount(testPath: string, taskId: string): number;
     hasImageSnapshot(testPath: string, taskId: string, snapshotFileId: string | undefined): Promise<boolean>;

package/esm/setup/create_vis.d.ts

@@ -1,9 +1,21 @@
 import { type SnapshotMeta } from '../client.ts';
 import type { SetupVisSuiteCommand } from '../server/commands/setup_vis_suite.ts';
-export declare function createVis<M extends SnapshotMeta<any>>(commands: SetupVisSuiteCommand): {
+/**
+ * Visual test configuration on the client side.
+ */
+export type VisClientConfigurator<M extends SnapshotMeta<any>> = {
     presets: {
         /**
-         * Enable manual visual testing.
+         * Enable visual testing.
+         *
+         * auto snapshot is turned off by default.
+         * You can specify the test to take a snapshot during `afterEach()` hook with `setAutoSnapshotOptions()`.
+         */
+        enable(): void;
+        /**
+         * Enable visual testing.
+         *
+         * `setAutoSnapshotOptions` will have no effect in this preset.
          */
         manual(): void;
         /**
@@ -37,4 +49,5 @@ export declare function createVis<M extends SnapshotMeta<any>>(commands: SetupVi
         matchPerTheme(themes: Record<string, (options: M) => Promise<boolean> | Promise<void> | boolean | void>): () => Promise<void>;
     };
 };
+export declare function createVis<M extends SnapshotMeta<any>>(commands: SetupVisSuiteCommand): VisClientConfigurator<M>;
 //# sourceMappingURL=create_vis.d.ts.map

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":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAY,MAAM,cAAc,CAAA;AAI1D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAA;AAEjF,wBAAgB,SAAS,CAAC,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,oBAAoB;;QAOlF;;WAEG;;QAIH;;;;WAIG;;QAKH;;;;;;;;;;;;;;WAcG;sBACW,MAAM,CAAC,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;;;;;;;8BAqBzE,MAAM,CAAC,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC;;EA4CzG"}
+{"version":3,"file":"create_vis.d.ts","sourceRoot":"","sources":["../../src/setup/create_vis.ts"],"names":[],"mappings":"AAEA,OAAO,EAAE,KAAK,YAAY,EAAoC,MAAM,cAAc,CAAA;AAIlF,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,uCAAuC,CAAA;AAEjF;;GAEG;AACH,MAAM,MAAM,qBAAqB,CAAC,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,IAAI;IAChE,OAAO,EAAE;QACR;;;;;WAKG;QACH,MAAM,IAAI,IAAI,CAAA;QACd;;;;WAIG;QACH,MAAM,IAAI,IAAI,CAAA;QACd;;;;WAIG;QACH,IAAI,IAAI,IAAI,CAAA;QACZ;;;;;;;;;;;;;;WAcG;QACH,KAAK,CAAC,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC,GAAG,IAAI,CAAA;KACtG,CAAA;IACD,SAAS,EAAE;QACV,KAAK,IAAI,OAAO,CAAC,IAAI,CAAC,CAAA;KACtB,CAAA;IACD,SAAS,EAAE;QACV,kBAAkB,IAAI,OAAO,CAAC,IAAI,CAAC,CAAA;QACnC,aAAa,CACZ,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,OAAO,EAAE,CAAC,KAAK,OAAO,CAAC,OAAO,CAAC,GAAG,OAAO,CAAC,IAAI,CAAC,GAAG,OAAO,GAAG,IAAI,CAAC,GACvF,MAAM,OAAO,CAAC,IAAI,CAAC,CAAA;KACtB,CAAA;CACD,CAAA;AAED,wBAAgB,SAAS,CAAC,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,EAAE,QAAQ,EAAE,oBAAoB,4BAkFpF"}

package/esm/setup/create_vis.js

@@ -1,46 +1,25 @@
 import dedent from 'dedent';
 import { afterEach, beforeAll } from 'vitest';
-import { toTaskId } from "../client.js";
+import { setAutoSnapshotOptions, toTaskId } from "../client.js";
 import { ctx } from "../client/ctx.js";
 import { shouldTakeSnapshot } from "../client/should_take_snapshot.js";
-import { getAutoSnapshotOptions } from '../client/snapshot_options.internal.js';
+import { enableAuto, getAutoSnapshotOptions } from "../client/snapshot_options.js";
 export function createVis(commands) {
     let subjectDataTestId;
-    /**
-     * Visual test configuration on the client side.
-     */
     const vis = {
         presets: {
-            /**
-             * Enable manual visual testing.
-             */
+            enable() {
+                beforeAll(vis.beforeAll.setup);
+                afterEach(vis.afterEach.matchImageSnapshot);
+            },
             manual() {
                 beforeAll(vis.beforeAll.setup);
             },
-            /**
-             * Enable automatic visual testing.
-             *
-             * This will take a snapshot after each test.
-             */
             auto() {
                 beforeAll(vis.beforeAll.setup);
                 afterEach(vis.afterEach.matchImageSnapshot);
+                enableAuto();
             },
-            /**
-             * Enable automatic visual testing with multiple themes.
-             *
-             * This will take a snapshot after each test for each theme.
-             *
-             * @param themes A record of theme names and their setup functions.
-             *
-             * @example
-             * ```ts
-             * vis().presets.theme({
-             *  light() { document.body.classList.add('light') },
-             *  dark() { document.body.classList.add('dark') },
-             * })
-             * ```
-             */
             theme(themes) {
                 beforeAll(vis.beforeAll.setup);
                 afterEach(vis.afterEach.matchPerTheme(themes));

package/esm/setup/vis.d.ts

@@ -1,18 +1,5 @@
 /**
  * Visual test configuration on the client side.
  */
-export declare const vis: {
-    presets: {
-        manual(): void;
-        auto(): void;
-        theme(themes: Record<string, (options: import("../client.ts").SnapshotMeta<any>) => Promise<boolean> | Promise<void> | boolean | void>): void;
-    };
-    beforeAll: {
-        setup(): Promise<void>;
-    };
-    afterEach: {
-        matchImageSnapshot(): Promise<void>;
-        matchPerTheme(themes: Record<string, (options: import("../client.ts").SnapshotMeta<any>) => Promise<boolean> | Promise<void> | boolean | void>): () => Promise<void>;
-    };
-};
+export declare const vis: import("./create_vis.ts").VisClientConfigurator<import("../index.ts").SnapshotMeta<any>>;
 //# sourceMappingURL=vis.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"vis.d.ts","sourceRoot":"","sources":["../../src/setup/vis.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,GAAG;;;;;;;;;;;;;CAAsB,CAAA"}
+{"version":3,"file":"vis.d.ts","sourceRoot":"","sources":["../../src/setup/vis.ts"],"names":[],"mappings":"AAGA;;GAEG;AACH,eAAO,MAAM,GAAG,0FAAsB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "vitest-plugin-vis",
-  "version": "2.1.1",
+  "version": "2.2.0",
   "description": "Vitest visual testing plugin",
   "keywords": [
     "image-snapshot",
@@ -40,6 +40,10 @@
       "types": "./esm/presets/auto.d.ts",
       "default": "./esm/presets/auto.js"
     },
+    "./presets/enable": {
+      "types": "./esm/presets/enable.d.ts",
+      "default": "./esm/presets/enable.js"
+    },
     "./presets/manual": {
       "types": "./esm/presets/manual.d.ts",
       "default": "./esm/presets/manual.js"

package/readme.md

@@ -83,7 +83,7 @@ export default defineConfig({
 			}) => `__vis__/${ci ? platform : 'local'}`,
 			platform: '...', // {process.platform} or `local` (deprecated use `snapshotRootDir` instead)
 			customizeSnapshotSubpath: (subpath) => trimCommonFolder(subpath),
-			customizeSnapshotId: (id, index) => `${id}-${index}`,
+			customizeSnapshotId: ({ id, index }) => `${id}-${index}`,
 			// set a default subject (e.g. 'subject') to capture image snapshot
 			subjectDataTestId: undefined,
 			comparisonMethod: 'pixel',
@@ -94,7 +94,7 @@ export default defineConfig({
 			failureThreshold: 0,
 		})
 	],
-	test:{
+	test: {
 		browser: {/* ... */}
 	}
 })
@@ -113,8 +113,8 @@ export default defineConfig({
 	plugins: [
 		vis({ preset: 'none' })
 	],
-	test:{
-		browser:{/* ... */},
+	test: {
+		browser: {/* ... */},
 		setupFiles: ['vitest.setup.ts']
 	}
 })
@@ -123,13 +123,17 @@ export default defineConfig({
 import { vis } from 'vitest-plugin-vis/setup'
 
 // if you set `preset: none` in `vitest.config.ts`,
-// you can enable `auto` or `manual` setup here
+// you can use a preset manually here.
+
+// Take snapshot at the end of each rendering test.
 vis.presets.auto()
+// Enable snapshot testing for manual snapshot only.
 vis.presets.manual()
+// Enable snapshot testing, allow auto snapshot with `setAutoSnapshotOptions()`
+vis.presets.enable()
 
-
-// or capture image snapshot for all rendering tests
-// for multiple themes (light and dark in this example)
+// Take image snapshot for each rendering test,
+// one snapshot per theme (light and dark in this example).
 //
 // Note that this changes the theme in the `afterEach` hook.
 // If you want to capture manual snapshots in different themes,
@@ -160,10 +164,10 @@ To address this, you can add the following to your `tsconfig.json`:
 
 ## Usage
 
-### Auto Snapshot
+### Auto Preset
 
 By default, the plugin will use the `auto` preset,
-which will take a snapshot at the end of each test.
+which will take a snapshot at the end of each rendering test.
 
 You can control how the auto snapshot is taken using the `setAutoSnapshotOptions` function:
 
@@ -213,7 +217,7 @@ setAutoSnapshotOptions(true /* or false */)
 setAutoSnapshotOptions({
 	enable: true,
 	comparisonMethod: 'pixel',
-	customizeSnapshotId: (id, index) => `${id}-custom-${index}`,
+	customizeSnapshotId: ({ id, index }) => `${id}-custom-${index}`,
 	// pixelmatch or ssim.js options, depending on `comparisonMethod`.
 	diffOptions: { threshold: 0.01 },
 	failureThreshold: 0.01,
@@ -238,7 +242,7 @@ vis.presets.theme({
 })
 ```
 
-### Manual Snapshot
+### Manual Preset
 
 You can also set the preset to `manual` and compare snapshots manually:
 
@@ -251,7 +255,7 @@ export default defineConfig({
 		vis({ preset: 'manual' })
 	],
 	test:{
-		browser:{/* ... */}
+		browser: {/* ... */}
 	}
 })
 
@@ -281,7 +285,7 @@ it('manual snapshot with options', async ({ expect }) => {
 	page.render(<div data-testid="subject">hello world</div>)
 	const subject = page.getByTestId('subject')
 	await expect(subject).toMatchImageSnapshot({
-		customizeSnapshotId: (id, index) => `${id}-custom-${index}`,
+		customizeSnapshotId: ({ id, index }) => `${id}-custom-${index}`,
 		failureThreshold: 0.01,
 		failureThresholdType: 'percent',
 		diffOptions: {
@@ -292,6 +296,23 @@ it('manual snapshot with options', async ({ expect }) => {
 })
 ```
 
+### Enable Preset
+
+The `enable` preset allows you to take manual snapshot,
+as well as auto snapshot at the end on a rendering test using the `setAutoSnapshotOptions` function:
+
+```ts
+import { setAutoSnapshotOptions } from 'vitest-plugin-vis'
+import { beforeEach, it } from 'vitest'
+
+
+it('take snapshot', async () => {
+	setAutoSnapshotOptions(/* options */) // e.g. `true`
+
+	// ...your test...
+})
+```
+
 ### Has Snapshot
 
 While less common, you can also check if a snapshot exists:
@@ -311,7 +332,7 @@ it('Has Snapshot', async ({ expect }) => {
 })
 ```
 
-This is useful when you are performing some negative test.
+This is useful when you are performing negative test.
 
 ## Git Ignore
 

package/src/client/ctx.ts

@@ -1,10 +1,12 @@
 import { getCurrentSuite, getCurrentTest } from './vitest_suite_proxy.ts'
 
 export const ctx = {
+	autoEnabled: false,
 	getCurrentTest,
 	getCurrentSuite,
 	__test__reset() {
 		ctx.getCurrentTest = getCurrentTest
 		ctx.getCurrentSuite = getCurrentSuite
+		ctx.autoEnabled = false
 	},
 }

package/src/client/should_take_snapshot.ts

@@ -1,6 +1,5 @@
 import { ctx } from './ctx.ts'
-import { getAutoSnapshotOptions } from './snapshot_options.internal.ts'
-import type { SnapshotMeta } from './snapshot_options.ts'
+import { type SnapshotMeta, getAutoSnapshotOptions } from './snapshot_options.ts'
 
 /**
  * Determine should snapshot be taken.
@@ -11,5 +10,5 @@ import type { SnapshotMeta } from './snapshot_options.ts'
  */
 export function shouldTakeSnapshot(meta?: SnapshotMeta<any> | undefined) {
 	const m = meta ?? getAutoSnapshotOptions(ctx.getCurrentTest())
-	return document.body.childElementCount > 0 && m?.enable !== false
+	return document.body.childElementCount > 0 && m?.enable
 }

package/src/client/snapshot_options.ts

@@ -1,4 +1,3 @@
-import { getCurrentTest } from 'vitest/suite'
 import { NAME } from '../shared/constants.ts'
 import type { AutoSnapshotOptions, ComparisonMethod } from '../shared/types.ts'
 import { ctx } from './ctx.ts'
@@ -20,6 +19,10 @@ export type MetaTask =
 	  }
 	| undefined
 
+export function enableAuto() {
+	ctx.autoEnabled = true
+}
+
 /**
  * Set the snapshot options for auto snapshot.
  *
@@ -62,3 +65,26 @@ function parseArgs<M extends ComparisonMethod>(
 function parseMeta<M extends ComparisonMethod>(meta: boolean | SnapshotMeta<M>): SnapshotMeta<M> {
 	return typeof meta === 'boolean' ? ({ enable: meta } as any) : { enable: true, ...meta }
 }
+
+export function getAutoSnapshotOptions<M extends SnapshotMeta<any> = SnapshotMeta<any>>(task: MetaTask): M | undefined {
+	if (!task) return
+
+	const list: any[] = []
+	let current = task
+	while (current?.suite) {
+		list.unshift(current.suite.meta)
+		current = current.suite
+	}
+	list.unshift(task.file?.meta)
+	list.push(task.meta)
+	return list.reduce(
+		(acc, cur) => {
+			if (cur?.[NAME]) {
+				const { [NAME]: meta } = cur
+				return Object.assign({}, acc, meta)
+			}
+			return acc
+		},
+		{ enable: ctx.autoEnabled },
+	)
+}

package/src/client.ts

@@ -2,6 +2,6 @@ export * from './client/expect/expectation_result.ts'
 export type * from './client/expect/to_match_image_snapshot.types.ts'
 export * from './client/image_snapshot_matcher.ts'
 export * from './client/should_take_snapshot.ts'
-export * from './client/snapshot_options.ts'
+export { type MetaTask, type SnapshotMeta, setAutoSnapshotOptions } from './client/snapshot_options.ts'
 export * from './client/task_id.ts'
 export type * from './shared/types.ts'

package/src/config/types.ts

@@ -15,7 +15,7 @@ export type VisOptions<M extends ComparisonMethod = 'pixel'> = ImageSnapshotTime
 		/**
 		 * Loads the `test.setupFiles` of the specified preset.
 		 */
-		preset?: 'manual' | 'auto' | 'none' | undefined
+		preset?: 'enable' | 'manual' | 'auto' | 'none' | undefined
 		/**
 		 * The name of the subdirectory that the baseline snapshots get saved in.
 		 *

package/src/index.ts

@@ -2,4 +2,4 @@
 import './client/expect/augment.ts'
 import './client/page/augment.ts'
 
-export * from './client/snapshot_options.ts'
+export { type MetaTask, type SnapshotMeta, setAutoSnapshotOptions } from './client/snapshot_options.ts'

package/src/presets/enable.ts

@@ -0,0 +1,5 @@
+import { vis } from '../setup/vis.ts'
+import '../client/expect/extend.ts'
+import '../client/page/extend.ts'
+
+vis.presets.enable()

package/src/setup/create_vis.ts

@@ -1,48 +1,80 @@
 import dedent from 'dedent'
 import { afterEach, beforeAll } from 'vitest'
-import { type SnapshotMeta, toTaskId } from '../client.ts'
+import { type SnapshotMeta, setAutoSnapshotOptions, toTaskId } from '../client.ts'
 import { ctx } from '../client/ctx.ts'
 import { shouldTakeSnapshot } from '../client/should_take_snapshot.ts'
-import { getAutoSnapshotOptions } from '../client/snapshot_options.internal.js'
+import { enableAuto, getAutoSnapshotOptions } from '../client/snapshot_options.ts'
 import type { SetupVisSuiteCommand } from '../server/commands/setup_vis_suite.ts'
 
+/**
+ * Visual test configuration on the client side.
+ */
+export type VisClientConfigurator<M extends SnapshotMeta<any>> = {
+	presets: {
+		/**
+		 * Enable visual testing.
+		 *
+		 * auto snapshot is turned off by default.
+		 * You can specify the test to take a snapshot during `afterEach()` hook with `setAutoSnapshotOptions()`.
+		 */
+		enable(): void
+		/**
+		 * Enable visual testing.
+		 *
+		 * `setAutoSnapshotOptions` will have no effect in this preset.
+		 */
+		manual(): void
+		/**
+		 * Enable automatic visual testing.
+		 *
+		 * This will take a snapshot after each test.
+		 */
+		auto(): void
+		/**
+		 * Enable automatic visual testing with multiple themes.
+		 *
+		 * This will take a snapshot after each test for each theme.
+		 *
+		 * @param themes A record of theme names and their setup functions.
+		 *
+		 * @example
+		 * ```ts
+		 * vis().presets.theme({
+		 *  light() { document.body.classList.add('light') },
+		 *  dark() { document.body.classList.add('dark') },
+		 * })
+		 * ```
+		 */
+		theme(themes: Record<string, (options: M) => Promise<boolean> | Promise<void> | boolean | void>): void
+	}
+	beforeAll: {
+		setup(): Promise<void>
+	}
+	afterEach: {
+		matchImageSnapshot(): Promise<void>
+		matchPerTheme(
+			themes: Record<string, (options: M) => Promise<boolean> | Promise<void> | boolean | void>,
+		): () => Promise<void>
+	}
+}
+
 export function createVis<M extends SnapshotMeta<any>>(commands: SetupVisSuiteCommand) {
 	let subjectDataTestId: string | undefined
-	/**
-	 * Visual test configuration on the client side.
-	 */
-	const vis = {
+
+	const vis: VisClientConfigurator<M> = {
 		presets: {
-			/**
-			 * Enable manual visual testing.
-			 */
+			enable() {
+				beforeAll(vis.beforeAll.setup)
+				afterEach(vis.afterEach.matchImageSnapshot)
+			},
 			manual() {
 				beforeAll(vis.beforeAll.setup)
 			},
-			/**
-			 * Enable automatic visual testing.
-			 *
-			 * This will take a snapshot after each test.
-			 */
 			auto() {
 				beforeAll(vis.beforeAll.setup)
 				afterEach(vis.afterEach.matchImageSnapshot)
+				enableAuto()
 			},
-			/**
-			 * Enable automatic visual testing with multiple themes.
-			 *
-			 * This will take a snapshot after each test for each theme.
-			 *
-			 * @param themes A record of theme names and their setup functions.
-			 *
-			 * @example
-			 * ```ts
-			 * vis().presets.theme({
-			 *  light() { document.body.classList.add('light') },
-			 *  dark() { document.body.classList.add('dark') },
-			 * })
-			 * ```
-			 */
 			theme(themes: Record<string, (options: M) => Promise<boolean> | Promise<void> | boolean | void>) {
 				beforeAll(vis.beforeAll.setup)
 				afterEach(vis.afterEach.matchPerTheme(themes))

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

@@ -1,3 +0,0 @@
-import type { MetaTask, SnapshotMeta } from './snapshot_options.ts';
-export declare function getAutoSnapshotOptions<M extends SnapshotMeta<any> = SnapshotMeta<any>>(task: MetaTask): M | undefined;
-//# sourceMappingURL=snapshot_options.internal.d.ts.map

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

@@ -1 +0,0 @@
-{"version":3,"file":"snapshot_options.internal.d.ts","sourceRoot":"","sources":["../../src/client/snapshot_options.internal.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,QAAQ,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAA;AAEnE,wBAAgB,sBAAsB,CAAC,CAAC,SAAS,YAAY,CAAC,GAAG,CAAC,GAAG,YAAY,CAAC,GAAG,CAAC,EAAE,IAAI,EAAE,QAAQ,GAAG,CAAC,GAAG,SAAS,CAkBrH"}

package/esm/client/snapshot_options.internal.js

@@ -1,20 +0,0 @@
-import { NAME } from "../shared/constants.js";
-export function getAutoSnapshotOptions(task) {
-    if (!task)
-        return;
-    const list = [];
-    let current = task;
-    while (current?.suite) {
-        list.unshift(current.suite.meta);
-        current = current.suite;
-    }
-    list.unshift(task.file?.meta);
-    list.push(task.meta);
-    return list.reduce((acc, cur) => {
-        if (cur?.[NAME]) {
-            const { [NAME]: meta } = cur;
-            return Object.assign({}, acc, meta);
-        }
-        return acc;
-    }, {});
-}

package/src/client/snapshot_options.internal.ts

@@ -1,22 +0,0 @@
-import { NAME } from '../shared/constants.ts'
-import type { MetaTask, SnapshotMeta } from './snapshot_options.ts'
-
-export function getAutoSnapshotOptions<M extends SnapshotMeta<any> = SnapshotMeta<any>>(task: MetaTask): M | undefined {
-	if (!task) return
-
-	const list: any[] = []
-	let current = task
-	while (current?.suite) {
-		list.unshift(current.suite.meta)
-		current = current.suite
-	}
-	list.unshift(task.file?.meta)
-	list.push(task.meta)
-	return list.reduce((acc, cur) => {
-		if (cur?.[NAME]) {
-			const { [NAME]: meta } = cur
-			return Object.assign({}, acc, meta)
-		}
-		return acc
-	}, {})
-}