storybook-addon-vis 0.16.0 → 0.16.2

package/dist/{chunk-GZMKOHHR.js → chunk-Q6DPWZ7S.js}

@@ -11,14 +11,11 @@ if (globalThis.__vitest_browser__) {
 }
 var commands = new Proxy({}, {
   get(_target, prop) {
-    return browserContext?.commands?.[prop] ?? /* v8 ignore start : used in storybook, not in vitest */
-    (() => {
-      throw new Error(`Command '${String(prop)}' not found`);
-    })();
+    return browserContext?.commands?.[prop];
   }
 });
 var getCurrentTest = () => vitestSuite?.getCurrentTest();
 
 export { commands, getCurrentTest };
-//# sourceMappingURL=chunk-GZMKOHHR.js.map
-//# sourceMappingURL=chunk-GZMKOHHR.js.map
+//# sourceMappingURL=chunk-Q6DPWZ7S.js.map
+//# sourceMappingURL=chunk-Q6DPWZ7S.js.map

package/dist/chunk-Q6DPWZ7S.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/client/vitest_proxy.ts"],"names":[],"mappings":";AAoBA,IAAI,cAAA;AACJ,IAAI,WAAA;AAEJ,IAAK,WAAmB,kBAAoB,EAAA;AAC3C,EAAA,OAAO,yBAAyB,CAAA,CAAE,IAAK,CAAA,CAAC,CAAM,KAAA;AAC7C,IAAiB,cAAA,GAAA,CAAA;AAAA,GACjB,CAAA;AACD,EAAA,OAAO,cAAc,CAAA,CAAE,IAAK,CAAA,CAAC,CAAM,KAAA;AAClC,IAAc,WAAA,GAAA,CAAA;AAAA,GACd,CAAA;AACF;AAEO,IAAM,QAAW,GAAA,IAAI,KAAuB,CAAA,EAAW,EAAA;AAAA,EAC7D,GAAA,CAAI,SAAS,IAAM,EAAA;AAClB,IAAQ,OAAA,cAAA,EAAgB,WAAmB,IAAI,CAAA;AAAA;AAEjD,CAAC;AAEY,IAAA,cAAA,GAAiB,MAAM,WAAA,EAAa,cAAe","file":"chunk-Q6DPWZ7S.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"]}

package/dist/index.d.ts

@@ -1,3 +1,4 @@
+import './matcher.js';
 export * from 'vitest-plugin-vis';
 import { ToMatchImageSnapshotOptions, ImageSnapshotIdOptions } from 'vitest-plugin-vis/client';
 export { ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client';
@@ -9,9 +10,11 @@ declare function defineAutoSnapshotParam(snapshot: ToMatchImageSnapshotOptions):
     snapshot: ToMatchImageSnapshotOptions;
 };
 
+declare function isSnapshotEnabled(tags: string[]): boolean;
+
 /**
  * Check if the snapshot image exists.
  */
 declare function hasImageSnapshot(options?: ImageSnapshotIdOptions | undefined): false | Promise<boolean>;
 
-export { defineAutoSnapshotParam, hasImageSnapshot };
+export { defineAutoSnapshotParam, hasImageSnapshot, isSnapshotEnabled };

package/dist/index.js

@@ -1,13 +1,36 @@
-import { getCurrentTest, commands } from './chunk-GZMKOHHR.js';
+import { getCurrentTest, commands } from './chunk-Q6DPWZ7S.js';
+import { expect } from '@storybook/test';
+import { success, imageSnapshotMatcher, toTaskId } from 'vitest-plugin-vis/client';
 export * from 'vitest-plugin-vis';
-import { toTaskId } from 'vitest-plugin-vis/client';
+
+function toMatchImageSnapshot(subject, options) {
+  const test = getCurrentTest();
+  if (!test) return Promise.resolve(success);
+  return imageSnapshotMatcher(commands)(test, subject, options).then(() => success);
+}
+
+// src/client/storybook/expect_extend.ts
+expect.extend({ toMatchImageSnapshot });
 
 // src/client/storybook/param.ts
 function defineAutoSnapshotParam(snapshot) {
   return { snapshot };
 }
+function isSnapshotEnabled(tags) {
+  return tags.lastIndexOf("!snapshot") < tags.lastIndexOf("snapshot");
+}
+
+// src/client/ctx.ts
+var ctx = {
+  getCurrentTest,
+  __test__reset() {
+    ctx.getCurrentTest = getCurrentTest;
+  }
+};
+
+// src/client/has_image_snapshot.ts
 function hasImageSnapshot(options) {
-  const test = getCurrentTest();
+  const test = ctx.getCurrentTest();
   if (!test) return false;
   const taskId = toTaskId(test);
   if (options?.customizeSnapshotId) {
@@ -16,6 +39,6 @@ function hasImageSnapshot(options) {
   return commands.hasImageSnapshot(taskId);
 }
 
-export { defineAutoSnapshotParam, hasImageSnapshot };
+export { defineAutoSnapshotParam, hasImageSnapshot, isSnapshotEnabled };
 //# sourceMappingURL=index.js.map
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/client/storybook/param.ts","../src/client/has_image_snapshot.ts"],"names":[],"mappings":";;;;;AAKO,SAAS,wBAAwB,QAAuC,EAAA;AAC9E,EAAA,OAAO,EAAE,QAAS,EAAA;AACnB;ACDO,SAAS,iBAAiB,OAA8C,EAAA;AAC9E,EAAA,MAAM,OAAO,cAAe,EAAA;AAC5B,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 { ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam(snapshot: ToMatchImageSnapshotOptions) {\n\treturn { snapshot }\n}\n\n// This fix the inferred type cannot be named error\nexport type { ToMatchImageSnapshotOptions }\n","import { type ImageSnapshotIdOptions, toTaskId } from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from './vitest_proxy.ts'\n\n/**\n * Check if the snapshot image exists.\n */\nexport function hasImageSnapshot(options?: ImageSnapshotIdOptions | undefined) {\n\tconst test = 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":";;;;;AAIO,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;;;AChBA,MAAO,CAAA,MAAA,CAAO,EAAE,oBAAA,EAAsB,CAAA;;;ACE/B,SAAS,wBAAwB,QAAuC,EAAA;AAC9E,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 { type ToMatchImageSnapshotOptions, imageSnapshotMatcher, success } from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport function toMatchImageSnapshot(\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 | 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 { ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam(snapshot: ToMatchImageSnapshotOptions) {\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/matcher.d.ts

@@ -0,0 +1,8 @@
+import { ImageSnapshotMatcher } from 'vitest-plugin-vis/client';
+
+declare global {
+    namespace jest {
+        interface Matchers<R, T> extends ImageSnapshotMatcher {
+        }
+    }
+}

package/dist/matcher.js

@@ -0,0 +1,3 @@
+
+//# sourceMappingURL=matcher.js.map
+//# sourceMappingURL=matcher.js.map

package/dist/matcher.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"matcher.js"}

package/dist/preview.js

@@ -1,2 +1,2 @@
-import {expect}from'@storybook/test';import {matchImageSnapshot,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;}));new Proxy({},{get(t,e){return s?.commands?.[e]??(()=>{throw new Error(`Command '${String(e)}' not found`)})()}});var n=()=>a?.getCurrentTest();function m(t,e){let o=n();return o?matchImageSnapshot(o,t,e).then(()=>success):Promise.resolve(success)}expect.extend({toMatchImageSnapshot:m});var i={beforeEach(t){let e=t.tags,o=e?e.lastIndexOf("!snapshot")<e.lastIndexOf("snapshot"):!1,p=n();setAutoSnapshotOptions(p,{enable:o,...t.parameters?.snapshot});}};var O=i;export{O 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 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
 //# 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/preview/vis_annotation.ts","../src/preview.ts"],"names":["browserContext","vitestSuite","m","_target","prop","getCurrentTest","toMatchImageSnapshot","subject","options","test","matchImageSnapshot","success","expect","visAnnotations","ctx","tags","enable","setAutoSnapshotOptions","preview_default"],"mappings":"8JAgBA,IAAIA,CAAAA,CACAC,CAEC,CAAA,UAAA,CAAmB,qBACvB,OAAO,yBAAyB,CAAE,CAAA,IAAA,CAAMC,CAAM,EAAA,CAC7CF,CAAiBE,CAAAA,EAClB,CAAC,CACD,CAAA,OAAO,cAAc,CAAA,CAAE,KAAMA,CAAM,EAAA,CAClCD,CAAcC,CAAAA,EACf,CAAC,CAGK,CAAA,CAAiB,IAAI,KAAuB,CAAA,EAAW,CAAA,CAC7D,IAAIC,CAASC,CAAAA,CAAAA,CAAM,CAClB,OACEJ,CAAgB,EAAA,QAAA,GAAmBI,CAAI,CAAA,EAAA,CAEvC,IAAM,CACN,MAAM,IAAI,KAAA,CAAM,CAAY,SAAA,EAAA,MAAA,CAAOA,CAAI,CAAC,aAAa,CACtD,CAAA,GAGF,CACD,CAAC,CAEYC,KAAAA,CAAAA,CAAiB,IAAMJ,CAAAA,EAAa,iBC3B1C,SAASK,CAKfC,CAAAA,CAAAA,CACAC,CACyB,CAAA,CACzB,IAAMC,CAAAA,CAAOJ,GAGb,CAAA,OAAKI,CAGEC,CAAAA,kBAAAA,CAAmBD,CAAMF,CAAAA,CAAAA,CAASC,CAAO,CAAA,CAAE,KAAK,IAAMG,OAAO,CAHlD,CAAA,OAAA,CAAQ,OAAQA,CAAAA,OAAO,CAI1C,CCzBAC,OAAO,MAAO,CAAA,CAAE,oBAAAN,CAAAA,CAAqB,CAAC,CCHtC,CAGO,IAAMO,CAAAA,CAAiB,CAC7B,UAAA,CAAWC,CAAmB,CAAA,CAC7B,IAAMC,CAAAA,CAAOD,EAAI,IACXE,CAAAA,CAAAA,CAAUD,CAAeA,CAAAA,CAAAA,CAAK,YAAY,WAAW,CAAA,CAAIA,CAAK,CAAA,WAAA,CAAY,UAAU,CAAnE,CAAA,CAAA,CAAA,CACjBN,CAAOJ,CAAAA,CAAAA,EACbY,CAAAA,sBAAAA,CAAuBR,CAAM,CAAA,CAAE,OAAAO,CAAQ,CAAA,GAAGF,CAAI,CAAA,UAAA,EAAY,QAAS,CAAC,EACrE,CACD,CAAA,KCROI,CAAQL,CAAAA","file":"preview.js","sourcesContent":["import type { BrowserCommands } from '@vitest/browser/context'\nimport type {\n\tHasImageSnapshotCommand,\n\tImageSnapshotNextIndexCommand,\n\tMatchImageSnapshotCommand,\n\tSetupVisSuiteCommand,\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\tImageSnapshotNextIndexCommand,\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 (\n\t\t\t(browserContext?.commands as any)?.[prop] ??\n\t\t\t/* v8 ignore start : used in storybook, not in vitest */\n\t\t\t(() => {\n\t\t\t\tthrow new Error(`Command '${String(prop)}' not found`)\n\t\t\t})()\n\t\t\t/* v8 ignore end */\n\t\t)\n\t},\n})\n\nexport const getCurrentTest = () => vitestSuite?.getCurrentTest()\n","import type { AsyncExpectationResult } from '@vitest/expect'\nimport {\n\ttype ToMatchImageSnapshotOptions,\n\tmatchImageSnapshot,\n\tparseImageSnapshotSubject,\n\tsuccess,\n\ttoTaskId,\n} from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport interface ImageSnapshotMatcher {\n\ttoMatchImageSnapshot(options?: ToMatchImageSnapshotOptions | undefined): Promise<void>\n}\n\nexport function toMatchImageSnapshot(\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 | 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 matchImageSnapshot(test, subject, options).then(() => success)\n}\n","import { expect } from '@storybook/test'\nimport './augment.ts'\nimport { toMatchImageSnapshot } from '../expect/to_match_image_snapshot.ts'\n\nexpect.extend({ toMatchImageSnapshot })\n","import type { ProjectAnnotations, Renderer, StoryContext } from 'storybook/internal/types'\nimport { setAutoSnapshotOptions } from 'vitest-plugin-vis'\nimport { getCurrentTest } from '../client/vitest_proxy.ts'\n\nexport const visAnnotations = {\n\tbeforeEach(ctx: StoryContext) {\n\t\tconst tags = ctx.tags\n\t\tconst enable = !tags ? false : tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')\n\t\tconst test = getCurrentTest()\n\t\tsetAutoSnapshotOptions(test, { enable, ...ctx.parameters?.snapshot })\n\t},\n} satisfies ProjectAnnotations<Renderer>\n","import './client/storybook/expect_extend.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,CClCzD,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,CChBAC,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 { type ToMatchImageSnapshotOptions, imageSnapshotMatcher, success } from 'vitest-plugin-vis/client'\nimport { commands, getCurrentTest } from '../vitest_proxy.ts'\n\nexport function toMatchImageSnapshot(\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 | 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 { ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client'\n\n/**\n * Define snapshot parameter for auto snapshot.\n */\nexport function defineAutoSnapshotParam(snapshot: ToMatchImageSnapshotOptions) {\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/dist/vitest-setup.js

@@ -1,4 +1,4 @@
-import { commands } from './chunk-GZMKOHHR.js';
+import { commands } from './chunk-Q6DPWZ7S.js';
 import { createVis } from 'vitest-plugin-vis/setup';
 
 var vis = createVis(commands);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "storybook-addon-vis",
-  "version": "0.16.0",
+  "version": "0.16.2",
   "description": "Storybook Vitest visual testing addon",
   "keywords": [
     "image-snapshot",
@@ -29,6 +29,10 @@
       "import": "./dist/index.js",
       "require": "./dist/index.cjs"
     },
+    "./matcher": {
+      "types": "./dist/matcher.d.ts",
+      "import": "./dist/matcher.js"
+    },
     "./preset": "./dist/preset.cjs",
     "./preview": {
       "types": "./dist/preview.d.ts",
@@ -53,7 +57,7 @@
   ],
   "dependencies": {
     "type-plus": "^8.0.0-beta.6",
-    "vitest-plugin-vis": "1.1.0"
+    "vitest-plugin-vis": "1.3.0"
   },
   "devDependencies": {
     "@storybook/addon-essentials": "^8.4.2",
@@ -71,7 +75,9 @@
     "@vitest/browser": "^2.1.8",
     "@vitest/coverage-istanbul": "^2.1.8",
     "@vitest/expect": "^2.1.8",
+    "boxen": "^8.0.1",
     "cross-env": "^7.0.3",
+    "dedent": "^1.5.1",
     "npm-run-all2": "^7.0.2",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
@@ -95,6 +101,7 @@
   "bundler": {
     "exportEntries": [
       "src/index.ts",
+      "src/matcher.ts",
       "src/vitest-setup.ts"
     ],
     "previewEntries": [

package/readme.md

@@ -307,6 +307,24 @@ const config: StorybookConfig = {
 }
 ```
 
+### TypeScript Configuration
+
+The main usage of this addon is to use the `toMatchImageSnapshot` matcher.
+
+Since it is exposed under the `expect` object of `vitest` or `@storybook/test`,
+you typically do not need to import `storybook-addon-vis` directly.
+
+Because of this, TypeScript may not recognize the matcher.
+To address this, you can add the following to your `tsconfig.json`:
+
+```json
+{
+	"compilerOptions": {
+		"types": ["storybook-addon-vis/matcher"]
+	}
+}
+```
+
 ## Usage - automatic snapshot
 
 With the `auto` preset, [`storybook-addon-vis`][storybook-addon-vis] automatically captures image snapshot for stories with `snapshot` tag.

package/src/client/ctx.ts

@@ -0,0 +1,8 @@
+import { getCurrentTest } from './vitest_proxy.ts'
+
+export const ctx = {
+	getCurrentTest,
+	__test__reset() {
+		ctx.getCurrentTest = getCurrentTest
+	},
+}

package/src/client/expect/to_match_image_snapshot.ts

@@ -1,17 +1,7 @@
 import type { AsyncExpectationResult } from '@vitest/expect'
-import {
-	type ToMatchImageSnapshotOptions,
-	matchImageSnapshot,
-	parseImageSnapshotSubject,
-	success,
-	toTaskId,
-} from 'vitest-plugin-vis/client'
+import { type ToMatchImageSnapshotOptions, imageSnapshotMatcher, success } from 'vitest-plugin-vis/client'
 import { commands, getCurrentTest } from '../vitest_proxy.ts'
 
-export interface ImageSnapshotMatcher {
-	toMatchImageSnapshot(options?: ToMatchImageSnapshotOptions | undefined): Promise<void>
-}
-
 export function toMatchImageSnapshot(
 	/**
 	 * The element or locator to take the snapshot of,
@@ -26,5 +16,5 @@ export function toMatchImageSnapshot(
 	if (!test) return Promise.resolve(success)
 	/* v8 ignore end */
 
-	return matchImageSnapshot(test, subject, options).then(() => success)
+	return imageSnapshotMatcher(commands)(test, subject, options).then(() => success)
 }

package/src/client/has_image_snapshot.ts

@@ -1,11 +1,12 @@
 import { type ImageSnapshotIdOptions, toTaskId } from 'vitest-plugin-vis/client'
-import { commands, getCurrentTest } from './vitest_proxy.ts'
+import { ctx } from './ctx.ts'
+import { commands } from './vitest_proxy.ts'
 
 /**
  * Check if the snapshot image exists.
  */
 export function hasImageSnapshot(options?: ImageSnapshotIdOptions | undefined) {
-	const test = getCurrentTest()
+	const test = ctx.getCurrentTest()
 	if (!test) return false
 
 	const taskId = toTaskId(test)

package/src/client/storybook/expect_extend.ts

@@ -1,5 +1,4 @@
 import { expect } from '@storybook/test'
-import './augment.ts'
 import { toMatchImageSnapshot } from '../expect/to_match_image_snapshot.ts'
 
 expect.extend({ toMatchImageSnapshot })

package/src/client/storybook/param.ts

@@ -9,3 +9,6 @@ export function defineAutoSnapshotParam(snapshot: ToMatchImageSnapshotOptions) {
 
 // This fix the inferred type cannot be named error
 export type { ToMatchImageSnapshotOptions }
+export function isSnapshotEnabled(tags: string[]) {
+	return tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')
+}

package/src/client/vitest_proxy.ts

@@ -3,14 +3,18 @@ import type {
 	HasImageSnapshotCommand,
 	ImageSnapshotNextIndexCommand,
 	MatchImageSnapshotCommand,
+	PrepareImageSnapshotComparisonCommand,
 	SetupVisSuiteCommand,
+	WriteImageSnapshotCommand,
 } from 'vitest-plugin-vis/commands'
 
 declare module '@vitest/browser/context' {
 	interface BrowserCommands
 		extends MatchImageSnapshotCommand,
 			HasImageSnapshotCommand,
+			PrepareImageSnapshotComparisonCommand,
 			ImageSnapshotNextIndexCommand,
+			WriteImageSnapshotCommand,
 			SetupVisSuiteCommand {}
 }
 
@@ -28,14 +32,7 @@ if ((globalThis as any).__vitest_browser__) {
 
 export const commands = new Proxy<BrowserCommands>({} as any, {
 	get(_target, prop) {
-		return (
-			(browserContext?.commands as any)?.[prop] ??
-			/* v8 ignore start : used in storybook, not in vitest */
-			(() => {
-				throw new Error(`Command '${String(prop)}' not found`)
-			})()
-			/* v8 ignore end */
-		)
+		return (browserContext?.commands as any)?.[prop]
 	},
 })
 

package/src/index.ts

@@ -1,4 +1,7 @@
 // `storybook-addon-vis` provides code that can be used in test files.
+import './client/storybook/expect_extend.ts'
+import './shared/global_matcher_augment.ts'
+
 export * from 'vitest-plugin-vis'
 export * from './client/storybook/param.ts'
 export * from './client/has_image_snapshot.ts'

package/src/matcher.ts

@@ -0,0 +1 @@
+import './shared/global_matcher_augment.ts'

package/src/preview/vis_annotation.ts

@@ -1,12 +1,10 @@
 import type { ProjectAnnotations, Renderer, StoryContext } from 'storybook/internal/types'
 import { setAutoSnapshotOptions } from 'vitest-plugin-vis'
+import { isSnapshotEnabled } from '../client/storybook/param.ts'
 import { getCurrentTest } from '../client/vitest_proxy.ts'
 
 export const visAnnotations = {
 	beforeEach(ctx: StoryContext) {
-		const tags = ctx.tags
-		const enable = !tags ? false : tags.lastIndexOf('!snapshot') < tags.lastIndexOf('snapshot')
-		const test = getCurrentTest()
-		setAutoSnapshotOptions(test, { enable, ...ctx.parameters?.snapshot })
+		setAutoSnapshotOptions(getCurrentTest(), { enable: isSnapshotEnabled(ctx.tags), ...ctx.parameters?.snapshot })
 	},
 } satisfies ProjectAnnotations<Renderer>

package/src/preview.ts

@@ -1,4 +1,5 @@
 import './client/storybook/expect_extend.ts'
+import './shared/global_matcher_augment.ts'
 import { visAnnotations } from './preview/vis_annotation.ts'
 
 export default visAnnotations

package/src/{client/storybook/augment.ts → shared/global_matcher_augment.ts}

@@ -1,6 +1,6 @@
 ///  <reference types="@vitest/browser/context" />
 
-import type { ImageSnapshotMatcher } from '../expect/to_match_image_snapshot.ts'
+import type { ImageSnapshotMatcher } from 'vitest-plugin-vis/client'
 
 declare global {
 	namespace jest {

package/dist/chunk-GZMKOHHR.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../src/client/vitest_proxy.ts"],"names":[],"mappings":";AAgBA,IAAI,cAAA;AACJ,IAAI,WAAA;AAEJ,IAAK,WAAmB,kBAAoB,EAAA;AAC3C,EAAA,OAAO,yBAAyB,CAAA,CAAE,IAAK,CAAA,CAAC,CAAM,KAAA;AAC7C,IAAiB,cAAA,GAAA,CAAA;AAAA,GACjB,CAAA;AACD,EAAA,OAAO,cAAc,CAAA,CAAE,IAAK,CAAA,CAAC,CAAM,KAAA;AAClC,IAAc,WAAA,GAAA,CAAA;AAAA,GACd,CAAA;AACF;AAEO,IAAM,QAAW,GAAA,IAAI,KAAuB,CAAA,EAAW,EAAA;AAAA,EAC7D,GAAA,CAAI,SAAS,IAAM,EAAA;AAClB,IACE,OAAA,cAAA,EAAgB,WAAmB,IAAI,CAAA;AAAA,IAAA,CAEvC,MAAM;AACN,MAAA,MAAM,IAAI,KAAM,CAAA,CAAA,SAAA,EAAY,MAAO,CAAA,IAAI,CAAC,CAAa,WAAA,CAAA,CAAA;AAAA,KACnD,GAAA;AAAA;AAIN,CAAC;AAEY,IAAA,cAAA,GAAiB,MAAM,WAAA,EAAa,cAAe","file":"chunk-GZMKOHHR.js","sourcesContent":["import type { BrowserCommands } from '@vitest/browser/context'\nimport type {\n\tHasImageSnapshotCommand,\n\tImageSnapshotNextIndexCommand,\n\tMatchImageSnapshotCommand,\n\tSetupVisSuiteCommand,\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\tImageSnapshotNextIndexCommand,\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 (\n\t\t\t(browserContext?.commands as any)?.[prop] ??\n\t\t\t/* v8 ignore start : used in storybook, not in vitest */\n\t\t\t(() => {\n\t\t\t\tthrow new Error(`Command '${String(prop)}' not found`)\n\t\t\t})()\n\t\t\t/* v8 ignore end */\n\t\t)\n\t},\n})\n\nexport const getCurrentTest = () => vitestSuite?.getCurrentTest()\n"]}

package/dist/preview.d.ts

@@ -1,26 +0,0 @@
-import { ToMatchImageSnapshotOptions } from 'vitest-plugin-vis/client';
-import { StoryContext } from 'storybook/internal/types';
-
-declare global {
-    namespace jest {
-        interface Matchers<R, T = {}> {
-        }
-    }
-}
-
-interface ImageSnapshotMatcher {
-    toMatchImageSnapshot(options?: ToMatchImageSnapshotOptions | undefined): Promise<void>;
-}
-
-declare global {
-    namespace jest {
-        interface Matchers<R, T> extends ImageSnapshotMatcher {
-        }
-    }
-}
-
-declare const visAnnotations: {
-    beforeEach(ctx: StoryContext): void;
-};
-
-export { visAnnotations as default };

package/src/vitest-setup/expect_extend.ts

@@ -1,5 +0,0 @@
-import { expect } from 'vitest'
-import '../client/storybook/augment.ts'
-import { toMatchImageSnapshot } from '../client/expect/to_match_image_snapshot.ts'
-
-expect.extend({ toMatchImageSnapshot })