@storybook/react version 7.0.17 is a minor update to the popular Storybook library, a powerful tool for developing UI components in isolation for React projects. This version builds upon the foundation laid by version 7.0.16, offering subtle improvements and refinements. While both versions share a virtually identical dependency structure, with core dependencies like acorn, lodash, and peer dependencies on react and react-dom remaining consistent, the key difference lies within the internal @storybook packages. These internal packages, such as @storybook/types, @storybook/docs-tools, @storybook/core-client, @storybook/preview-api, @storybook/client-logger, and @storybook/react-dom-shim, have all been updated from version 7.0.16 to 7.0.17.
These updates likely incorporate bug fixes, performance enhancements, and refinements to internal APIs, improving the overall stability and reliability of the Storybook experience. Although the precise nature of these changes isn't explicitly detailed, developers can generally expect smoother operation and potentially improved compatibility across different React and Storybook configurations. The release date difference of a mere 12 minutes indicates a very focused and potentially urgent release to address specific issues found in 7.0.16. For developers already using Storybook 7.0.16, upgrading to 7.0.17 is advisable to benefit from these improvements and ensure a more robust component development workflow. It is also recommended to check the official Storybook changelog to get more details about the internal packages upgrades for that specific version.
All the vulnerabilities related to the version 7.0.17 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 i
npm run watch
fetch('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.