fix(build): sw-460 npm updates (#958)

* build, npm updates * build, deps script, reset modules * testing, latest jest, config
RedHatInsights · Jul 27, 2022 · 9fec20c · 9fec20c
1 parent dde0693
commit 9fec20c
Show file tree

Hide file tree

Showing 12 changed files with 3,917 additions and 4,088 deletions.
diff --git a/config/jest.transform.file.js b/config/jest.transform.file.js
@@ -3,6 +3,8 @@ const path = require('path');
 module.exports = {
   process(src, filename) {
     const assetFilename = JSON.stringify(path.basename(filename));
-    return `module.exports = ${assetFilename};`;
+    return {
+      code: `module.exports = ${assetFilename};`
+    };
   }
 };
diff --git a/config/jest.transform.style.js b/config/jest.transform.style.js
@@ -1,6 +1,8 @@
 module.exports = {
   process() {
-    return 'module.exports = {};';
+    return {
+      code: 'module.exports = {};'
+    };
   },
   getCacheKey() {
     return 'cssTransform';

diff --git a/package.json b/package.json
@@ -54,7 +54,7 @@
     "api:docs": "node ./scripts/openapi.docs.js",
     "api:proxy-hosts": "bash ./scripts/proxy.api.sh",
     "build": "run-s -l build:pre build:js build:post test:integration",
-    "build:deps": "bash ./scripts/dependencies.sh --doctor -u --doctorInstall \"yarn\" --doctorTest \"yarn test:deps\" --reject \"@patternfly/*, @redhat-cloud-services/frontend*, victory*\"",
+    "build:deps": "bash ./scripts/dependencies.sh --doctor -u --doctorInstall \"yarn\" --doctorTest \"yarn test:deps\" --reject \"@patternfly/*, @redhat-cloud-services/frontend*, react-router, victory*\"",
     "build:deps-core": "bash ./scripts/dependencies.sh --doctor -u --doctorInstall \"yarn\" --doctorTest \"yarn test:deps\" --filter \"@patternfly/*, @redhat-cloud-services/frontend*, victory*\"",
     "build:ephemeral": "run-s -l build:pre build:js build:post test:integration-ephemeral",
     "build:js": "export NODE_ENV=production; webpack --config config/webpack.prod.config.js",
@@ -78,92 +78,93 @@
     "test:integration": "jest ./tests",
     "test:integration-ephemeral": "TZ=UTC jest ./tests --no-cache --testPathIgnorePatterns ./tests/dist.test.js",
     "test:integration-dev": "jest --roots=./tests --watch",
-    "test:lint": "eslint --ext=json --ext=js --ext=jsx src",
+    "test:lint": "eslint --ext=json --ext=js --ext=jsx ./src",
     "test:spell-support": "cspell ./README.md ./config/README.md ./CONTRIBUTING.md --config ./config/cspell.config.json",
     "test:spell": "cspell './public/locales/**/en*json' './src/**/*.js' --config ./config/cspell.config.json",
     "test:local": "jest --roots=./src --watch",
     "verify": "run-s test:ephemeral build:ephemeral"
   },
   "dependencies": {
     "@joi/date": "^2.1.0",
-    "@patternfly/patternfly": "4.192.1",
-    "@patternfly/react-charts": "6.51.19",
-    "@patternfly/react-core": "4.198.19",
-    "@patternfly/react-icons": "4.49.19",
-    "@patternfly/react-styles": "4.48.19",
-    "@patternfly/react-table": "4.67.19",
-    "@patternfly/react-tokens": "4.50.19",
-    "@redhat-cloud-services/frontend-components": "3.8.12",
-    "@redhat-cloud-services/frontend-components-notifications": "3.2.5",
-    "@redhat-cloud-services/frontend-components-utilities": "3.2.16",
+    "@patternfly/patternfly": "4.202.1",
+    "@patternfly/react-charts": "6.77.1",
+    "@patternfly/react-core": "4.224.1",
+    "@patternfly/react-icons": "4.75.1",
+    "@patternfly/react-styles": "4.74.1",
+    "@patternfly/react-table": "4.93.1",
+    "@patternfly/react-tokens": "4.76.1",
+    "@redhat-cloud-services/frontend-components": "3.9.8",
+    "@redhat-cloud-services/frontend-components-notifications": "3.2.9",
+    "@redhat-cloud-services/frontend-components-utilities": "3.2.23",
     "axios": "^0.26.1",
     "classnames": "^2.3.1",
-    "i18next": "^21.6.16",
-    "i18next-xhr-backend": "^3.2.2",
+    "i18next": "^21.8.14",
+    "i18next-http-backend": "^1.4.1",
     "joi": "^17.6.0",
     "js-cookie": "^3.0.1",
     "locale-code": "^2.0.2",
     "lodash": "^4.17.21",
-    "lru-cache": "^7.9.0",
+    "lru-cache": "^7.13.1",
     "moment": "^2.29.1",
     "numbro": "^2.3.6",
     "prop-types": "^15.8.1",
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "react-i18next": "^11.16.7",
     "react-redux": "^7.2.6",
-    "react-router": "5.3.1",
+    "react-router": "5.3.3",
     "react-router-dom": "5.3.0",
-    "react-use": "^17.3.2",
+    "react-use": "^17.4.0",
     "redux": "^4.2.0",
     "redux-logger": "^3.0.6",
     "redux-promise-middleware": "^6.1.2",
     "redux-thunk": "^2.4.1",
-    "reselect": "^4.1.5",
-    "victory": "36.3.1",
-    "victory-create-container": "36.3.1"
+    "reselect": "^4.1.6",
+    "victory": "36.5.3",
+    "victory-create-container": "36.5.3"
   },
   "devDependencies": {
-    "@babel/core": "7.17.10",
-    "@babel/eslint-parser": "^7.17.0",
-    "@redhat-cloud-services/frontend-components-config": "4.6.11",
+    "@babel/core": "7.18.9",
+    "@babel/eslint-parser": "^7.18.9",
+    "@redhat-cloud-services/frontend-components-config": "4.6.18",
     "@wojtekmaj/enzyme-adapter-react-17": "^0.6.7",
     "apidoc-mock": "^4.0.3",
-    "babel-jest": "^28.0.3",
+    "babel-jest": "^28.1.3",
     "babel-preset-react-app": "^10.0.1",
-    "copy-webpack-plugin": "^10.2.4",
-    "cspell": "^5.20.0",
-    "dotenv": "^16.0.0",
+    "copy-webpack-plugin": "^11.0.0",
+    "cspell": "^6.4.2",
+    "dotenv": "^16.0.1",
     "dotenv-expand": "^8.0.3",
-    "dotenv-webpack": "^7.1.0",
+    "dotenv-webpack": "^8.0.0",
     "enzyme": "^3.11.0",
     "enzyme-to-json": "^3.6.2",
-    "eslint": "8.14.0",
+    "eslint": "8.20.0",
     "eslint-config-airbnb": "^19.0.4",
     "eslint-config-prettier": "^8.5.0",
     "eslint-config-react-app": "^7.0.1",
     "eslint-plugin-flowtype": "^8.0.3",
-    "eslint-plugin-import": "^2.25.4",
-    "eslint-plugin-jest": "^26.1.5",
-    "eslint-plugin-jsdoc": "^39.2.9",
+    "eslint-plugin-import": "^2.26.0",
+    "eslint-plugin-jest": "^26.6.0",
+    "eslint-plugin-jsdoc": "^39.3.3",
     "eslint-plugin-json": "^3.1.0",
     "eslint-plugin-jsx-a11y": "^6.5.1",
-    "eslint-plugin-prettier": "^4.0.0",
+    "eslint-plugin-prettier": "^4.2.1",
     "eslint-plugin-react": "^7.28.0",
     "eslint-plugin-react-hooks": "^4.3.0",
-    "eslint-webpack-plugin": "^3.1.1",
+    "eslint-webpack-plugin": "^3.2.0",
     "express": "^4.18.1",
-    "glob": "^8.0.1",
-    "jest": "27.5.1",
-    "jest-resolve": "28.0.3",
-    "jest-watch-typeahead": "1.1.0",
+    "glob": "^8.0.3",
+    "jest": "28.1.3",
+    "jest-environment-jsdom": "28.1.3",
+    "jest-resolve": "28.1.3",
+    "jest-watch-typeahead": "2.0.0",
     "moxios": "^0.4.0",
-    "npm-check-updates": "^12.5.11",
+    "npm-check-updates": "^16.0.1",
     "npm-run-all": "^4.1.5",
-    "prettier": "^2.6.2",
+    "prettier": "^2.7.1",
     "redux-mock-store": "^1.5.4",
-    "standard-version": "^9.3.2",
-    "swagger-ui-express": "^4.3.0",
+    "standard-version": "^9.5.0",
+    "swagger-ui-express": "^4.5.0",
     "webpack-bundle-analyzer": "^4.5.0",
     "yamljs": "^0.3.0"
   }

diff --git a/scripts/dependencies.sh b/scripts/dependencies.sh
@@ -8,6 +8,10 @@
   YELLOW="\e[33m"
   NOCOLOR="\e[39m"
 
+  echo "Reset existing build dependencies..."
+  rm -rf -- ./node_modules
+  yarn install
+
   echo "Confirm and update build dependencies..."
 
   DEPS_UPDATE=$(ncu "$@");

diff --git a/src/components/chart/__tests__/__snapshots__/chartElements.test.js.snap b/src/components/chart/__tests__/__snapshots__/chartElements.test.js.snap
@@ -126,7 +126,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
       <line
         role="presentation"
         shape-rendering="auto"
-        style="stroke:#d2d2d2;fill:transparent;stroke-width:1;stroke-linecap:round;stroke-linejoin:round"
+        style="stroke:var(--pf-chart-axis--axis--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--axis--Fill, transparent);stroke-width:1;stroke-linecap:round;stroke-linejoin:round"
         vector-effect="non-scaling-stroke"
         x1="50"
         x2="400"
@@ -139,7 +139,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="120"
           x2="120"
@@ -156,7 +156,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="middle"
             x="120"
           >
@@ -170,7 +170,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="190"
           x2="190"
@@ -187,7 +187,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="middle"
             x="190"
           >
@@ -201,7 +201,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="260"
           x2="260"
@@ -218,7 +218,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="middle"
             x="260"
           >
@@ -232,7 +232,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="330"
           x2="330"
@@ -249,7 +249,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="middle"
             x="330"
           >
@@ -263,7 +263,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="400"
           x2="400"
@@ -280,7 +280,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="middle"
             x="400"
           >
@@ -295,7 +295,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
       <line
         role="presentation"
         shape-rendering="auto"
-        style="stroke:#d2d2d2;fill:transparent;stroke-width:1;stroke-linecap:round;stroke-linejoin:round"
+        style="stroke:var(--pf-chart-axis--axis--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--axis--Fill, transparent);stroke-width:1;stroke-linecap:round;stroke-linejoin:round"
         vector-effect="non-scaling-stroke"
         x1="50"
         x2="50"
@@ -308,7 +308,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="50"
           x2="45"
@@ -325,7 +325,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="end"
             x="35"
           >
@@ -339,7 +339,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="50"
           x2="45"
@@ -356,7 +356,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="end"
             x="35"
           >
@@ -370,7 +370,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="50"
           x2="45"
@@ -387,7 +387,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="end"
             x="35"
           >
@@ -401,7 +401,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="50"
           x2="45"
@@ -418,7 +418,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="end"
             x="35"
           >
@@ -432,7 +432,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
         <line
           role="presentation"
           shape-rendering="auto"
-          style="stroke:#d2d2d2;fill:transparent;size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
+          style="stroke:var(--pf-chart-axis--tick--stroke--Color, #d2d2d2);fill:var(--pf-chart-axis--tick--Fill, transparent);size:5px;stroke-linecap:round;stroke-linejoin:round;stroke-width:1"
           vector-effect="non-scaling-stroke"
           x1="50"
           x2="45"
@@ -449,7 +449,7 @@ exports[`ChartElements Component should render a basic component: basic 1`] = `
           <tspan
             dx="0"
             dy="0"
-            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:transparent;fill:#4f5255"
+            style="font-family:\\"RedHatText\\",\\"Overpass\\",overpass,helvetica,arial,sans-serif;font-size:14px;letter-spacing:normal;padding:10px;stroke:var(--pf-chart-global--label--stroke, transparent);fill:var(--pf-chart-axis--tick-label--Fill, #4f5255)"
             text-anchor="end"
             x="35"
           >