Merge branch 'master' into renovate/style-loader-3.x

extension/.babelrc

@@ -4,5 +4,5 @@
     "@babel/preset-react",
     "@babel/preset-typescript"
   ],
-  "plugins": [["@babel/plugin-proposal-class-properties"]]
+  "plugins": ["@babel/plugin-proposal-class-properties"]
 }

extension/package.json

@@ -32,6 +32,7 @@
     "type-check": "tsc --noEmit"
   },
   "dependencies": {
+    "@babel/polyfill": "^7.12.1",
     "@redux-devtools/app": "^1.0.0-8",
     "@redux-devtools/core": "^3.9.0",
     "@redux-devtools/instrument": "^1.11.0",
@@ -49,8 +50,6 @@
     "redux": "^4.1.1"
   },
   "devDependencies": {
-    "@babel/plugin-proposal-decorators": "^7.14.5",
-    "@babel/polyfill": "^7.12.1",
     "@babel/register": "^7.15.3",
     "bestzip": "^2.2.0",
     "chromedriver": "^91.0.1",
@@ -64,6 +63,7 @@
     "eslint-plugin-react": "^7.24.0",
     "eslint-plugin-react-hooks": "^4.2.0",
     "gitbook-cli": "^2.3.2",
+    "path-browserify": "^1.0.1",
     "react-transform-catch-errors": "^1.0.2",
     "react-transform-hmr": "^1.0.4",
     "selenium-webdriver": "^3.6.0",

extension/webpack/base.config.js

@@ -31,12 +31,7 @@ const baseConfig = (params) => ({
   },
   plugins: [
     new webpack.DefinePlugin(params.globals),
-    ...(params.plugins
-      ? params.plugins
-      : [
-          new webpack.optimize.ModuleConcatenationPlugin(),
-          new webpack.optimize.OccurrenceOrderPlugin(),
-        ]),
+    ...(params.plugins ? params.plugins : []),
   ].concat(
     params.copy
       ? new CopyPlugin({
@@ -65,6 +60,9 @@ const baseConfig = (params) => ({
       tmp: path.join(__dirname, '../build/tmp'),
     },
     extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    fallback: {
+      path: require.resolve('path-browserify'),
+    },
   },
   module: {
     rules: [

package.json

@@ -10,8 +10,8 @@
     "@babel/preset-typescript": "^7.15.0",
     "@types/jest": "^27.0.1",
     "@types/node": "^14.17.12",
-    "@types/webpack": "^4.41.30",
-    "@types/webpack-dev-server": "^3.11.6",
+    "@types/webpack": "^5.28.0",
+    "@types/webpack-dev-server": "^4.0.3",
     "@types/webpack-env": "^1.16.2",
     "@typescript-eslint/eslint-plugin": "^4.29.3",
     "@typescript-eslint/parser": "^4.29.3",
@@ -46,9 +46,9 @@
     "ts-node": "^10.2.1",
     "typescript": "^4.3.5",
     "url-loader": "^4.1.1",
-    "webpack": "^4.46.0",
+    "webpack": "^5.51.1",
     "webpack-cli": "^4.8.0",
-    "webpack-dev-server": "^3.11.2"
+    "webpack-dev-server": "^4.0.0"
   },
   "scripts": {
     "lerna": "lerna",

packages/redux-devtools-app/package.json

@@ -20,7 +20,7 @@
     "url": "https://github.com/reduxjs/redux-devtools.git"
   },
   "scripts": {
-    "start": "webpack-dev-server --hot --inline --env development --env platform=web --progress",
+    "start": "webpack-dev-server --hot --env development --env platform=web --progress",
     "build": "npm run build:types && npm run build:js && npm run build:web && npm run build:umd && npm run build:umd:min",
     "build:types": "tsc --emitDeclarationOnly",
     "build:js": "babel src --out-dir lib --extensions \".ts,.tsx\" --source-maps inline",
@@ -69,6 +69,7 @@
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.6",
     "enzyme-to-json": "^3.6.2",
+    "path-browserify": "^1.0.1",
     "react": "^16.14.0",
     "react-dom": "^16.14.0"
   },

packages/redux-devtools-app/webpack.config.ts

@@ -47,6 +47,9 @@ module.exports = (env: { development?: boolean; platform?: string } = {}) => ({
   },
   resolve: {
     extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    fallback: {
+      path: require.resolve('path-browserify'),
+    },
   },
   plugins: [
     new webpack.DefinePlugin({

packages/redux-devtools-app/webpack.config.umd.ts

@@ -44,11 +44,13 @@ module.exports = (env: { production?: boolean } = {}) => ({
   },
   resolve: {
     extensions: ['.js', '.jsx', '.ts', '.tsx'],
+    fallback: {
+      path: require.resolve('path-browserify'),
+    },
   },
   plugins: [
     new webpack.DefinePlugin({
       'process.env': {
-        NODE_ENV: JSON.stringify('production'),
         PLATFORM: JSON.stringify('web'),
       },
     }),

packages/redux-devtools-inspector-monitor-trace-tab/src/react-error-overlay/containers/StackFrameCodeBlock.tsx

@@ -12,7 +12,7 @@ import { absolutifyCaret } from '../utils/dom/absolutifyCaret';
 import { ScriptLine } from '../utils/stack-frame';
 import generateAnsiHTML from '../utils/generateAnsiHTML';
 
-import { codeFrameColumns } from '@babel/code-frame';
+// import { codeFrameColumns } from '@babel/code-frame';
 import { nicinabox as theme } from 'redux-devtools-themes';
 
 interface StackFrameCodeBlockPropsType {
@@ -48,24 +48,25 @@ function StackFrameCodeBlock(props: StackFrameCodeBlockPropsType) {
     }
     sourceCode[line - 1] = text;
   });
-  const ansiHighlight = codeFrameColumns(
-    sourceCode.join('\n'),
-    {
-      start: {
-        line: lineNum,
-        column:
-          columnNum == null
-            ? 0
-            : columnNum - (isFinite(whiteSpace) ? whiteSpace : 0),
-      },
-    },
-    {
-      forceColor: true,
-      linesAbove: contextSize,
-      linesBelow: contextSize,
-    }
-  );
-  const htmlHighlight = generateAnsiHTML(ansiHighlight);
+  // const ansiHighlight = codeFrameColumns(
+  //   sourceCode.join('\n'),
+  //   {
+  //     start: {
+  //       line: lineNum,
+  //       column:
+  //         columnNum == null
+  //           ? 0
+  //           : columnNum - (isFinite(whiteSpace) ? whiteSpace : 0),
+  //     },
+  //   },
+  //   {
+  //     forceColor: true,
+  //     linesAbove: contextSize,
+  //     linesBelow: contextSize,
+  //   }
+  // );
+  // const htmlHighlight = generateAnsiHTML(ansiHighlight);
+  const htmlHighlight = generateAnsiHTML(sourceCode.join('\n'));
   const code = document.createElement('code');
   code.innerHTML = htmlHighlight;
   absolutifyCaret(code);

renovate.json

@@ -1,4 +1,5 @@
 {
   "extends": ["config:base", "group:allNonMajor", ":maintainLockFilesWeekly"],
-  "rangeStrategy": "bump"
+  "rangeStrategy": "bump",
+  "rebaseWhen": "conflicted"
 }