storybook-addon-vis 0.17.2 → 0.17.3

package/dist/index.d.ts

@@ -1,13 +1,17 @@
 import './matcher.js';
 export * from 'vitest-plugin-vis';
+import * as vitest_plugin_vis_client from 'vitest-plugin-vis/client';
 import { ComparisonMethod, ToMatchImageSnapshotOptions, ImageSnapshotIdOptions } from 'vitest-plugin-vis/client';
 export { ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client';
+import { AutoSnapshotOptions } from 'vitest-plugin-vis/config';
 
 /**
  * Define snapshot parameter for auto snapshot.
  */
-declare function defineAutoSnapshotParam<M extends ComparisonMethod>(snapshot: ToMatchImageSnapshotOptions<M>): {
-    snapshot: ToMatchImageSnapshotOptions<M>;
+declare function defineAutoSnapshotParam<M extends ComparisonMethod>(snapshot: ToMatchImageSnapshotOptions<M> & AutoSnapshotOptions): {
+    snapshot: vitest_plugin_vis_client.ImageSnapshotTimeoutOptions & vitest_plugin_vis_client.ImageSnapshotIdOptions & (M extends "ssim" ? vitest_plugin_vis_client.SsimComparisonOptions<M> : vitest_plugin_vis_client.PixelComparisonOptions<M>) & vitest_plugin_vis_client.FailureThresholdOptions & {
+        expectToFail?: boolean | undefined;
+    } & AutoSnapshotOptions;
 };
 
 declare function isSnapshotEnabled(tags: string[]): boolean;

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/client/expect/to_match_image_snapshot.ts","../src/client/storybook/expect_extend.ts","../src/client/storybook/param.ts","../src/client/ctx.ts","../src/client/has_image_snapshot.ts"],"names":[],"mappings":";;;;;AASO,SAAS,oBAAA,CAKf,SACA,OACyB,EAAA;AACzB,EAAA,MAAM,OAAO,cAAe,EAAA;AAG5B,EAAA,IAAI,CAAC,IAAA,EAAa,OAAA,OAAA,CAAQ,QAAQ,OAAO,CAAA;AAGzC,EAAO,OAAA,oBAAA,CAAqB,QAAQ,CAAE,CAAA,IAAA,EAAM,SAAS,OAAO,CAAA,CAAE,IAAK,CAAA,MAAM,OAAO,CAAA;AACjF;;;ACrBA,MAAO,CAAA,MAAA,CAAO,EAAE,oBAAA,EAAsB,CAAA;;;ACE/B,SAAS,wBAAoD,QAA0C,EAAA;AAC7G,EAAA,OAAO,EAAE,QAAS,EAAA;AACnB;AAIO,SAAS,kBAAkB,IAAgB,EAAA;AACjD,EAAA,OAAO,KAAK,WAAY,CAAA,WAAW,CAAI,GAAA,IAAA,CAAK,YAAY,UAAU,CAAA;AACnE;;;ACXO,IAAM,GAAM,GAAA;AAAA,EAClB,cAAA;AAAA,EACA,aAAgB,GAAA;AACf,IAAA,GAAA,CAAI,cAAiB,GAAA,cAAA;AAAA;AAEvB,CAAA;;;ACAO,SAAS,iBAAiB,OAA8C,EAAA;AAC9E,EAAM,MAAA,IAAA,GAAO,IAAI,cAAe,EAAA;AAChC,EAAI,IAAA,CAAC,MAAa,OAAA,KAAA;AAElB,EAAM,MAAA,MAAA,GAAS,SAAS,IAAI,CAAA;AAC5B,EAAA,IAAI,SAAS,mBAAqB,EAAA;AACjC,IAAA,OAAO,QACL,CAAA,sBAAA,CAAuB,MAAM,CAAA,CAC7B,KAAK,CAAC,KAAA,KAAU,QAAS,CAAA,gBAAA,CAAiB,QAAQ,OAAQ,CAAA,mBAAA,CAAqB,MAAQ,EAAA,KAAK,CAAC,CAAC,CAAA;AAAA;AAGjG,EAAO,OAAA,QAAA,CAAS,iBAAiB,MAAM,CAAA;AACxC","file":"index.js","sourcesContent":["import type { AsyncExpectationResult } from '@vitest/expect'\nimport {\n\ttype ComparisonMethod,\n\ttype ToMatchImageSnapshotOptions,\n\timageSnapshotMatcher,\n\tsuccess,\n} from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport function toMatchImageSnapshot<M extends ComparisonMethod>(\n\t/**\n\t * The element or locator to take the snapshot of,\n\t * or the base64 value of the image to compare against.\n\t */\n\tsubject: any,\n\toptions?: ToMatchImageSnapshotOptions<M> | undefined,\n): AsyncExpectationResult {\n\tconst test = getCurrentTest()\n\n\t/* v8 ignore start: stub as success when not in a test (e.g. in a story) */\n\tif (!test) return Promise.resolve(success)\n\t/* v8 ignore end */\n\n\treturn imageSnapshotMatcher(commands)(test, subject, options).then(() => success)\n}\n","import { expect } from '@storybook/test'\nimport { toMatchImageSnapshot } from '../expect/to_match_image_snapshot.ts'\n\nexpect.extend({ toMatchImageSnapshot })\n","import type { ComparisonMethod, ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam<M extends ComparisonMethod>(snapshot: ToMatchImageSnapshotOptions<M>) {\n\treturn { snapshot }\n}\n\n// This fix the inferred type cannot be named error\nexport type { ToMatchImageSnapshotOptions }\nexport function isSnapshotEnabled(tags: string[]) {\n\treturn tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')\n}\n","import { getCurrentTest } from './vitest_proxy.ts'\n\nexport const ctx = {\n\tgetCurrentTest,\n\t__test__reset() {\n\t\tctx.getCurrentTest = getCurrentTest\n\t},\n}\n","import { type ImageSnapshotIdOptions, toTaskId } from 'vitest-plugin-vis/client'\nimport { ctx } from './ctx.ts'\nimport { commands } from './vitest_proxy.ts'\n\n/**\n * Check if the snapshot image exists.\n */\nexport function hasImageSnapshot(options?: ImageSnapshotIdOptions | undefined) {\n\tconst test = ctx.getCurrentTest()\n\tif (!test) return false\n\n\tconst taskId = toTaskId(test)\n\tif (options?.customizeSnapshotId) {\n\t\treturn commands\n\t\t\t.imageSnapshotNextIndex(taskId)\n\t\t\t.then((index) => commands.hasImageSnapshot(taskId, options.customizeSnapshotId!(taskId, index)))\n\t}\n\n\treturn commands.hasImageSnapshot(taskId)\n}\n"]}
+{"version":3,"sources":["../src/client/expect/to_match_image_snapshot.ts","../src/client/storybook/expect_extend.ts","../src/client/storybook/param.ts","../src/client/ctx.ts","../src/client/has_image_snapshot.ts"],"names":[],"mappings":";;;;;AASO,SAAS,oBAAA,CAKf,SACA,OACyB,EAAA;AACzB,EAAA,MAAM,OAAO,cAAe,EAAA;AAG5B,EAAA,IAAI,CAAC,IAAA,EAAa,OAAA,OAAA,CAAQ,QAAQ,OAAO,CAAA;AAGzC,EAAO,OAAA,oBAAA,CAAqB,QAAQ,CAAE,CAAA,IAAA,EAAM,SAAS,OAAO,CAAA,CAAE,IAAK,CAAA,MAAM,OAAO,CAAA;AACjF;;;ACrBA,MAAO,CAAA,MAAA,CAAO,EAAE,oBAAA,EAAsB,CAAA;;;ACG/B,SAAS,wBACf,QACC,EAAA;AACD,EAAA,OAAO,EAAE,QAAS,EAAA;AACnB;AAIO,SAAS,kBAAkB,IAAgB,EAAA;AACjD,EAAA,OAAO,KAAK,WAAY,CAAA,WAAW,CAAI,GAAA,IAAA,CAAK,YAAY,UAAU,CAAA;AACnE;;;ACdO,IAAM,GAAM,GAAA;AAAA,EAClB,cAAA;AAAA,EACA,aAAgB,GAAA;AACf,IAAA,GAAA,CAAI,cAAiB,GAAA,cAAA;AAAA;AAEvB,CAAA;;;ACAO,SAAS,iBAAiB,OAA8C,EAAA;AAC9E,EAAM,MAAA,IAAA,GAAO,IAAI,cAAe,EAAA;AAChC,EAAI,IAAA,CAAC,MAAa,OAAA,KAAA;AAElB,EAAM,MAAA,MAAA,GAAS,SAAS,IAAI,CAAA;AAC5B,EAAA,IAAI,SAAS,mBAAqB,EAAA;AACjC,IAAA,OAAO,QACL,CAAA,sBAAA,CAAuB,MAAM,CAAA,CAC7B,KAAK,CAAC,KAAA,KAAU,QAAS,CAAA,gBAAA,CAAiB,QAAQ,OAAQ,CAAA,mBAAA,CAAqB,MAAQ,EAAA,KAAK,CAAC,CAAC,CAAA;AAAA;AAGjG,EAAO,OAAA,QAAA,CAAS,iBAAiB,MAAM,CAAA;AACxC","file":"index.js","sourcesContent":["import type { AsyncExpectationResult } from '@vitest/expect'\nimport {\n\ttype ComparisonMethod,\n\ttype ToMatchImageSnapshotOptions,\n\timageSnapshotMatcher,\n\tsuccess,\n} from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport function toMatchImageSnapshot<M extends ComparisonMethod>(\n\t/**\n\t * The element or locator to take the snapshot of,\n\t * or the base64 value of the image to compare against.\n\t */\n\tsubject: any,\n\toptions?: ToMatchImageSnapshotOptions<M> | undefined,\n): AsyncExpectationResult {\n\tconst test = getCurrentTest()\n\n\t/* v8 ignore start: stub as success when not in a test (e.g. in a story) */\n\tif (!test) return Promise.resolve(success)\n\t/* v8 ignore end */\n\n\treturn imageSnapshotMatcher(commands)(test, subject, options).then(() => success)\n}\n","import { expect } from '@storybook/test'\nimport { toMatchImageSnapshot } from '../expect/to_match_image_snapshot.ts'\n\nexpect.extend({ toMatchImageSnapshot })\n","import type { ComparisonMethod, ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\nimport type { AutoSnapshotOptions } from 'vitest-plugin-vis/config'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam<M extends ComparisonMethod>(\n\tsnapshot: ToMatchImageSnapshotOptions<M> & AutoSnapshotOptions,\n) {\n\treturn { snapshot }\n}\n\n// This fix the inferred type cannot be named error\nexport type { ToMatchImageSnapshotOptions }\nexport function isSnapshotEnabled(tags: string[]) {\n\treturn tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')\n}\n","import { getCurrentTest } from './vitest_proxy.ts'\n\nexport const ctx = {\n\tgetCurrentTest,\n\t__test__reset() {\n\t\tctx.getCurrentTest = getCurrentTest\n\t},\n}\n","import { type ImageSnapshotIdOptions, toTaskId } from 'vitest-plugin-vis/client'\nimport { ctx } from './ctx.ts'\nimport { commands } from './vitest_proxy.ts'\n\n/**\n * Check if the snapshot image exists.\n */\nexport function hasImageSnapshot(options?: ImageSnapshotIdOptions | undefined) {\n\tconst test = ctx.getCurrentTest()\n\tif (!test) return false\n\n\tconst taskId = toTaskId(test)\n\tif (options?.customizeSnapshotId) {\n\t\treturn commands\n\t\t\t.imageSnapshotNextIndex(taskId)\n\t\t\t.then((index) => commands.hasImageSnapshot(taskId, options.customizeSnapshotId!(taskId, index)))\n\t}\n\n\treturn commands.hasImageSnapshot(taskId)\n}\n"]}

package/dist/preview.js

@@ -1,2 +1,2 @@
-import {expect}from'@storybook/test';import {imageSnapshotMatcher,success}from'vitest-plugin-vis/client';import {setAutoSnapshotOptions}from'vitest-plugin-vis';var a,s;globalThis.__vitest_browser__&&(import('@vitest/browser/context').then(t=>{a=t;}),import('vitest/suite').then(t=>{s=t;}));var r=new Proxy({},{get(t,o){return a?.commands?.[o]}}),e=()=>s?.getCurrentTest();function p(t,o){let n=e();return n?imageSnapshotMatcher(r)(n,t,o).then(()=>success):Promise.resolve(success)}expect.extend({toMatchImageSnapshot:p});function i(t){return t.lastIndexOf("!snapshot")<t.lastIndexOf("snapshot")}var h={beforeEach(t){setAutoSnapshotOptions(e(),{enable:i(t.tags),...t.parameters?.snapshot});}};var T=h;export{T as default};//# sourceMappingURL=preview.js.map
+import {expect}from'@storybook/test';import {imageSnapshotMatcher,success}from'vitest-plugin-vis/client';import {setAutoSnapshotOptions}from'vitest-plugin-vis';var s,a;globalThis.__vitest_browser__&&(import('@vitest/browser/context').then(t=>{s=t;}),import('vitest/suite').then(t=>{a=t;}));var r=new Proxy({},{get(t,e){return s?.commands?.[e]}}),o=()=>a?.getCurrentTest();function p(t,e){let n=o();return n?imageSnapshotMatcher(r)(n,t,e).then(()=>success):Promise.resolve(success)}expect.extend({toMatchImageSnapshot:p});function i(t){return t.lastIndexOf("!snapshot")<t.lastIndexOf("snapshot")}var h={beforeEach(t){setAutoSnapshotOptions(o(),{enable:i(t.tags),...t.parameters?.snapshot});}};var O=h;export{O as default};//# sourceMappingURL=preview.js.map
 //# sourceMappingURL=preview.js.map

package/dist/preview.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/client/vitest_proxy.ts","../src/client/expect/to_match_image_snapshot.ts","../src/client/storybook/expect_extend.ts","../src/client/storybook/param.ts","../src/preview/vis_annotation.ts","../src/preview.ts"],"names":["browserContext","vitestSuite","m","commands","_target","prop","getCurrentTest","toMatchImageSnapshot","subject","options","test","imageSnapshotMatcher","success","expect","isSnapshotEnabled","tags","visAnnotations","ctx","setAutoSnapshotOptions","preview_default"],"mappings":"gKAoBA,IAAIA,CACAC,CAAAA,CAAAA,CAEC,WAAmB,kBACvB,GAAA,OAAO,yBAAyB,CAAA,CAAE,IAAMC,CAAAA,CAAAA,EAAM,CAC7CF,CAAAA,CAAiBE,EAClB,CAAC,CACD,CAAA,OAAO,cAAc,CAAA,CAAE,IAAMA,CAAAA,CAAAA,EAAM,CAClCD,CAAcC,CAAAA,EACf,CAAC,CAAA,CAAA,CAGK,IAAMC,CAAAA,CAAW,IAAI,KAAA,CAAuB,EAAC,CAAU,CAC7D,GAAA,CAAIC,CAASC,CAAAA,CAAAA,CAAM,CAClB,OAAQL,GAAgB,QAAmBK,GAAAA,CAAI,CAChD,CACD,CAAC,CAAA,CAEYC,CAAiB,CAAA,IAAML,GAAa,cAAe,EAAA,CC7BzD,SAASM,CAAAA,CAKfC,CACAC,CAAAA,CAAAA,CACyB,CACzB,IAAMC,EAAOJ,CAAe,EAAA,CAG5B,OAAKI,CAAAA,CAGEC,oBAAqBR,CAAAA,CAAQ,CAAEO,CAAAA,CAAAA,CAAMF,CAASC,CAAAA,CAAO,CAAE,CAAA,IAAA,CAAK,IAAMG,OAAO,CAH9D,CAAA,OAAA,CAAQ,QAAQA,OAAO,CAI1C,CCrBAC,MAAAA,CAAO,MAAO,CAAA,CAAE,oBAAAN,CAAAA,CAAqB,CAAC,CAAA,CCQ/B,SAASO,CAAAA,CAAkBC,EAAgB,CACjD,OAAOA,CAAK,CAAA,WAAA,CAAY,WAAW,CAAA,CAAIA,CAAK,CAAA,WAAA,CAAY,UAAU,CACnE,CCRO,IAAMC,CAAiB,CAAA,CAC7B,UAAWC,CAAAA,CAAAA,CAAmB,CAC7BC,sBAAuBZ,CAAAA,CAAAA,EAAkB,CAAA,CAAE,MAAQQ,CAAAA,CAAAA,CAAkBG,CAAI,CAAA,IAAI,EAAG,GAAGA,CAAAA,CAAI,UAAY,EAAA,QAAS,CAAC,EAC9G,CACD,CAAA,KCLOE,CAAQH,CAAAA","file":"preview.js","sourcesContent":["import type { BrowserCommands } from '@vitest/browser/context'\nimport type {\n\tHasImageSnapshotCommand,\n\tImageSnapshotNextIndexCommand,\n\tMatchImageSnapshotCommand,\n\tPrepareImageSnapshotComparisonCommand,\n\tSetupVisSuiteCommand,\n\tWriteImageSnapshotCommand,\n} from 'vitest-plugin-vis/commands'\n\ndeclare module '@vitest/browser/context' {\n\tinterface BrowserCommands\n\t\textends MatchImageSnapshotCommand,\n\t\t\tHasImageSnapshotCommand,\n\t\t\tPrepareImageSnapshotComparisonCommand,\n\t\t\tImageSnapshotNextIndexCommand,\n\t\t\tWriteImageSnapshotCommand,\n\t\t\tSetupVisSuiteCommand {}\n}\n\nlet browserContext: Awaited<typeof import('@vitest/browser/context')>\nlet vitestSuite: Awaited<typeof import('vitest/suite')>\n\nif ((globalThis as any).__vitest_browser__) {\n\timport('@vitest/browser/context').then((m) => {\n\t\tbrowserContext = m\n\t})\n\timport('vitest/suite').then((m) => {\n\t\tvitestSuite = m\n\t})\n}\n\nexport const commands = new Proxy<BrowserCommands>({} as any, {\n\tget(_target, prop) {\n\t\treturn (browserContext?.commands as any)?.[prop]\n\t},\n})\n\nexport const getCurrentTest = () => vitestSuite?.getCurrentTest()\n","import type { AsyncExpectationResult } from '@vitest/expect'\nimport {\n\ttype ComparisonMethod,\n\ttype ToMatchImageSnapshotOptions,\n\timageSnapshotMatcher,\n\tsuccess,\n} from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport function toMatchImageSnapshot<M extends ComparisonMethod>(\n\t/**\n\t * The element or locator to take the snapshot of,\n\t * or the base64 value of the image to compare against.\n\t */\n\tsubject: any,\n\toptions?: ToMatchImageSnapshotOptions<M> | undefined,\n): AsyncExpectationResult {\n\tconst test = getCurrentTest()\n\n\t/* v8 ignore start: stub as success when not in a test (e.g. in a story) */\n\tif (!test) return Promise.resolve(success)\n\t/* v8 ignore end */\n\n\treturn imageSnapshotMatcher(commands)(test, subject, options).then(() => success)\n}\n","import { expect } from '@storybook/test'\nimport { toMatchImageSnapshot } from '../expect/to_match_image_snapshot.ts'\n\nexpect.extend({ toMatchImageSnapshot })\n","import type { ComparisonMethod, ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam<M extends ComparisonMethod>(snapshot: ToMatchImageSnapshotOptions<M>) {\n\treturn { snapshot }\n}\n\n// This fix the inferred type cannot be named error\nexport type { ToMatchImageSnapshotOptions }\nexport function isSnapshotEnabled(tags: string[]) {\n\treturn tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')\n}\n","import type { ProjectAnnotations, Renderer, StoryContext } from 'storybook/internal/types'\nimport { setAutoSnapshotOptions } from 'vitest-plugin-vis'\nimport { isSnapshotEnabled } from '../client/storybook/param.ts'\nimport { getCurrentTest } from '../client/vitest_proxy.ts'\n\nexport const visAnnotations = {\n\tbeforeEach(ctx: StoryContext) {\n\t\tsetAutoSnapshotOptions(getCurrentTest(), { enable: isSnapshotEnabled(ctx.tags), ...ctx.parameters?.snapshot })\n\t},\n} satisfies ProjectAnnotations<Renderer>\n","import './client/storybook/expect_extend.ts'\nimport './shared/global_matcher_augment.ts'\nimport { visAnnotations } from './preview/vis_annotation.ts'\n\nexport default visAnnotations\n"]}
+{"version":3,"sources":["../src/client/vitest_proxy.ts","../src/client/expect/to_match_image_snapshot.ts","../src/client/storybook/expect_extend.ts","../src/client/storybook/param.ts","../src/preview/vis_annotation.ts","../src/preview.ts"],"names":["browserContext","vitestSuite","m","commands","_target","prop","getCurrentTest","toMatchImageSnapshot","subject","options","test","imageSnapshotMatcher","success","expect","isSnapshotEnabled","tags","visAnnotations","ctx","setAutoSnapshotOptions","preview_default"],"mappings":"gKAoBA,IAAIA,CACAC,CAAAA,CAAAA,CAEC,WAAmB,kBACvB,GAAA,OAAO,yBAAyB,CAAA,CAAE,IAAMC,CAAAA,CAAAA,EAAM,CAC7CF,CAAAA,CAAiBE,EAClB,CAAC,CACD,CAAA,OAAO,cAAc,CAAA,CAAE,IAAMA,CAAAA,CAAAA,EAAM,CAClCD,CAAcC,CAAAA,EACf,CAAC,CAAA,CAAA,CAGK,IAAMC,CAAAA,CAAW,IAAI,KAAA,CAAuB,EAAC,CAAU,CAC7D,GAAA,CAAIC,CAASC,CAAAA,CAAAA,CAAM,CAClB,OAAQL,GAAgB,QAAmBK,GAAAA,CAAI,CAChD,CACD,CAAC,CAAA,CAEYC,CAAiB,CAAA,IAAML,GAAa,cAAe,EAAA,CC7BzD,SAASM,CAAAA,CAKfC,CACAC,CAAAA,CAAAA,CACyB,CACzB,IAAMC,EAAOJ,CAAe,EAAA,CAG5B,OAAKI,CAAAA,CAGEC,oBAAqBR,CAAAA,CAAQ,CAAEO,CAAAA,CAAAA,CAAMF,CAASC,CAAAA,CAAO,CAAE,CAAA,IAAA,CAAK,IAAMG,OAAO,CAH9D,CAAA,OAAA,CAAQ,QAAQA,OAAO,CAI1C,CCrBAC,MAAAA,CAAO,MAAO,CAAA,CAAE,oBAAAN,CAAAA,CAAqB,CAAC,CAAA,CCW/B,SAASO,CAAAA,CAAkBC,EAAgB,CACjD,OAAOA,CAAK,CAAA,WAAA,CAAY,WAAW,CAAA,CAAIA,CAAK,CAAA,WAAA,CAAY,UAAU,CACnE,CCXO,IAAMC,CAAiB,CAAA,CAC7B,UAAWC,CAAAA,CAAAA,CAAmB,CAC7BC,sBAAuBZ,CAAAA,CAAAA,EAAkB,CAAA,CAAE,MAAQQ,CAAAA,CAAAA,CAAkBG,CAAI,CAAA,IAAI,EAAG,GAAGA,CAAAA,CAAI,UAAY,EAAA,QAAS,CAAC,EAC9G,CACD,CAAA,KCLOE,CAAQH,CAAAA","file":"preview.js","sourcesContent":["import type { BrowserCommands } from '@vitest/browser/context'\nimport type {\n\tHasImageSnapshotCommand,\n\tImageSnapshotNextIndexCommand,\n\tMatchImageSnapshotCommand,\n\tPrepareImageSnapshotComparisonCommand,\n\tSetupVisSuiteCommand,\n\tWriteImageSnapshotCommand,\n} from 'vitest-plugin-vis/commands'\n\ndeclare module '@vitest/browser/context' {\n\tinterface BrowserCommands\n\t\textends MatchImageSnapshotCommand,\n\t\t\tHasImageSnapshotCommand,\n\t\t\tPrepareImageSnapshotComparisonCommand,\n\t\t\tImageSnapshotNextIndexCommand,\n\t\t\tWriteImageSnapshotCommand,\n\t\t\tSetupVisSuiteCommand {}\n}\n\nlet browserContext: Awaited<typeof import('@vitest/browser/context')>\nlet vitestSuite: Awaited<typeof import('vitest/suite')>\n\nif ((globalThis as any).__vitest_browser__) {\n\timport('@vitest/browser/context').then((m) => {\n\t\tbrowserContext = m\n\t})\n\timport('vitest/suite').then((m) => {\n\t\tvitestSuite = m\n\t})\n}\n\nexport const commands = new Proxy<BrowserCommands>({} as any, {\n\tget(_target, prop) {\n\t\treturn (browserContext?.commands as any)?.[prop]\n\t},\n})\n\nexport const getCurrentTest = () => vitestSuite?.getCurrentTest()\n","import type { AsyncExpectationResult } from '@vitest/expect'\nimport {\n\ttype ComparisonMethod,\n\ttype ToMatchImageSnapshotOptions,\n\timageSnapshotMatcher,\n\tsuccess,\n} from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport function toMatchImageSnapshot<M extends ComparisonMethod>(\n\t/**\n\t * The element or locator to take the snapshot of,\n\t * or the base64 value of the image to compare against.\n\t */\n\tsubject: any,\n\toptions?: ToMatchImageSnapshotOptions<M> | undefined,\n): AsyncExpectationResult {\n\tconst test = getCurrentTest()\n\n\t/* v8 ignore start: stub as success when not in a test (e.g. in a story) */\n\tif (!test) return Promise.resolve(success)\n\t/* v8 ignore end */\n\n\treturn imageSnapshotMatcher(commands)(test, subject, options).then(() => success)\n}\n","import { expect } from '@storybook/test'\nimport { toMatchImageSnapshot } from '../expect/to_match_image_snapshot.ts'\n\nexpect.extend({ toMatchImageSnapshot })\n","import type { ComparisonMethod, ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\nimport type { AutoSnapshotOptions } from 'vitest-plugin-vis/config'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam<M extends ComparisonMethod>(\n\tsnapshot: ToMatchImageSnapshotOptions<M> & AutoSnapshotOptions,\n) {\n\treturn { snapshot }\n}\n\n// This fix the inferred type cannot be named error\nexport type { ToMatchImageSnapshotOptions }\nexport function isSnapshotEnabled(tags: string[]) {\n\treturn tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')\n}\n","import type { ProjectAnnotations, Renderer, StoryContext } from 'storybook/internal/types'\nimport { setAutoSnapshotOptions } from 'vitest-plugin-vis'\nimport { isSnapshotEnabled } from '../client/storybook/param.ts'\nimport { getCurrentTest } from '../client/vitest_proxy.ts'\n\nexport const visAnnotations = {\n\tbeforeEach(ctx: StoryContext) {\n\t\tsetAutoSnapshotOptions(getCurrentTest(), { enable: isSnapshotEnabled(ctx.tags), ...ctx.parameters?.snapshot })\n\t},\n} satisfies ProjectAnnotations<Renderer>\n","import './client/storybook/expect_extend.ts'\nimport './shared/global_matcher_augment.ts'\nimport { visAnnotations } from './preview/vis_annotation.ts'\n\nexport default visAnnotations\n"]}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "storybook-addon-vis",
-  "version": "0.17.2",
+  "version": "0.17.3",
   "description": "Storybook Vitest visual testing addon",
   "keywords": [
     "image-snapshot",
@@ -58,7 +58,7 @@
   ],
   "dependencies": {
     "type-plus": "^8.0.0-beta.6",
-    "vitest-plugin-vis": "1.5.1"
+    "vitest-plugin-vis": "1.6.0"
   },
   "devDependencies": {
     "@storybook/addon-essentials": "^8.4.2",
@@ -73,9 +73,9 @@
     "@types/react": "^18.2.65",
     "@types/react-dom": "^18.2.21",
     "@vitejs/plugin-react": "^4.2.1",
-    "@vitest/browser": "^2.1.8",
-    "@vitest/coverage-istanbul": "^2.1.8",
-    "@vitest/expect": "^2.1.8",
+    "@vitest/browser": "^3.0.0",
+    "@vitest/coverage-istanbul": "^3.0.0",
+    "@vitest/expect": "^3.0.0",
     "boxen": "^8.0.1",
     "cross-env": "^7.0.3",
     "dedent": "^1.5.1",
@@ -85,16 +85,16 @@
     "storybook": "^8.4.2",
     "tsup": "^8.3.5",
     "typescript": "^5.7.2",
-    "vite": "^5.3.5",
+    "vite": "^6.0.0",
     "vitest-browser-react": "^0.0.4",
-    "webdriverio": "^9.4.1",
+    "webdriverio": "^9.5.7",
     "zx": "^8.0.0"
   },
   "peerDependencies": {
     "@types/pixelmatch": "^5.2.6",
-    "@vitest/browser": "^2.1.3",
+    "@vitest/browser": "^2 || ^3",
     "storybook": "^8.3.0",
-    "vitest": "^2.1.3"
+    "vitest": "^2 || ^3"
   },
   "publishConfig": {
     "access": "public"

package/readme.md

@@ -78,6 +78,7 @@ This default configuration will:
 
 - Use `pixelmatch` as the diffing algorithm.
 - 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.
@@ -97,12 +98,14 @@ 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
 		})
 	],
 })
@@ -254,13 +257,13 @@ const project = setProjectAnnotations([
 	projectAnnotations
 ])
 
-// capture image snapshot for all test, and all stories with `snapshot` tag
-vis.presets.auto()
-
-// or setup visual testing but you control when to capture image snapshot
+// setup visual testing but no post-test image snapshot
 vis.presets.manual()
 
-// or capture image snapshot for all stories with `snapshot` tag,
+// capture image snapshot at the end of each test and story with `snapshot` tag
+vis.presets.auto()
+
+// capture image snapshot at the end of each test and story with `snapshot` tag
 // for multiple themes (light and dark in this example)
 vis.presets.theme({
 	light() { document.body.classList.remove('dark') },
@@ -376,7 +379,7 @@ Note that since they are captured during test,
 if you set `tags: ['!test']` to disable testing,
 no snapshot will be taken either.
 
-You can provide options to the `toMatchImageSnapshot` matcher using parameters.
+You can provide options to the `toMatchImageSnapshot` matcher using Storybook parameters.
 `defineAutoSnapshotParam()` is a helper function to provide autocompletion:
 
 ```tsx

package/src/client/storybook/param.ts

@@ -1,9 +1,12 @@
 import type { ComparisonMethod, ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'
+import type { AutoSnapshotOptions } from 'vitest-plugin-vis/config'
 
 /**
  * Define snapshot parameter for auto snapshot.
  */
-export function defineAutoSnapshotParam<M extends ComparisonMethod>(snapshot: ToMatchImageSnapshotOptions<M>) {
+export function defineAutoSnapshotParam<M extends ComparisonMethod>(
+	snapshot: ToMatchImageSnapshotOptions<M> & AutoSnapshotOptions,
+) {
 	return { snapshot }
 }