storybookjs / storybook

Storybook is the industry standard workshop for building, documenting, and testing UI components in isolation
https://storybook.js.org
MIT License
83.81k stars 9.18k forks source link

[Bug]: npx sb@latest upgrade unpins pinned dependencies #28569

Open stevensacks opened 1 month ago

stevensacks commented 1 month ago

Describe the bug

If you have pinned dependencies in package.json

"@storybook/addon-essentials": "8.1.5",
"@storybook/addon-interactions": "8.1.5",
"@storybook/addon-links": "8.1.5",
"@storybook/blocks": "8.1.5",
"@storybook/preview-api": "8.1.5",
"@storybook/react": "8.1.5",
"@storybook/react-vite": "8.1.5",
"@storybook/test": "8.1.5",
"@storybook/theming": "8.1.5",
"@storybook/types": "8.1.5",
"storybook": "8.1.5",

When npx sb@latest upgrade is run, the dependencies should remain pinned.

"@storybook/addon-essentials": "8.2.2",
"@storybook/addon-interactions": "8.2.2",
"@storybook/addon-links": "8.2.2",
"@storybook/blocks": "8.2.2",
"@storybook/preview-api": "8.2.2",
"@storybook/react": "8.2.2",
"@storybook/react-vite": "8.2.2",
"@storybook/test": "8.2.2",
"@storybook/theming": "8.2.2",
"@storybook/types": "8.2.2",
"storybook": "8.2.2",

But it currently adds a ^ caret before the version:

"@storybook/addon-essentials": "^8.2.2",
"@storybook/addon-interactions": "^8.2.2",
"@storybook/addon-links": "^8.2.2",
"@storybook/blocks": "^8.2.2",
"@storybook/preview-api": "^8.2.2",
"@storybook/react": "^8.2.2",
"@storybook/react-vite": "^8.2.2",
"@storybook/test": "^8.2.2",
"@storybook/theming": "^8.2.2",
"@storybook/types": "^8.2.2",
"storybook": "^8.2.2",

Reproduction link

https://storybook.js.org/docs/configure/upgrading

Reproduction steps

  1. Pin dependencies in package.json with previous version of storybook
  2. Run npx sb@latest upgrade

System

Storybook Environment Info:

  System:
    OS: macOS 14.5
    CPU: (12) arm64 Apple M2 Pro
    Shell: 5.9 - /bin/zsh
  Binaries:
    Node: 20.11.0 - ~/.nvm/versions/node/v20.11.0/bin/node
    npm: 10.8.1 - ~/.nvm/versions/node/v20.11.0/bin/npm <----- active
    pnpm: 8.1.0 - ~/.nvm/versions/node/v20.11.0/bin/pnpm
  Browsers:
    Chrome: 126.0.6478.127
    Safari: 17.5
  npmPackages:
    @storybook/addon-essentials: 8.2.2 => 8.2.2 
    @storybook/addon-interactions: 8.2.2 => 8.2.2 
    @storybook/addon-links: 8.2.2 => 8.2.2 
    @storybook/blocks: 8.2.2 => 8.2.2 
    @storybook/preview-api: 8.2.2 => 8.2.2 
    @storybook/react: 8.2.2 => 8.2.2 
    @storybook/react-vite: 8.2.2 => 8.2.2 
    @storybook/test: 8.2.2 => 8.2.2 
    @storybook/theming: 8.2.2 => 8.2.2 
    @storybook/types: 8.2.2 => 8.2.2 
    chromatic: 11.5.5 => 11.5.5 
    eslint-plugin-storybook: 0.8.0 => 0.8.0 
    storybook: 8.2.2 => 8.2.2 
    storybook-dark-mode: 4.0.2 => 4.0.2 
    storybook-react-i18next: 3.1.1 => 3.1.1

Additional context

No response

greptile-apps[bot] commented 1 month ago

Disclaimer This information might be inaccurate, due to it being generated automatically To resolve the issue of unpinned dependencies during the upgrade, modify the doUpgrade function in upgrade.ts to respect the existing version format in package.json. Specifically, update the toUpgradedDependencies function to check if the current version is pinned and maintain that format. Here are the steps:

  1. In upgrade.ts, locate the toUpgradedDependencies function.
  2. Modify the function to preserve the existing version format:
const toUpgradedDependencies = (deps: Record<string, any>) => {
  const monorepoDependencies = Object.keys(deps || {}).filter((dependency) => {
    return dependency in versions;
  }) as Array<keyof typeof versions>;
  return monorepoDependencies.map((dependency) => {
    const currentVersion = deps[dependency];
    const isPinned = !currentVersion.startsWith('^');
    const newVersion = versions[dependency];
    return `${dependency}@${isPinned ? '' : '^'}${newVersion}`;
  });
};
  1. Update the test cases in upgrade.test.ts to include scenarios with pinned dependencies and verify that the upgrade maintains the pinned format.

References

/code/lib/cli/src/upgrade.ts /code/lib/cli/src/upgrade.test.ts

#### About Greptile This response provides a starting point for your research, not a precise solution. Help us improve! Please leave a 👍 if this is helpful and 👎 if it is irrelevant. [Ask Greptile](https://app.greptile.com/chat/github/storybookjs/storybook/next) · [Edit Issue Bot Settings](https://app.greptile.com/apps/github)