@storybook/addon-vitest 0.0.0-pr-32717-sha-be0e21bb → 0.0.0-pr-32810-sha-caef1f25

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -1,29 +1,33 @@
1
- import CJS_COMPAT_NODE_URL_xzhl7pzrhxc from 'node:url';
2
- import CJS_COMPAT_NODE_PATH_xzhl7pzrhxc from 'node:path';
3
- import CJS_COMPAT_NODE_MODULE_xzhl7pzrhxc from "node:module";
1
+ import CJS_COMPAT_NODE_URL_57gzw34qga from 'node:url';
2
+ import CJS_COMPAT_NODE_PATH_57gzw34qga from 'node:path';
3
+ import CJS_COMPAT_NODE_MODULE_57gzw34qga from "node:module";
4
4
 
5
- var __filename = CJS_COMPAT_NODE_URL_xzhl7pzrhxc.fileURLToPath(import.meta.url);
6
- var __dirname = CJS_COMPAT_NODE_PATH_xzhl7pzrhxc.dirname(__filename);
7
- var require = CJS_COMPAT_NODE_MODULE_xzhl7pzrhxc.createRequire(import.meta.url);
5
+ var __filename = CJS_COMPAT_NODE_URL_57gzw34qga.fileURLToPath(import.meta.url);
6
+ var __dirname = CJS_COMPAT_NODE_PATH_57gzw34qga.dirname(__filename);
7
+ var require = CJS_COMPAT_NODE_MODULE_57gzw34qga.createRequire(import.meta.url);
8
8
 
9
9
  // ------------------------------------------------------------
10
10
  // end of CJS compatibility banner, injected by Storybook's esbuild configuration
11
11
  // ------------------------------------------------------------
12
12
  import {
13
+ execa,
13
14
  resolvePackageDir
14
- } from "./_node-chunks/chunk-TXAYOS7Q.js";
15
+ } from "./_node-chunks/chunk-HDSNR4VB.js";
15
16
  import {
16
- any
17
- } from "./_node-chunks/chunk-LRZSVFFB.js";
17
+ any,
18
+ getAddonNames,
19
+ up
20
+ } from "./_node-chunks/chunk-MJXV2NGP.js";
18
21
  import {
19
- DOCUMENTATION_LINK
20
- } from "./_node-chunks/chunk-EM5CDNWG.js";
22
+ DOCUMENTATION_LINK,
23
+ SUPPORTED_FRAMEWORKS
24
+ } from "./_node-chunks/chunk-4GLCSNKX.js";
21
25
  import {
22
26
  dirname,
23
27
  join,
24
28
  relative,
25
29
  resolve
26
- } from "./_node-chunks/chunk-THU64LL5.js";
30
+ } from "./_node-chunks/chunk-Z3QY3AFY.js";
27
31
  import {
28
32
  require_compare,
29
33
  require_constants,
@@ -33,12 +37,12 @@ import {
33
37
  require_parse_options,
34
38
  require_re,
35
39
  require_semver
36
- } from "./_node-chunks/chunk-D3P7SNRB.js";
40
+ } from "./_node-chunks/chunk-RBECRXIT.js";
37
41
  import {
38
42
  __commonJS,
39
43
  __name,
40
44
  __toESM
41
- } from "./_node-chunks/chunk-NDZSUWTL.js";
45
+ } from "./_node-chunks/chunk-VGW4UK4K.js";
42
46
 
43
47
  // ../../node_modules/semver/functions/parse.js
44
48
  var require_parse = __commonJS({
@@ -360,7 +364,7 @@ var require_coerce = __commonJS({
360
364
  var SemVer = require_semver();
361
365
  var parse = require_parse();
362
366
  var { safeRe: re, t } = require_re();
363
- var coerce = /* @__PURE__ */ __name((version, options) => {
367
+ var coerce2 = /* @__PURE__ */ __name((version, options) => {
364
368
  if (version instanceof SemVer) {
365
369
  return version;
366
370
  }
@@ -395,7 +399,7 @@ var require_coerce = __commonJS({
395
399
  const build = options.includePrerelease && match[6] ? `+${match[6]}` : "";
396
400
  return parse(`${major}.${minor}.${patch}${prerelease}${build}`, options);
397
401
  }, "coerce");
398
- module.exports = coerce;
402
+ module.exports = coerce2;
399
403
  }
400
404
  });
401
405
 
@@ -968,7 +972,7 @@ var require_max_satisfying = __commonJS({
968
972
  "use strict";
969
973
  var SemVer = require_semver();
970
974
  var Range = require_range();
971
- var maxSatisfying = /* @__PURE__ */ __name((versions2, range, options) => {
975
+ var maxSatisfying = /* @__PURE__ */ __name((versions, range, options) => {
972
976
  let max = null;
973
977
  let maxSV = null;
974
978
  let rangeObj = null;
@@ -977,7 +981,7 @@ var require_max_satisfying = __commonJS({
977
981
  } catch (er) {
978
982
  return null;
979
983
  }
980
- versions2.forEach((v) => {
984
+ versions.forEach((v) => {
981
985
  if (rangeObj.test(v)) {
982
986
  if (!max || maxSV.compare(v) === -1) {
983
987
  max = v;
@@ -997,7 +1001,7 @@ var require_min_satisfying = __commonJS({
997
1001
  "use strict";
998
1002
  var SemVer = require_semver();
999
1003
  var Range = require_range();
1000
- var minSatisfying = /* @__PURE__ */ __name((versions2, range, options) => {
1004
+ var minSatisfying = /* @__PURE__ */ __name((versions, range, options) => {
1001
1005
  let min = null;
1002
1006
  let minSV = null;
1003
1007
  let rangeObj = null;
@@ -1006,7 +1010,7 @@ var require_min_satisfying = __commonJS({
1006
1010
  } catch (er) {
1007
1011
  return null;
1008
1012
  }
1009
- versions2.forEach((v) => {
1013
+ versions.forEach((v) => {
1010
1014
  if (rangeObj.test(v)) {
1011
1015
  if (!min || minSV.compare(v) === 1) {
1012
1016
  min = v;
@@ -1204,11 +1208,11 @@ var require_simplify = __commonJS({
1204
1208
  "use strict";
1205
1209
  var satisfies2 = require_satisfies();
1206
1210
  var compare = require_compare();
1207
- module.exports = (versions2, range, options) => {
1211
+ module.exports = (versions, range, options) => {
1208
1212
  const set = [];
1209
1213
  let first = null;
1210
1214
  let prev = null;
1211
- const v = versions2.sort((a, b) => compare(a, b, options));
1215
+ const v = versions.sort((a, b) => compare(a, b, options));
1212
1216
  for (const version of v) {
1213
1217
  const included = satisfies2(version, range, options);
1214
1218
  if (included) {
@@ -1440,7 +1444,7 @@ var require_semver2 = __commonJS({
1440
1444
  var gte = require_gte();
1441
1445
  var lte = require_lte();
1442
1446
  var cmp = require_cmp();
1443
- var coerce = require_coerce();
1447
+ var coerce2 = require_coerce();
1444
1448
  var Comparator = require_comparator();
1445
1449
  var Range = require_range();
1446
1450
  var satisfies2 = require_satisfies();
@@ -1478,7 +1482,7 @@ var require_semver2 = __commonJS({
1478
1482
  gte,
1479
1483
  lte,
1480
1484
  cmp,
1481
- coerce,
1485
+ coerce: coerce2,
1482
1486
  Comparator,
1483
1487
  Range,
1484
1488
  satisfies: satisfies2,
@@ -1509,24 +1513,56 @@ var require_semver2 = __commonJS({
1509
1513
  import { existsSync } from "node:fs";
1510
1514
  import * as fs2 from "node:fs/promises";
1511
1515
  import { writeFile } from "node:fs/promises";
1512
- import { babelParse, generate } from "storybook/internal/babel";
1513
- import { AddonVitestService } from "storybook/internal/cli";
1516
+ import { isAbsolute, posix, sep } from "node:path";
1517
+ import { fileURLToPath, pathToFileURL } from "node:url";
1518
+ import { babelParse, generate, traverse } from "storybook/internal/babel";
1514
1519
  import {
1515
1520
  JsPackageManagerFactory,
1516
1521
  formatFileContent,
1522
+ getInterpretedFile,
1517
1523
  getProjectRoot,
1518
- getStorybookInfo,
1519
- versions
1524
+ isCI as isCI2,
1525
+ loadMainConfig,
1526
+ scanAndTransformFiles,
1527
+ transformImportFiles
1520
1528
  } from "storybook/internal/common";
1521
- import { CLI_COLORS } from "storybook/internal/node-logger";
1522
- import {
1523
- AddonVitestPostinstallError,
1524
- AddonVitestPostinstallPrerequisiteCheckError
1525
- } from "storybook/internal/server-errors";
1526
- import { SupportedFramework } from "storybook/internal/types";
1529
+ import { experimental_loadStorybook } from "storybook/internal/core-server";
1530
+ import { readConfig, writeConfig } from "storybook/internal/csf-tools";
1531
+ import { logger as logger2 } from "storybook/internal/node-logger";
1532
+
1533
+ // ../../node_modules/empathic/package.mjs
1534
+ function up2(options) {
1535
+ return up("package.json", options);
1536
+ }
1537
+ __name(up2, "up");
1538
+
1539
+ // src/postinstall.ts
1527
1540
  var import_semver = __toESM(require_semver2(), 1);
1541
+ import prompts from "prompts";
1528
1542
  import { dedent } from "ts-dedent";
1529
1543
 
1544
+ // src/postinstall-logger.ts
1545
+ import { isCI } from "storybook/internal/common";
1546
+ import { colors, logger } from "storybook/internal/node-logger";
1547
+ var fancy = process.platform !== "win32" || isCI() || process.env.TERM === "xterm-256color";
1548
+ var step = colors.gray("\u203A");
1549
+ var info = colors.blue(fancy ? "\u2139" : "i");
1550
+ var success = colors.green(fancy ? "\u2714" : "\u221A");
1551
+ var warning = colors.orange(fancy ? "\u26A0" : "\u203C");
1552
+ var error = colors.red(fancy ? "\u2716" : "\xD7");
1553
+ var baseOptions = {
1554
+ borderStyle: "round",
1555
+ padding: 1
1556
+ };
1557
+ var print = /* @__PURE__ */ __name((message, options) => {
1558
+ logger.line(1);
1559
+ logger.logBox(message, { ...baseOptions, ...options });
1560
+ }, "print");
1561
+ var printInfo = /* @__PURE__ */ __name((title, message, options) => print(message, { borderColor: "blue", title, ...options }), "printInfo");
1562
+ var printWarning = /* @__PURE__ */ __name((title, message, options) => print(message, { borderColor: "yellow", title, ...options }), "printWarning");
1563
+ var printError = /* @__PURE__ */ __name((title, message, options) => print(message, { borderColor: "red", title, ...options }), "printError");
1564
+ var printSuccess = /* @__PURE__ */ __name((title, message, options) => print(message, { borderColor: "green", title, ...options }), "printSuccess");
1565
+
1530
1566
  // src/updateVitestFile.ts
1531
1567
  import * as fs from "node:fs/promises";
1532
1568
  var loadTemplate = /* @__PURE__ */ __name(async (name, replacements) => {
@@ -1735,133 +1771,274 @@ var updateWorkspaceFile = /* @__PURE__ */ __name((source, target) => {
1735
1771
  var ADDON_NAME = "@storybook/addon-vitest";
1736
1772
  var EXTENSIONS = [".ts", ".tsx", ".js", ".jsx", ".cts", ".mts", ".cjs", ".mjs"];
1737
1773
  var addonA11yName = "@storybook/addon-a11y";
1774
+ var hasErrors = false;
1775
+ function nameMatches(name, pattern) {
1776
+ if (name === pattern) {
1777
+ return true;
1778
+ }
1779
+ if (name.includes(`${pattern}${sep}`)) {
1780
+ return true;
1781
+ }
1782
+ if (name.includes(`${pattern}${posix.sep}`)) {
1783
+ return true;
1784
+ }
1785
+ return false;
1786
+ }
1787
+ __name(nameMatches, "nameMatches");
1788
+ var logErrors = /* @__PURE__ */ __name((...args) => {
1789
+ hasErrors = true;
1790
+ printError(...args);
1791
+ }, "logErrors");
1792
+ var findFile = /* @__PURE__ */ __name((basename, extensions = EXTENSIONS) => any(
1793
+ extensions.map((ext) => basename + ext),
1794
+ { last: getProjectRoot() }
1795
+ ), "findFile");
1738
1796
  async function postInstall(options) {
1739
- const errors = [];
1740
- const { logger, prompt } = options;
1797
+ printSuccess(
1798
+ "\u{1F44B} Howdy!",
1799
+ dedent`
1800
+ I'm the installation helper for ${ADDON_NAME}
1801
+
1802
+ Hold on for a moment while I look at your project and get it set up...
1803
+ `
1804
+ );
1741
1805
  const packageManager = JsPackageManagerFactory.getPackageManager({
1742
1806
  force: options.packageManager
1743
1807
  });
1744
- const findFile = /* @__PURE__ */ __name((basename, extensions = EXTENSIONS) => any(
1745
- extensions.map((ext) => basename + ext),
1746
- { last: getProjectRoot(), cwd: options.configDir }
1747
- ), "findFile");
1748
1808
  const vitestVersionSpecifier = await packageManager.getInstalledVersion("vitest");
1809
+ const coercedVitestVersion = vitestVersionSpecifier ? (0, import_semver.coerce)(vitestVersionSpecifier) : null;
1749
1810
  const isVitest3_2To4 = vitestVersionSpecifier ? (0, import_semver.satisfies)(vitestVersionSpecifier, ">=3.2.0 <4.0.0") : false;
1750
1811
  const isVitest4OrNewer = vitestVersionSpecifier ? (0, import_semver.satisfies)(vitestVersionSpecifier, ">=4.0.0") : true;
1751
- const info = await getStorybookInfo(options.configDir);
1812
+ const info2 = await getStorybookInfo(options);
1752
1813
  const allDeps = packageManager.getAllDependencies();
1753
- const addonVitestService = new AddonVitestService();
1754
- const compatibilityResult = await addonVitestService.validateCompatibility({
1755
- packageManager,
1756
- framework: info.framework,
1757
- builder: info.builder
1758
- });
1759
- let result = null;
1760
- if (!compatibilityResult.compatible && compatibilityResult.reasons) {
1761
- const reasons = compatibilityResult.reasons.map((r) => `\u2022 ${CLI_COLORS.error(r)}`);
1762
- reasons.unshift(dedent`
1763
- Automated setup failed
1764
- We have found incompatibilities due to the following package incompatibilities:
1765
- `);
1766
- reasons.push(
1767
- dedent`
1768
- You can fix these issues and rerun the command to reinstall. If you wish to roll back the installation, remove ${ADDON_NAME} from the "addons" array
1769
- in your main Storybook config file and remove the dependency from your package.json file.
1814
+ const dependencies = [
1815
+ "vitest",
1816
+ "playwright",
1817
+ isVitest4OrNewer ? "@vitest/browser-playwright" : "@vitest/browser"
1818
+ ];
1819
+ const uniqueDependencies = dependencies.filter((p) => !allDeps[p]);
1820
+ const mainJsPath = getInterpretedFile(resolve(options.configDir, "main"));
1821
+ const config = await readConfig(mainJsPath);
1822
+ const hasCustomWebpackConfig = !!config.getFieldNode(["webpackFinal"]);
1823
+ const isInteractive = process.stdout.isTTY && !isCI2();
1824
+ if (nameMatches(info2.frameworkPackageName, "@storybook/nextjs") && !hasCustomWebpackConfig) {
1825
+ const out = options.yes || !isInteractive ? { migrateToNextjsVite: !!options.yes } : await prompts({
1826
+ type: "confirm",
1827
+ name: "migrateToNextjsVite",
1828
+ message: dedent`
1829
+ The addon requires the use of @storybook/nextjs-vite to work with Next.js.
1830
+ https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#install-and-set-up
1770
1831
 
1771
- Please check the documentation for more information about its requirements and installation:
1772
- https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}
1773
- `
1774
- );
1775
- result = reasons.map((r) => r.trim()).join("\n\n");
1776
- }
1777
- if (result) {
1778
- logger.error(result);
1779
- throw new AddonVitestPostinstallPrerequisiteCheckError({
1780
- reasons: compatibilityResult.reasons
1832
+ Do you want to migrate?
1833
+ `,
1834
+ initial: true
1781
1835
  });
1836
+ if (out.migrateToNextjsVite) {
1837
+ await packageManager.addDependencies({ type: "devDependencies", skipInstall: true }, [
1838
+ "@storybook/nextjs-vite"
1839
+ ]);
1840
+ await packageManager.removeDependencies(["@storybook/nextjs"]);
1841
+ traverse(config._ast, {
1842
+ StringLiteral(path) {
1843
+ if (path.node.value === "@storybook/nextjs") {
1844
+ path.node.value = "@storybook/nextjs-vite";
1845
+ }
1846
+ }
1847
+ });
1848
+ await writeConfig(config, mainJsPath);
1849
+ info2.frameworkPackageName = "@storybook/nextjs-vite";
1850
+ info2.builderPackageName = "@storybook/builder-vite";
1851
+ await scanAndTransformFiles({
1852
+ promptMessage: "Enter a glob to scan for all @storybook/nextjs imports to substitute with @storybook/nextjs-vite:",
1853
+ force: options.yes,
1854
+ dryRun: false,
1855
+ transformFn: /* @__PURE__ */ __name((files, options2, dryRun) => transformImportFiles(files, options2, dryRun), "transformFn"),
1856
+ transformOptions: {
1857
+ "@storybook/nextjs": "@storybook/nextjs-vite"
1858
+ }
1859
+ });
1860
+ }
1782
1861
  }
1783
- if (!options.skipDependencyManagement) {
1784
- const versionedDependencies = await addonVitestService.collectDependencies(packageManager);
1785
- if (info.framework === SupportedFramework.NEXTJS) {
1786
- const allDeps2 = packageManager.getAllDependencies();
1787
- if (!allDeps2["@storybook/nextjs-vite"]) {
1862
+ const annotationsImport = SUPPORTED_FRAMEWORKS.find(
1863
+ (f) => nameMatches(info2.frameworkPackageName, f)
1864
+ ) ? info2.frameworkPackageName === "@storybook/nextjs" ? "@storybook/nextjs-vite" : info2.frameworkPackageName : null;
1865
+ const isRendererSupported = !!annotationsImport;
1866
+ const prerequisiteCheck = /* @__PURE__ */ __name(async () => {
1867
+ const reasons = [];
1868
+ if (hasCustomWebpackConfig) {
1869
+ reasons.push("\u2022 The addon can not be used with a custom Webpack configuration.");
1870
+ }
1871
+ if (!nameMatches(info2.frameworkPackageName, "@storybook/nextjs") && !nameMatches(info2.builderPackageName, "@storybook/builder-vite")) {
1872
+ reasons.push(
1873
+ "\u2022 The addon can only be used with a Vite-based Storybook framework or Next.js."
1874
+ );
1875
+ }
1876
+ if (!isRendererSupported) {
1877
+ reasons.push(dedent`
1878
+ • The addon cannot yet be used with ${info2.frameworkPackageName}
1879
+ `);
1880
+ }
1881
+ if (coercedVitestVersion && !(0, import_semver.satisfies)(coercedVitestVersion, ">=3.0.0")) {
1882
+ reasons.push(dedent`
1883
+ • The addon requires Vitest 3.0.0 or higher. You are currently using ${vitestVersionSpecifier}.
1884
+ Please update all of your Vitest dependencies and try again.
1885
+ `);
1886
+ }
1887
+ const mswVersionSpecifier = await packageManager.getInstalledVersion("msw");
1888
+ const coercedMswVersion = mswVersionSpecifier ? (0, import_semver.coerce)(mswVersionSpecifier) : null;
1889
+ if (coercedMswVersion && !(0, import_semver.satisfies)(coercedMswVersion, ">=2.0.0")) {
1890
+ reasons.push(dedent`
1891
+ • The addon uses Vitest behind the scenes, which supports only version 2 and above of MSW. However, we have detected version ${coercedMswVersion.version} in this project.
1892
+ Please update the 'msw' package and try again.
1893
+ `);
1894
+ }
1895
+ if (nameMatches(info2.frameworkPackageName, "@storybook/nextjs")) {
1896
+ const nextVersion = await packageManager.getInstalledVersion("next");
1897
+ if (!nextVersion) {
1898
+ reasons.push(dedent`
1899
+ • You are using @storybook/nextjs without having "next" installed.
1900
+ Please install "next" or use a different Storybook framework integration and try again.
1901
+ `);
1788
1902
  }
1789
1903
  }
1790
- const v8Version = await packageManager.getInstalledVersion("@vitest/coverage-v8");
1791
- const istanbulVersion = await packageManager.getInstalledVersion("@vitest/coverage-istanbul");
1792
- if (!v8Version && !istanbulVersion) {
1793
- logger.step(
1904
+ if (reasons.length > 0) {
1905
+ reasons.unshift(
1906
+ `@storybook/addon-vitest's automated setup failed due to the following package incompatibilities:`
1907
+ );
1908
+ reasons.push("--------------------------------");
1909
+ reasons.push(
1794
1910
  dedent`
1795
- You don't seem to have a coverage reporter installed. Vitest needs either V8 or Istanbul to generate coverage reports.
1796
-
1797
- Adding "@vitest/coverage-v8" to enable coverage reporting.
1798
- Read more about Vitest coverage providers at https://vitest.dev/guide/coverage.html#coverage-providers
1911
+ You can fix these issues and rerun the command to reinstall. If you wish to roll back the installation, remove ${ADDON_NAME} from the "addons" array
1912
+ in your main Storybook config file and remove the dependency from your package.json file.
1799
1913
  `
1800
1914
  );
1915
+ if (!isRendererSupported) {
1916
+ reasons.push(
1917
+ dedent`
1918
+ Please check the documentation for more information about its requirements and installation:
1919
+ https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}
1920
+ `
1921
+ );
1922
+ } else {
1923
+ reasons.push(
1924
+ dedent`
1925
+ Fear not, however, you can follow the manual installation process instead at:
1926
+ https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
1927
+ `
1928
+ );
1929
+ }
1930
+ return reasons.map((r) => r.trim()).join("\n\n");
1801
1931
  }
1802
- if (versionedDependencies.length > 0) {
1803
- logger.step("Adding dependencies to your package.json");
1804
- logger.log(" " + versionedDependencies.join(", "));
1805
- await packageManager.addDependencies(
1806
- { type: "devDependencies", skipInstall: true },
1807
- versionedDependencies
1808
- );
1932
+ return null;
1933
+ }, "prerequisiteCheck");
1934
+ const result = await prerequisiteCheck();
1935
+ if (result) {
1936
+ logErrors("\u26D4\uFE0F Sorry!", result);
1937
+ logger2.line(1);
1938
+ return;
1939
+ }
1940
+ if (info2.frameworkPackageName === "@storybook/nextjs") {
1941
+ printInfo(
1942
+ "\u{1F37F} Just so you know...",
1943
+ dedent`
1944
+ It looks like you're using Next.js.
1945
+
1946
+ Adding "@storybook/nextjs-vite/vite-plugin" so you can use it with Vitest.
1947
+
1948
+ More info about the plugin at https://github.com/storybookjs/vite-plugin-storybook-nextjs
1949
+ `
1950
+ );
1951
+ try {
1952
+ const storybookVersion = await packageManager.getInstalledVersion("storybook");
1953
+ uniqueDependencies.push(`@storybook/nextjs-vite@^${storybookVersion}`);
1954
+ } catch (e) {
1955
+ console.error("Failed to install @storybook/nextjs-vite. Please install it manually");
1809
1956
  }
1810
- if (!options.skipInstall) {
1811
- await packageManager.installDependencies();
1957
+ }
1958
+ const v8Version = await packageManager.getInstalledVersion("@vitest/coverage-v8");
1959
+ const istanbulVersion = await packageManager.getInstalledVersion("@vitest/coverage-istanbul");
1960
+ if (!v8Version && !istanbulVersion) {
1961
+ printInfo(
1962
+ "\u{1F648} Let me cover this for you",
1963
+ dedent`
1964
+ You don't seem to have a coverage reporter installed. Vitest needs either V8 or Istanbul to generate coverage reports.
1965
+
1966
+ Adding "@vitest/coverage-v8" to enable coverage reporting.
1967
+ Read more about Vitest coverage providers at https://vitest.dev/guide/coverage.html#coverage-providers
1968
+ `
1969
+ );
1970
+ uniqueDependencies.push(`@vitest/coverage-v8`);
1971
+ }
1972
+ const versionedDependencies = uniqueDependencies.map((p) => {
1973
+ if (p.includes("vitest")) {
1974
+ return vitestVersionSpecifier ? `${p}@${vitestVersionSpecifier}` : p;
1812
1975
  }
1976
+ return p;
1977
+ });
1978
+ if (versionedDependencies.length > 0) {
1979
+ await packageManager.addDependencies(
1980
+ { type: "devDependencies", skipInstall: true },
1981
+ versionedDependencies
1982
+ );
1983
+ logger2.line(1);
1984
+ logger2.plain(`${step} Installing dependencies:`);
1985
+ logger2.plain(" " + versionedDependencies.join(", "));
1813
1986
  }
1814
- if (!options.skipDependencyManagement) {
1815
- if (!options.skipInstall) {
1816
- const playwrightErrors = await addonVitestService.installPlaywright(packageManager, {
1817
- yes: options.yes
1987
+ await packageManager.installDependencies();
1988
+ logger2.line(1);
1989
+ if (options.skipInstall) {
1990
+ logger2.plain("Skipping Playwright installation, please run this command manually:");
1991
+ logger2.plain(" npx playwright install chromium --with-deps");
1992
+ } else {
1993
+ logger2.plain(`${step} Configuring Playwright with Chromium (this might take some time):`);
1994
+ logger2.plain(" npx playwright install chromium --with-deps");
1995
+ try {
1996
+ await packageManager.executeCommand({
1997
+ command: "npx",
1998
+ args: ["playwright", "install", "chromium", "--with-deps"]
1818
1999
  });
1819
- errors.push(...playwrightErrors);
1820
- } else {
1821
- logger.warn(dedent`
1822
- Playwright browser binaries installation skipped. Please run the following command manually later:
1823
- ${CLI_COLORS.cta("npx playwright install chromium --with-deps")}
1824
- `);
2000
+ } catch (e) {
2001
+ console.error("Failed to install Playwright. Please install it manually");
1825
2002
  }
1826
2003
  }
1827
2004
  const fileExtension = allDeps.typescript || findFile("tsconfig", [...EXTENSIONS, ".json"]) ? "ts" : "js";
1828
2005
  const vitestSetupFile = resolve(options.configDir, `vitest.setup.${fileExtension}`);
1829
2006
  if (existsSync(vitestSetupFile)) {
1830
- const errorMessage = dedent`
1831
- Found an existing Vitest setup file:
1832
- ${vitestSetupFile}
1833
- Please refer to the documentation to complete the setup manually:
1834
- https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
1835
- `;
1836
- logger.line();
1837
- logger.error(`${errorMessage}
1838
- `);
1839
- errors.push("Found existing Vitest setup file");
1840
- } else {
1841
- logger.step(`Creating a Vitest setup file for Storybook:`);
1842
- logger.log(`${vitestSetupFile}
1843
- `);
1844
- const previewExists = EXTENSIONS.map((ext) => resolve(options.configDir, `preview${ext}`)).some(
1845
- existsSync
1846
- );
1847
- const annotationsImport = info.frameworkPackage;
1848
- const imports = [`import { setProjectAnnotations } from '${annotationsImport}';`];
1849
- const projectAnnotations = [];
1850
- if (previewExists) {
1851
- imports.push(`import * as projectAnnotations from './preview';`);
1852
- projectAnnotations.push("projectAnnotations");
1853
- }
1854
- await writeFile(
1855
- vitestSetupFile,
2007
+ logErrors(
2008
+ "\u{1F6A8} Oh no!",
1856
2009
  dedent`
2010
+ Found an existing Vitest setup file:
2011
+ ${vitestSetupFile}
2012
+
2013
+ Please refer to the documentation to complete the setup manually:
2014
+ https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
2015
+ `
2016
+ );
2017
+ logger2.line(1);
2018
+ return;
2019
+ }
2020
+ logger2.line(1);
2021
+ logger2.plain(`${step} Creating a Vitest setup file for Storybook:`);
2022
+ logger2.plain(` ${vitestSetupFile}`);
2023
+ const previewExists = EXTENSIONS.map((ext) => resolve(options.configDir, `preview${ext}`)).some(
2024
+ existsSync
2025
+ );
2026
+ const imports = [`import { setProjectAnnotations } from '${annotationsImport}';`];
2027
+ const projectAnnotations = [];
2028
+ if (previewExists) {
2029
+ imports.push(`import * as projectAnnotations from './preview';`);
2030
+ projectAnnotations.push("projectAnnotations");
2031
+ }
2032
+ await writeFile(
2033
+ vitestSetupFile,
2034
+ dedent`
1857
2035
  ${imports.join("\n")}
1858
2036
 
1859
2037
  // This is an important step to apply the right configuration when testing your stories.
1860
2038
  // More info at: https://storybook.js.org/docs/api/portable-stories/portable-stories-vitest#setprojectannotations
1861
2039
  setProjectAnnotations([${projectAnnotations.join(", ")}]);
1862
2040
  `
1863
- );
1864
- }
2041
+ );
1865
2042
  const vitestWorkspaceFile = findFile("vitest.workspace", [".ts", ".js", ".json"]);
1866
2043
  const viteConfigFile = findFile("vite.config");
1867
2044
  const vitestConfigFile = findFile("vitest.config");
@@ -1893,12 +2070,14 @@ async function postInstall(options) {
1893
2070
  const target = babelParse(workspaceFile);
1894
2071
  const updated = updateWorkspaceFile(source, target);
1895
2072
  if (updated) {
1896
- logger.step(`Updating your Vitest workspace file...`);
1897
- logger.log(`${vitestWorkspaceFile}`);
2073
+ logger2.line(1);
2074
+ logger2.plain(`${step} Updating your Vitest workspace file:`);
2075
+ logger2.plain(` ${vitestWorkspaceFile}`);
1898
2076
  const formattedContent = await formatFileContent(vitestWorkspaceFile, generate(target).code);
1899
2077
  await writeFile(vitestWorkspaceFile, formattedContent);
1900
2078
  } else {
1901
- logger.error(
2079
+ logErrors(
2080
+ "\u{1F6A8} Oh no!",
1902
2081
  dedent`
1903
2082
  Could not update existing Vitest workspace file:
1904
2083
  ${vitestWorkspaceFile}
@@ -1910,7 +2089,8 @@ async function postInstall(options) {
1910
2089
  https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
1911
2090
  `
1912
2091
  );
1913
- errors.push("Unable to update existing Vitest workspace file");
2092
+ logger2.line(1);
2093
+ return;
1914
2094
  }
1915
2095
  } else if (rootConfig) {
1916
2096
  let target, updated;
@@ -1929,8 +2109,9 @@ async function postInstall(options) {
1929
2109
  updated = updateConfigFile(source, target);
1930
2110
  }
1931
2111
  if (target && updated) {
1932
- logger.step(`Updating your ${vitestConfigFile ? "Vitest" : "Vite"} config file:`);
1933
- logger.log(` ${rootConfig}`);
2112
+ logger2.line(1);
2113
+ logger2.plain(`${step} Updating your ${vitestConfigFile ? "Vitest" : "Vite"} config file:`);
2114
+ logger2.plain(` ${rootConfig}`);
1934
2115
  const formattedContent = await formatFileContent(rootConfig, generate(target).code);
1935
2116
  const shouldAddReference = !configFileHasTypeReference && !vitestConfigFile;
1936
2117
  await writeFile(
@@ -1938,92 +2119,139 @@ async function postInstall(options) {
1938
2119
  shouldAddReference ? '/// <reference types="vitest/config" />\n' + formattedContent : formattedContent
1939
2120
  );
1940
2121
  } else {
1941
- logger.error(dedent`
2122
+ logErrors(
2123
+ "\u{1F6A8} Oh no!",
2124
+ dedent`
1942
2125
  We were unable to update your existing ${vitestConfigFile ? "Vitest" : "Vite"} config file.
1943
2126
 
1944
2127
  Please refer to the documentation to complete the setup manually:
1945
2128
  https://storybook.js.org/docs/writing-tests/integrations/vitest-addon#manual-setup
1946
- `);
1947
- errors.push("Unable to update existing Vitest config file");
2129
+ `
2130
+ );
1948
2131
  }
1949
2132
  } else {
1950
- const parentDir = dirname(options.configDir);
1951
- const newConfigFile = resolve(parentDir, `vitest.config.${fileExtension}`);
2133
+ const newConfigFile = resolve(`vitest.config.${fileExtension}`);
1952
2134
  const configTemplate = await loadTemplate(getTemplateName(), {
1953
2135
  CONFIG_DIR: options.configDir,
1954
2136
  SETUP_FILE: relative(dirname(newConfigFile), vitestSetupFile)
1955
2137
  });
1956
- logger.step(`Creating a Vitest config file:`);
1957
- logger.log(`${newConfigFile}`);
2138
+ logger2.line(1);
2139
+ logger2.plain(`${step} Creating a Vitest config file:`);
2140
+ logger2.plain(` ${newConfigFile}`);
1958
2141
  const formattedContent = await formatFileContent(newConfigFile, configTemplate);
1959
2142
  await writeFile(newConfigFile, formattedContent);
1960
2143
  }
1961
- const a11yAddon = info.addons.find((addon) => addon.includes(addonA11yName));
2144
+ const a11yAddon = info2.addons.find((addon) => addon.includes(addonA11yName));
1962
2145
  if (a11yAddon) {
1963
2146
  try {
1964
- const command = ["automigrate", "addon-a11y-addon-test"];
1965
- command.push("--loglevel", "silent");
1966
- command.push("--yes", "--skip-doctor");
1967
- if (options.packageManager) {
1968
- command.push("--package-manager", options.packageManager);
1969
- }
1970
- if (options.skipInstall) {
1971
- command.push("--skip-install");
1972
- }
1973
- if (options.configDir !== ".storybook") {
1974
- command.push("--config-dir", `"${options.configDir}"`);
1975
- }
1976
- const remoteCommand = packageManager.getRemoteRunCommand(
2147
+ logger2.plain(`${step} Setting up ${addonA11yName} for @storybook/addon-vitest:`);
2148
+ await execa(
1977
2149
  "storybook",
1978
- command,
1979
- versions.storybook
2150
+ [
2151
+ "automigrate",
2152
+ "addon-a11y-addon-test",
2153
+ "--loglevel",
2154
+ "silent",
2155
+ "--yes",
2156
+ "--skip-doctor",
2157
+ ...options.packageManager ? ["--package-manager", options.packageManager] : [],
2158
+ ...options.skipInstall ? ["--skip-install"] : [],
2159
+ ...options.configDir !== ".storybook" ? ["--config-dir", `"${options.configDir}"`] : []
2160
+ ],
2161
+ {
2162
+ stdio: "inherit"
2163
+ }
1980
2164
  );
1981
- const [cmd, ...args] = remoteCommand.split(" ");
1982
- await prompt.executeTask(() => packageManager.executeCommand({ command: cmd, args }), {
1983
- id: "a11y-addon-setup",
1984
- intro: "Setting up a11y addon for @storybook/addon-vitest",
1985
- error: "Failed to setup a11y addon for @storybook/addon-vitest",
1986
- success: "a11y addon setup successfully"
1987
- });
1988
2165
  } catch (e) {
1989
- console.log(e);
1990
- logger.line();
1991
- logger.error(dedent`
1992
- Could not automatically set up ${addonA11yName} for @storybook/addon-vitest.
2166
+ logErrors(
2167
+ "\u{1F6A8} Oh no!",
2168
+ dedent`
2169
+ We have detected that you have ${addonA11yName} installed but could not automatically set it up for @storybook/addon-vitest:
2170
+
2171
+ ${e instanceof Error ? e.message : String(e)}
2172
+
1993
2173
  Please refer to the documentation to complete the setup manually:
1994
2174
  https://storybook.js.org/docs/writing-tests/accessibility-testing#test-addon-integration
1995
- `);
1996
- errors.push(
1997
- "The @storybook/addon-a11y couldn't be set up for the Vitest addon" + (e instanceof Error ? e.stack : String(e))
2175
+ `
1998
2176
  );
1999
2177
  }
2000
2178
  }
2001
2179
  const runCommand = rootConfig ? `npx vitest --project=storybook` : `npx vitest`;
2002
- logger.line();
2003
- if (errors.length === 0) {
2004
- logger.step(CLI_COLORS.success("All done!"));
2005
- logger.log(dedent`
2180
+ if (!hasErrors) {
2181
+ printSuccess(
2182
+ "\u{1F389} All done!",
2183
+ dedent`
2006
2184
  @storybook/addon-vitest is now configured and you're ready to run your tests!
2185
+
2007
2186
  Here are a couple of tips to get you started:
2008
-
2009
- You can run tests with "${CLI_COLORS.cta(runCommand)}"
2010
- • Vitest IDE extension shows all stories as tests in your editor!
2011
-
2187
+ • You can run tests with "${runCommand}"
2188
+ When using the Vitest extension in your editor, all of your stories will be shown as tests!
2189
+
2012
2190
  Check the documentation for more information about its features and options at:
2013
2191
  https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}
2014
- `);
2192
+ `
2193
+ );
2015
2194
  } else {
2016
- logger.warn(
2195
+ printWarning(
2196
+ "\u26A0\uFE0F Done, but with errors!",
2017
2197
  dedent`
2018
- Done, but with errors!
2019
- @storybook/addon-vitest was installed successfully, but there were some errors during the setup process. Please refer to the documentation to complete the setup manually and check the errors above:
2198
+ @storybook/addon-vitest was installed successfully, but there were some errors during the setup process.
2199
+
2200
+ Please refer to the documentation to complete the setup manually and check the errors above:
2020
2201
  https://storybook.js.org/docs/next/${DOCUMENTATION_LINK}#manual-setup
2021
2202
  `
2022
2203
  );
2023
- throw new AddonVitestPostinstallError({ errors });
2024
2204
  }
2205
+ logger2.line(1);
2025
2206
  }
2026
2207
  __name(postInstall, "postInstall");
2208
+ async function getPackageNameFromPath(input) {
2209
+ const path = input.startsWith("file://") ? fileURLToPath(input) : input;
2210
+ if (!isAbsolute(path)) {
2211
+ return path;
2212
+ }
2213
+ const packageJsonPath = up2({ cwd: path });
2214
+ if (!packageJsonPath) {
2215
+ throw new Error(`Could not find package.json in path: ${path}`);
2216
+ }
2217
+ const { default: packageJson } = await import(pathToFileURL(packageJsonPath).href, {
2218
+ with: { type: "json" }
2219
+ });
2220
+ return packageJson.name;
2221
+ }
2222
+ __name(getPackageNameFromPath, "getPackageNameFromPath");
2223
+ async function getStorybookInfo({ configDir, packageManager: pkgMgr }) {
2224
+ const packageManager = JsPackageManagerFactory.getPackageManager({ force: pkgMgr, configDir });
2225
+ const { packageJson } = packageManager.primaryPackageJson;
2226
+ const config = await loadMainConfig({ configDir });
2227
+ const { presets } = await experimental_loadStorybook({
2228
+ configDir,
2229
+ packageJson
2230
+ });
2231
+ const framework = await presets.apply("framework", {});
2232
+ const core = await presets.apply("core", {});
2233
+ const { builder, renderer } = core;
2234
+ if (!builder) {
2235
+ throw new Error("Could not detect your Storybook builder.");
2236
+ }
2237
+ const frameworkPackageName = await getPackageNameFromPath(
2238
+ typeof framework === "string" ? framework : framework.name
2239
+ );
2240
+ const builderPackageName = await getPackageNameFromPath(
2241
+ typeof builder === "string" ? builder : builder.name
2242
+ );
2243
+ let rendererPackageName;
2244
+ if (renderer) {
2245
+ rendererPackageName = await getPackageNameFromPath(renderer);
2246
+ }
2247
+ return {
2248
+ frameworkPackageName,
2249
+ builderPackageName,
2250
+ rendererPackageName,
2251
+ addons: getAddonNames(config)
2252
+ };
2253
+ }
2254
+ __name(getStorybookInfo, "getStorybookInfo");
2027
2255
  export {
2028
2256
  postInstall as default
2029
2257
  };