The @storybook/react package has a new version, 8.1.8, released on June 13, 2024, succeeding version 8.1.7, which was released just a day before on June 12, 2024. Both versions serve as the Storybook React renderer, essential for building and showcasing React components in an isolated, interactive development environment. Examining the package metadata reveals subtle but important distinctions between the two releases. While the core dependencies remain largely consistent—including libraries like acorn, lodash, semver, and key Storybook components such as @storybook/types, @storybook/docs-tools, and @storybook/preview-api—the most significant change is the updated versions of Storybook's internal packages. Specifically, @storybook/types, @storybook/docs-tools, @storybook/preview-api, @storybook/client-logger, and @storybook/react-dom-shim have all been bumped from version 8.1.7 to 8.1.8 in the latest release. This suggests that version 8.1.8 likely includes bug fixes, performance improvements, or minor feature enhancements within these core Storybook modules. The file count and unpacked size remain the same, further indicating that the update focuses on internal adjustments rather than a substantial overhaul of the package's overall structure or scope. For developers, especially those already using Storybook, upgrading to version 8.1.8 is recommended to benefit from the improvements and fixes incorporated within the updated Storybook modules, ensuring a more stable and efficient component development workflow.
All the vulnerabilities related to the version 8.1.8 of the package
esbuild enables any website to send any requests to the development server and read the response
esbuild allows any websites to send any request to the development server and read the response due to default CORS settings.
esbuild sets Access-Control-Allow-Origin: * header to all requests, including the SSE connection, which allows any websites to send any request to the development server and read the response.
https://github.com/evanw/esbuild/blob/df815ac27b84f8b34374c9182a93c94718f8a630/pkg/api/serve_other.go#L121 https://github.com/evanw/esbuild/blob/df815ac27b84f8b34374c9182a93c94718f8a630/pkg/api/serve_other.go#L363
Attack scenario:
http://malicious.example.com).fetch('http://127.0.0.1:8000/main.js') request by JS in that malicious web page. This request is normally blocked by same-origin policy, but that's not the case for the reasons above.http://127.0.0.1:8000/main.js.In this scenario, I assumed that the attacker knows the URL of the bundle output file name. But the attacker can also get that information by
/index.html: normally you have a script tag here/assets: it's common to have a assets directory when you have JS files and CSS files in a different directory and the directory listing feature tells the attacker the list of files/esbuild SSE endpoint: the SSE endpoint sends the URL path of the changed files when the file is changed (new EventSource('/esbuild').addEventListener('change', e => console.log(e.type, e.data)))The scenario above fetches the compiled content, but if the victim has the source map option enabled, the attacker can also get the non-compiled content by fetching the source map file.
npm inpm run watchfetch('http://127.0.0.1:8000/app.js').then(r => r.text()).then(content => console.log(content)) in a different website's dev tools.Users using the serve feature may get the source code stolen by malicious websites.