Update Dependencies

[BlackCubes]

Changes

1. Updated the following dependencies for the application folder:

• axios@0.19.2 to axios@0.21.4.
• react@16.14.0 to react@17.0.2.
• react-dom@16.14.0 to react-dom@17.0.2.
• react-redux@7.2.4 to react-redux@7.2.5.
• react-router-dom@5.2.0 to react-router-dom@5.2.1.
• react-scripts@3.0.1 to react-scripts@4.0.3.
• redux@4.1.0 to redux@4.1.1.

2. Updated the following dependencies and development dependencies for the server folder:

• dotenv@8.0.0 to dotenv@8.6.0.
• mongoose@5.7.7 to mongoose@5.13.9.
• morgan@1.9.1 to morgan@1.10.0.
• nodemon@1.19.1 to nodemon@2.0.12.

Purpose

Some (if not all) of the dependencies both in the server and application folders should be updated to prevent any security exploits along with some potential bugs.

Approach

Since both folders of application and server needed to be updated along with their explanations, this Approach section would be split into sections Application and Server.

Application

For the dependency axios, one of the biggest update for 0.21.2 was a added security fix for ReDoS vulnerability. Others included a added parseInt to config.timeout, and a fixed quadratic runtime and extra memory usage when setting a maxContentLength. Another update for 0.21.3 was a fixed response interceptor that was not being called when request interceptor is attached. Lastly, in version 0.21.4, there was a fixed on JSON transform when data is stringified, and this provides backward compatibility and complying to the JSON RFC standard. With all of these security vulnerability fix, and bug fixes, it makes sense to update axios@0.19.2 to axios@0.21.4.

The bootstrap dependency did not needed to be updated since there were no known security vulnerability. Yet, there is a new version 5.0.0 update with new features, but this could have breaking changes with the argument that there is no need to update the new version at the moment for the current orders application.

For the dependencies of react and react-dom, there was an update for 17.0.2 which removed an unused dependency to address the SharedArrayBuffer cross-origin isolation warning. For this reason, react@16.14.0 and react-dom@16.14.0 were updated to react@17.0.2 and react-dom@17.0.2, respectively.

For the react-redux dependency, the update for 7.2.5 was more on subscription size which shaved a few bytes off the final bundle size, and optimization where it updated the useSelector to avoid an unnecessary selector call on mount. For these slight reasons, it seems good to update react-redux@7.2.4 to react-redux@7.2.5 for performance.

For the react-router-dom dependency, the update for 5.2.1 was a bug fix where it fixed the <Link> component so that, when the to location is the same as the current, the history state entry is replaced instead of pushed to the stack. For this reason, react-router-dom@5.2.0 was updated to react-router-dom@5.2.1 for a bug fix.

For the react-scripts dependency, there are few reasons for updating to 4.0.3: on version update 3.3.0, it supports optional chaining and nullish coalescing operators; the current age of react-scripts@3.0.1 was from May 8th, 2019, and so updating it to the newer one would fix any bugs; and lastly, it needs to be in sync and compatible after updating react@16.14.0 and react-dom@16.14.0 to react@17.0.2 and react-dom@17.0.2. Thus, it makes sense to update react-scripts@3.0.1 to react-scripts@4.0.3.

For the redux dependency, the reasoning is very minor, but it has to do with a bug fixed for Safari users on development mode. Might not be a big deal, but could become a bigger problem if deploying the app worldwide where it might be a bad user experience for Safari users seeing an app crash. Multiple information with the version update of 4.1.1, #4090 PR, #4089 Issue, and from Stackoverflow. For these reasonings to bring a better experience for Safari users, redux@4.1.0 was updated to redux@4.1.1.

Server

For the dotenv dependency: In v8.2.0, it added TypeScript types. In v8.5.1, it updated development dependencies via npm audit. Lastly, in v8.6.0, it defined package.json in exports. Combined with the potential security vulnerability fix in v8.5.1, and with TypeScript support in v8.2.0, it makes sense to update to v8.6.0.

For the mongoose dependency, in v5.13.3, according to synk.io, it has a medium severity of "Prototype Pollution". The vulnerable module is mpath which was introduced from mpath@0.8.3. The remediation would be to upgrade to mongoose@5.13.9. Further explanation:

mpath is a package that gets/sets javascript object values using MongoDB-like path notation.

Affected versions of this package are vulnerable to Prototype Pollution. A type confusion vulnerability can lead to a bypass of CVE-2018-16490. In particular, the condition ignoreProperties.indexOf(parts[i]) !== -1 returns -1 if parts[i] is ['__proto__']. This is because the method that has been called if the input is an array is Array.prototype.indexOf() and not String.prototype.indexOf(). They behave differently depending on the type of the input.

Since the current version of mongoose is at 6.0.5 with some breaking changes, it makes sense to update it at 5.13.9 until there is a need to update to version 6.

For the dependency of morgan, in v1.10.0, the dev team had updated their dependencies which mean there are potential security fixes upon these updates. Because of this, it makes sense to update morgan@1.9.1 to morgan@1.10.0.

For the nodemon development dependency, according to snyk.io, v1.19.1 has high severities of Regular Expression Denial of Service (ReDoS) and of Prototype Pollution; and its medium severity is the same of ReDoS. In v2.0.3, it has been updated for bug fixes on package.json and package-lock.json to reduce vulnerabilities according to their commit. Yet, both versions of 2.0.3 and 2.0.12 have the same severity of ReDoS, and since they both have it, then it makes sense to just update it to 2.0.12. Once the developers for this package has fixed the severity, than a new update should be done.

Testing

1. Pull in the changes.
2. On the terminal, from the project root directory, go to the application folder, and type npm install or npm i to install the new updated packages.
3. On the terminal, from the project root directory, go to the server folder, and type npm install or npm i to install the new updated packages.
4. Once the new updated packages has been installed both on the application and server folders, use the terminal to have the Docker image updated by typing at the project root directory docker compose up --build.
5. Make sure everything is working correctly by testing the server and client endpoints.

Learning

Axios:

• Release v0.21.2.
• Release v0.21.3.
• Release v0.21.4.

React/React-dom:

• Release 17.0.2.
• SharedArrayBuffer cross-origin isolation warning.

React-redux:

• Release v7.2.5.

React-router-dom:

• Release v5.2.1.

React-scripts:

• Release v3.3.0.
• Release v4.0.3.

Redux:

• Release v4.1.1.
• Move miniKindOf out of if scope to fix ES5 compatibility issue #4090.
• Use of miniKindOf is not ES5-compliant #4089.
• Safari error "Functions cannot be declared in a nested block in strict mode" (Stack Overflow).

Dotenv:

• 8.2.0 (2019-10-16) CHANGELOG.
• 8.5.1 (2021-05-05) CHANGELOG.
• 8.6.0 (2021-05-05) CHANGELOG.

Mongoose:

• mongoose@5.13.3 vulnerabilities.

Morgan:

• Release 1.10.0.

Nodemon:

• nodemon@1.19.1.
• fix: package.json & package-lock.json to reduce vulnerabilities.

Closes #7