Merge pull request #364 from storybookjs/fix/use-correct-package-manager

Run nyc with correct packager manager command

.github/ISSUE_TEMPLATE/bug-report-🐞.md

@@ -1,17 +1,17 @@
 ---
 name: "Bug report \U0001F41E"
 about: Create a report to help us improve
-title: "[bug] "
+title: '[bug] '
 labels: bug, needs triage
 assignees: ''
-
 ---
 
 **Describe the bug**
 A clear and concise description of what the bug is.
 
 **To Reproduce**
 Steps to reproduce the behavior:
+
 1. Go to '...'
 2. Click on '....'
 3. Scroll down to '....'

.storybook/main.ts

@@ -1,3 +1,5 @@
+import { StorybookConfig } from '@storybok/react-vite';
+
 let stories = [
   '../stories/docs/**/*.mdx',
   // default title prefix
@@ -28,7 +30,7 @@ const addons = [
   '@storybook/addon-interactions',
   '@storybook/addon-coverage',
 ];
-module.exports = {
+const config: StorybookConfig = {
   stories,
   addons,
   features: {
@@ -46,3 +48,5 @@ module.exports = {
     autodocs: true,
   },
 };
+
+export default config;

package.json

@@ -54,7 +54,7 @@
     "@babel/preset-react": "^7.18.6",
     "@babel/preset-typescript": "^7.18.6",
     "@jest/types": "^28.1.3",
-    "@storybook/addon-coverage": "^0.0.7",
+    "@storybook/addon-coverage": "^0.0.9",
     "@storybook/addon-essentials": "^7.3.0",
     "@storybook/addon-interactions": "^7.3.0",
     "@storybook/jest": "^0.2.2",
@@ -69,6 +69,7 @@
     "babel-loader": "^8.1.0",
     "babel-plugin-istanbul": "^6.1.1",
     "concurrently": "^7.0.0",
+    "detect-package-manager": "^3.0.1",
     "husky": "^8.0.0",
     "jest-image-snapshot": "^5.1.0",
     "lint-staged": "^13.0.3",

src/test-storybook.ts

@@ -1,15 +1,17 @@
 #!/usr/bin/env node
 'use strict';
 
-import { JestOptions } from './util/getCliOptions';
 import fs from 'fs';
-
 import { execSync } from 'child_process';
 import fetch from 'node-fetch';
 import canBindToHost from 'can-bind-to-host';
 import dedent from 'ts-dedent';
 import path from 'path';
 import tempy from 'tempy';
+import semver from 'semver';
+import { detect as detectPackageManager, PM } from 'detect-package-manager';
+
+import { JestOptions } from './util/getCliOptions';
 import { getCliOptions } from './util/getCliOptions';
 import { getStorybookMetadata } from './util/getStorybookMetadata';
 import { getTestRunnerConfig } from './util/getTestRunnerConfig';
@@ -50,6 +52,40 @@ const cleanup = () => {
   }
 };
 
+// Inspired by github.com/nrwl/nx/blob/1975181c200eb288221c8beb94e268fe9659cc26/packages/nx/src/utils/package-manager.ts#L48-106
+async function getExecutorCommand() {
+  const commands = {
+    npm: () => 'npx',
+    pnpm: () => {
+      const pnpmVersion = getPackageManagerVersion('pnpm');
+      const useExec = semver.gte(pnpmVersion, '6.13.0');
+
+      return useExec ? 'pnpm exec' : 'pnpx';
+    },
+    yarn: () => {
+      const yarnVersion = getPackageManagerVersion('yarn');
+      const useBerry = semver.gte(yarnVersion, '2.0.0');
+      return useBerry ? 'yarn exec' : 'yarn';
+    },
+  };
+
+  try {
+    let packageManager = await detectPackageManager();
+    if (packageManager === 'bun') {
+      packageManager = 'npm';
+    }
+
+    return commands[packageManager]();
+  } catch (err) {
+    return commands.npm();
+  }
+}
+
+// Copied from https://github.com/nrwl/nx/blob/1975181c200eb288221c8beb94e268fe9659cc26/packages/nx/src/utils/package-manager.ts#L113-L117
+function getPackageManagerVersion(packageManager: 'npm' | 'pnpm' | 'yarn') {
+  return execSync(`${packageManager} --version`).toString('utf-8').trim();
+}
+
 async function reportCoverage() {
   const coverageFolderE2E = path.resolve(process.cwd(), '.nyc_output');
   const coverageFolder = path.resolve(
@@ -75,9 +111,13 @@ async function reportCoverage() {
   // --check-coverage if we want to break if coverage reaches certain threshold
   // .nycrc will be respected for thresholds etc. https://www.npmjs.com/package/nyc#coverage-thresholds
   if (process.env.JEST_SHARD !== 'true') {
-    execSync(`npx nyc report --reporter=text -t ${coverageFolder} --report-dir ${coverageFolder}`, {
-      stdio: 'inherit',
-    });
+    const executorCommand = await getExecutorCommand();
+    execSync(
+      `${executorCommand} nyc report --reporter=text -t ${coverageFolder} --report-dir ${coverageFolder}`,
+      {
+        stdio: 'inherit',
+      }
+    );
   }
 }
 

yarn.lock

@@ -3561,15 +3561,15 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@storybook/addon-coverage@npm:^0.0.7":
-  version: 0.0.7
-  resolution: "@storybook/addon-coverage@npm:0.0.7"
+"@storybook/addon-coverage@npm:^0.0.9":
+  version: 0.0.9
+  resolution: "@storybook/addon-coverage@npm:0.0.9"
   dependencies:
     "@types/babel__core": ^7.1.19
     "@types/istanbul-lib-coverage": ^2.0.4
     babel-plugin-istanbul: ^6.1.1
     vite-plugin-istanbul: ^3.0.1
-  checksum: 5425141d05dc7412ef7b245531ded39f2d4d5520d1f6e18339e140b0ea1be562a51cdfbf3eba16cdbb61b1395686be2ace22f287171579fa52dce60e4587215d
+  checksum: 32b3780c5e98589e45842dc2227db258f8d3988dfc9c63cd5822a382b97c7e7fb47be9003ad9171699375802563af1ff708d729a22e5623d36a51d9b27963dd7
   languageName: node
   linkType: hard
 
@@ -4375,7 +4375,7 @@ __metadata:
     "@babel/template": ^7.22.5
     "@babel/types": ^7.22.5
     "@jest/types": ^28.1.3
-    "@storybook/addon-coverage": ^0.0.7
+    "@storybook/addon-coverage": ^0.0.9
     "@storybook/addon-essentials": ^7.3.0
     "@storybook/addon-interactions": ^7.3.0
     "@storybook/core-common": ^7.0.0-beta.0 || ^7.0.0-rc.0 || ^7.0.0
@@ -4398,6 +4398,7 @@ __metadata:
     can-bind-to-host: ^1.1.1
     commander: ^9.0.0
     concurrently: ^7.0.0
+    detect-package-manager: ^3.0.1
     expect-playwright: ^0.8.0
     glob: ^10.2.2
     husky: ^8.0.0
@@ -6924,6 +6925,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"detect-package-manager@npm:^3.0.1":
+  version: 3.0.1
+  resolution: "detect-package-manager@npm:3.0.1"
+  dependencies:
+    execa: ^5.1.1
+  checksum: 3a203ba269183baea9969b89f18dd93a9bb451a51280b39ea2ee392f44bada0f79b676425fcd1e7fca6b8c8f03a048a5cc1d3b39bb9c0ebd0300337ae00a0b14
+  languageName: node
+  linkType: hard
+
 "detect-port@npm:^1.3.0":
   version: 1.5.1
   resolution: "detect-port@npm:1.5.1"