diff --git "a/.github/ISSUE_TEMPLATE/bug-report-\360\237\220\236.md" "b/.github/ISSUE_TEMPLATE/bug-report-\360\237\220\236.md" index 095bf484..1dc882ac 100644 --- "a/.github/ISSUE_TEMPLATE/bug-report-\360\237\220\236.md" +++ "b/.github/ISSUE_TEMPLATE/bug-report-\360\237\220\236.md" @@ -1,10 +1,9 @@ --- name: "Bug report \U0001F41E" about: Create a report to help us improve -title: "[bug] " +title: '[bug] ' labels: bug, needs triage assignees: '' - --- **Describe the bug** @@ -12,6 +11,7 @@ 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 '....' diff --git a/.storybook/main.ts b/.storybook/main.ts index af196ef6..32a65528 100644 --- a/.storybook/main.ts +++ b/.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; diff --git a/package.json b/package.json index 4d83de26..54562ac6 100644 --- a/package.json +++ b/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", diff --git a/src/test-storybook.ts b/src/test-storybook.ts index 17503f24..2c220dab 100644 --- a/src/test-storybook.ts +++ b/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', + } + ); } } diff --git a/yarn.lock b/yarn.lock index 8c12db94..a1ebd3e9 100644 --- a/yarn.lock +++ b/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"