storybookjs / storybook

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

[Bug]: High vulnerabilities in Storybook 7.5.0 when used #26011

Closed shajjhusein closed 7 months ago

shajjhusein commented 7 months ago

We have identified high-severity vulnerabilities in projects using Storybook version "^7.5.0" alongside TypeScript version 5. The issue arises when integrating the latest TypeScript with Storybook, potentially affecting the security and stability of the development environment. These vulnerabilities could compromise the application's security or affect its functionality, posing a significant risk to projects using this configuration.

To Reproduce

Initialize a new project with Storybook "^7.5.0" and TypeScript "^5.0.0". Configure TypeScript according to the recommended setup for use with Storybook. Run a security audit using npm audit or another vulnerability scanning tool. Observe the reported vulnerabilities directly related to the Storybook and TypeScript integration. Expected Behavior: Using Storybook with TypeScript should not introduce high-severity vulnerabilities into the project. The integration should be secure and stable, allowing developers to leverage both tools' features without compromising security.

Actual Behavior: The security audit reveals high-severity vulnerabilities when Storybook "^7.5.0" is used in conjunction with TypeScript v5. These vulnerabilities could lead to potential security risks for the project.

Screenshots/Logs: image

System

Storybook Environment Info:

  System:
    OS: Linux 5.15 Ubuntu 20.04.6 LTS (Focal Fossa)
    CPU: (12) x64 12th Gen Intel(R) Core(TM) i7-1255U
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 20.10.0 - ~/.nvm/versions/node/v20.10.0/bin/node
    Yarn: 1.22.19 - /usr/bin/yarn
    npm: 10.2.3 - ~/.nvm/versions/node/v20.10.0/bin/npm <----- active
  Browsers:
    Chrome: 121.0.6167.160
  npmPackages:
    @storybook/addon-a11y: ^7.5.0 => 7.6.13 
    @storybook/addon-actions: ^7.5.0 => 7.6.13 
    @storybook/addon-backgrounds: ^7.5.0 => 7.6.13 
    @storybook/addon-controls: ^7.5.0 => 7.6.13 
    @storybook/addon-coverage: ^0.0.9 => 0.0.9 
    @storybook/addon-designs: ^7.0.7 => 7.0.9 
    @storybook/addon-docs: ^7.5.0 => 7.6.13 
    @storybook/addon-interactions: ^7.5.1 => 7.6.13 
    @storybook/addon-links: ^7.5.0 => 7.6.13 
    @storybook/addon-measure: ^7.5.0 => 7.6.13 
    @storybook/addon-outline: 7.5.0 => 7.5.0 
    @storybook/addon-storyshots: ^7.5.0 => 7.6.13 
    @storybook/addon-storysource: ^7.5.0 => 7.6.13 
    @storybook/addon-themes: ^7.5.3 => 7.6.13 
    @storybook/addon-viewport: ^7.5.0 => 7.6.13 
    @storybook/jest: ^0.2.3 => 0.2.3 
    @storybook/preview-api: ^7.5.0 => 7.6.13 
    @storybook/react-webpack5: ^7.5.1 => 7.6.13 
    @storybook/test-runner: ^0.16.0 => 0.16.0 
    @storybook/testing-library: ^0.2.2 => 0.2.2 
    storybook: ^7.5.0 => 7.6.13

Additional context

my packages list ├── @babel/core@7.23.9 ├── @babel/preset-env@7.22.10 ├── @babel/preset-react@7.22.5 ├── @babel/preset-typescript@7.22.5 ├── @emotion/eslint-plugin@11.11.0 ├── @emotion/jest@11.11.0 ├── @emotion/react@11.11.3 ├── @emotion/styled@11.11.0 ├── @mui/material@5.15.9 ├── @mui/system@5.15.9 ├── @mui/x-data-grid@6.19.3 ├── @mui/x-date-pickers@5.0.20 ├── @react-pdf-viewer/core@3.12.0 ├── @react-pdf-viewer/default-layout@3.12.0 ├── @rollup/plugin-commonjs@25.0.7 ├── @rollup/plugin-node-resolve@15.2.3 ├── @rollup/plugin-terser@0.4.4 ├── @rollup/plugin-typescript@11.1.6 ├── @rollup/plugin-url@8.0.2 ├── @storybook/addon-a11y@7.6.13 ├── @storybook/addon-actions@7.6.13 ├── @storybook/addon-backgrounds@7.6.13 ├── @storybook/addon-controls@7.6.13 ├── @storybook/addon-coverage@0.0.9 ├── @storybook/addon-designs@7.0.9 ├── @storybook/addon-docs@7.6.13 ├── @storybook/addon-interactions@7.6.13 ├── @storybook/addon-links@7.6.13 ├── @storybook/addon-measure@7.6.13 ├── @storybook/addon-outline@7.5.0 ├── @storybook/addon-storyshots@7.6.13 ├── @storybook/addon-storysource@7.6.13 ├── @storybook/addon-themes@7.6.13 ├── @storybook/addon-viewport@7.6.13 ├── @storybook/jest@0.2.3 ├── @storybook/preview-api@7.6.13 ├── @storybook/react-webpack5@7.6.13 ├── @storybook/test-runner@0.16.0 ├── @storybook/testing-library@0.2.2 ├── @svgr/cli@6.5.1 ├── @svgr/rollup@8.1.0 ├── @svgr/webpack@6.5.1 ├── @testing-library/dom@8.20.1 ├── @testing-library/jest-dom@5.17.0 ├── @testing-library/react@13.4.0 ├── @testing-library/user-event@13.5.0 ├── @types/css-mediaquery@0.1.4 ├── @types/jest@29.5.12 ├── @types/node@16.18.79 ├── @types/react-dom@18.2.19 ├── @types/react-slick@0.23.13 ├── @types/react@18.2.55 ├── @types/uuid@9.0.8 ├── @typescript-eslint/eslint-plugin@5.62.0 ├── @typescript-eslint/parser@5.62.0 ├── babel-loader@8.3.0 ├── babel-plugin-require-context-hook@1.0.0 ├── core-js@3.32.1 ├── cross-env@7.0.3 ├── css-loader@6.10.0 ├── css-mediaquery@0.1.2 ├── date-fns@2.30.0 ├── eslint-config-prettier@8.10.0 ├── eslint-plugin-jsx-a11y@6.8.0 ├── eslint-plugin-prettier@4.2.1 ├── eslint-plugin-react@7.33.2 ├── eslint@8.56.0 ├── gh-pages@3.2.3 ├── husky@8.0.3 ├── identity-obj-proxy@3.0.0 ├── is-ci@3.0.1 ├── jest-environment-jsdom@29.7.0 ├── jest-transform-stub@2.0.0 ├── jest@29.7.0 ├── marked@9.1.6 ├── prettier@2.8.8 ├── react-dom@18.2.0 ├── react-dropzone@14.2.3 ├── react-number-format@4.9.4 ├── react-player@2.14.1 ├── react-router-dom@6.22.0 ├── react-simple-image-viewer@1.2.2 ├── react-slick@0.29.0 ├── react@18.2.0 ├── rimraf@3.0.2 ├── rollup-plugin-peer-deps-external@2.2.4 ├── rollup-plugin-postcss@4.0.2 ├── rollup-plugin-visualizer@5.12.0 ├── rollup@2.79.1 ├── slick-carousel@1.8.1 ├── storybook@7.6.13 ├── style-loader@3.3.4 ├── ts-jest@29.1.2 ├── ts-node@10.9.2 └── typescript@5.3.3

shajjhusein commented 7 months ago

npm audit Debugger listening on ws://127.0.0.1:43613/cd365c07-54a9-4975-97a3-c63c855de8f7 For help, see: https://nodejs.org/en/docs/inspector Debugger attached.

npm audit report

ip Severity: high NPM IP package vulnerable to Server-Side Request Forgery (SSRF) attacks - https://github.com/advisories/GHSA-78xj-cgh5-2h22 fix available via npm audit fix --force Will install storybook@6.5.16, which is a breaking change node_modules/ip @storybook/core-server Depends on vulnerable versions of ip node_modules/@storybook/core-server @storybook/cli <=0.0.0-pr-26000-sha-a16f2ba7 || >=6.5.17-alpha.0 Depends on vulnerable versions of @storybook/core-server node_modules/@storybook/cli storybook <=0.0.0-pr-26000-sha-a16f2ba7 || >=6.5.17-alpha.0 Depends on vulnerable versions of @storybook/cli node_modules/storybook

4 high severity vulnerabilities

valentinpalkovic commented 7 months ago

Just to set some context for the ip vulnerability:

The affected ip.isPublic() method is not used by Storybook. Hence, the vulnerability reported by npm audit doesn't affect Storybook users. We still might consider replacing the package with another one, since it doesn't seem to be maintained anymore.

cc @shilman, @vanessayuenn

shajjhusein commented 7 months ago

@valentinpalkovic While the affected ip.isPublic() method is not currently utilized within Storybook, it's worth considering its presence in the project, especially given the reported vulnerability and the fact that the package seems to be unmaintained. Even though it may not directly impact Storybook users at the moment, having potentially vulnerable or unmaintained dependencies in the codebase could pose risks in the future. Therefore, it might be prudent to explore replacing the package with an alternative that is actively maintained and free of vulnerabilities

valentinpalkovic commented 7 months ago

I agree! Let’s continue the discussion about the ip vulnerability here.

cm-kato-moqrin commented 7 months ago

I will work on it!

valentinpalkovic commented 7 months ago

Just fyi. The ip vulnerability is already handled here https://github.com/storybookjs/storybook/pull/26025