chore(test-tab): fix demo build (#891)

* stash

* stash

package.json

@@ -27,6 +27,7 @@
     "packages/redux-devtools/examples/counter",
     "packages/redux-devtools/examples/todomvc",
     "packages/redux-devtools-inspector-monitor/demo",
+    "packages/redux-devtools-inspector-monitor-test-tab/demo",
     "packages/redux-devtools-slider-monitor/examples/todomvc"
   ],
   "resolutions": {

packages/redux-devtools-inspector-monitor-test-tab/.eslintignore

@@ -1 +1,2 @@
+demo
 lib

packages/redux-devtools-inspector-monitor-test-tab/demo/.eslintignore

@@ -0,0 +1 @@
+dist

packages/redux-devtools-inspector-monitor-test-tab/demo/.eslintrc.js

@@ -0,0 +1,17 @@
+module.exports = {
+  extends: '../../../eslintrc.ts.react.base.json',
+  parserOptions: {
+    tsconfigRootDir: __dirname,
+    project: ['./tsconfig.json'],
+  },
+  overrides: [
+    {
+      files: ['webpack.config.ts'],
+      extends: '../../../eslintrc.ts.base.json',
+      parserOptions: {
+        tsconfigRootDir: __dirname,
+        project: ['./tsconfig.webpack.json'],
+      },
+    },
+  ],
+};

packages/redux-devtools-inspector-monitor-test-tab/demo/config/webpack.config.ts

@@ -1,73 +0,0 @@
-import * as path from 'path';
-import * as webpack from 'webpack';
-import HtmlWebpackPlugin from 'html-webpack-plugin';
-import { CleanWebpackPlugin } from 'clean-webpack-plugin';
-import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
-import pkg from '../../package.json';
-
-const isProduction = process.env.NODE_ENV === 'production';
-
-module.exports = {
-  mode: process.env.NODE_ENV || 'development',
-  entry: isProduction
-    ? ['./demo/src/js/index']
-    : [
-        'webpack-dev-server/client?http://localhost:3000',
-        'webpack/hot/only-dev-server',
-        './demo/src/js/index',
-      ],
-  output: {
-    path: path.join(__dirname, 'demo/dist'),
-    filename: 'js/bundle.js',
-  },
-  module: {
-    rules: [
-      {
-        test: /\.(js|ts)x?$/,
-        loader: 'babel-loader',
-        include: [
-          path.join(__dirname, '../../src'),
-          path.join(__dirname, '../src/js'),
-        ],
-      },
-      {
-        test: /\.css$/,
-        use: [{ loader: 'style-loader' }, { loader: 'css-loader' }],
-      },
-      {
-        test: /\.(ttf|eot|svg|woff|woff2)$/,
-        loader: 'file-loader',
-        options: { outputPath: 'fonts/', publicPath: 'fonts/' },
-      },
-    ],
-  },
-  resolve: {
-    extensions: ['.js', '.jsx', '.ts', '.tsx'],
-  },
-  plugins: [
-    new CleanWebpackPlugin(),
-    new HtmlWebpackPlugin({
-      inject: true,
-      template: 'demo/src/index.html',
-      package: pkg,
-    }),
-    new ForkTsCheckerWebpackPlugin({
-      typescript: {
-        configFile: 'demo/tsconfig.json',
-      },
-    }),
-  ].concat(isProduction ? [] : [new webpack.HotModuleReplacementPlugin()]),
-  devServer: isProduction
-    ? null
-    : {
-        quiet: false,
-        port: 3001,
-        hot: true,
-        stats: {
-          chunkModules: false,
-          colors: true,
-        },
-        historyApiFallback: true,
-      },
-  devtool: 'eval-source-map',
-};

packages/redux-devtools-inspector-monitor-test-tab/demo/package.json

@@ -0,0 +1,60 @@
+{
+  "private": true,
+  "name": "test-demo",
+  "version": "0.1.0",
+  "license": "MIT",
+  "scripts": {
+    "start": "webpack serve --open",
+    "build": "webpack",
+    "lint": "eslint . --ext .ts,.tsx",
+    "type-check": "tsc --noEmit"
+  },
+  "dependencies": {
+    "@redux-devtools/core": "^3.9.0",
+    "@redux-devtools/dock-monitor": "^1.4.0",
+    "@redux-devtools/inspector-monitor": "^1.0.0",
+    "@redux-devtools/inspector-monitor-test-tab": "^0.7.2",
+    "@redux-devtools/ui": "^1.0.0-9",
+    "connected-react-router": "^6.9.1",
+    "history": "^4.10.1",
+    "immutable": "^4.0.0-rc.15",
+    "lodash.shuffle": "^4.2.0",
+    "react": "^16.14.0",
+    "react-dom": "^16.14.0",
+    "react-redux": "^7.2.5",
+    "react-router": "^5.2.1",
+    "redux": "^4.1.1",
+    "redux-logger": "^3.0.6"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.15.5",
+    "@babel/preset-env": "^7.15.6",
+    "@babel/preset-react": "^7.14.5",
+    "@babel/preset-typescript": "^7.15.0",
+    "@types/history": "^4.7.9",
+    "@types/lodash.shuffle": "^4.2.6",
+    "@types/node": "^14.17.17",
+    "@types/react": "^16.14.15",
+    "@types/react-dom": "^16.9.14",
+    "@types/react-redux": "^7.1.18",
+    "@types/react-router": "^5.1.16",
+    "@types/redux-logger": "^3.0.9",
+    "@types/webpack": "^5.28.0",
+    "@types/webpack-dev-server": "^4.1.0",
+    "@typescript-eslint/eslint-plugin": "^4.31.2",
+    "@typescript-eslint/parser": "^4.31.2",
+    "babel-loader": "^8.2.2",
+    "css-loader": "^6.3.0",
+    "eslint": "^7.32.0",
+    "eslint-config-prettier": "^8.3.0",
+    "eslint-plugin-react": "^7.25.3",
+    "fork-ts-checker-webpack-plugin": "^6.3.3",
+    "html-webpack-plugin": "^5.3.2",
+    "style-loader": "^3.2.1",
+    "ts-node": "^10.2.1",
+    "typescript": "~4.3.5",
+    "webpack": "^5.53.0",
+    "webpack-cli": "^4.8.0",
+    "webpack-dev-server": "^4.2.1"
+  }
+}

packages/redux-devtools-inspector-monitor-test-tab/demo/src/DemoApp.tsx

@@ -2,7 +2,7 @@ import React, { CSSProperties } from 'react';
 import { connect } from 'react-redux';
 import { Button, Toolbar, Spacer } from '@redux-devtools/ui';
 import { push as pushRoute } from 'connected-react-router';
-import pkg from '../../../package.json';
+import pkg from '@redux-devtools/inspector-monitor-test-tab/package.json';
 import getOptions from './getOptions';
 import { DemoAppState } from './reducers';
 import {

packages/redux-devtools-inspector-monitor-test-tab/demo/src/DevTools.tsx

@@ -8,7 +8,7 @@ import InspectorMonitor, {
 import DockMonitor from '@redux-devtools/dock-monitor';
 import { Location } from 'history';
 import getOptions from './getOptions';
-import TestGenerator from '../../../src';
+import TestGenerator from '@redux-devtools/inspector-monitor-test-tab';
 import { DemoAppState } from './reducers';
 import { Action } from 'redux';
 

packages/redux-devtools-inspector-monitor-test-tab/demo/src/index.tsx

@@ -1,4 +1,3 @@
-import '@redux-devtools/ui/lib/presets';
 import React from 'react';
 import { render } from 'react-dom';
 import { Container } from '@redux-devtools/ui';

packages/redux-devtools-inspector-monitor-test-tab/demo/src/reducers.ts

@@ -24,7 +24,10 @@ const NESTED = {
   },
 };
 
-const IMMUTABLE_NESTED = Immutable.fromJS(NESTED);
+const IMMUTABLE_NESTED = Immutable.fromJS(NESTED) as Immutable.Map<
+  unknown,
+  unknown
+>;
 
 const IMMUTABLE_MAP = Immutable.Map({
   map: Immutable.Map({ a: 1, b: 2, c: 3 }),
@@ -216,7 +219,7 @@ const createRootReducer = (
       action.type === 'CHANGE_IMMUTABLE_NESTED'
         ? state.updateIn(
             ['long', 'nested', 0, 'path', 'to', 'a'],
-            (str: string) => str + '!'
+            (str: unknown) => (str as string) + '!'
           )
         : state,
     addFunction: (state = null, action) =>

packages/redux-devtools-inspector-monitor-test-tab/demo/tsconfig.webpack.json

@@ -1,5 +1,5 @@
 {
-  "extends": "../../../../tsconfig.base.json",
+  "extends": "../../../tsconfig.base.json",
   "compilerOptions": {
     "resolveJsonModule": true
   },

packages/redux-devtools-inspector-monitor-test-tab/demo/webpack.config.ts

@@ -0,0 +1,50 @@
+import * as path from 'path';
+import HtmlWebpackPlugin from 'html-webpack-plugin';
+import ForkTsCheckerWebpackPlugin from 'fork-ts-checker-webpack-plugin';
+import pkg from '@redux-devtools/inspector-monitor-test-tab/package.json';
+
+module.exports = {
+  mode: 'development',
+  entry: './src/index.tsx',
+  devtool: 'eval-source-map',
+  devServer: {
+    static: './dist',
+  },
+  plugins: [
+    new HtmlWebpackPlugin({
+      template: './index.html',
+      package: pkg,
+    }),
+    new ForkTsCheckerWebpackPlugin(),
+  ],
+  output: {
+    filename: 'bundle.js',
+    path: path.join(__dirname, 'dist'),
+    clean: true,
+  },
+  module: {
+    rules: [
+      {
+        test: /\.(js|ts)x?$/,
+        exclude: /node_modules/,
+        use: {
+          loader: 'babel-loader',
+          options: {
+            presets: [
+              ['@babel/preset-env', { targets: 'defaults' }],
+              '@babel/preset-react',
+              '@babel/preset-typescript',
+            ],
+          },
+        },
+      },
+      {
+        test: /\.css$/i,
+        use: ['style-loader', 'css-loader'],
+      },
+    ],
+  },
+  resolve: {
+    extensions: ['.js', '.jsx', '.ts', '.tsx'],
+  },
+};

packages/redux-devtools-inspector-monitor-test-tab/package.json

@@ -29,7 +29,6 @@
     "url": "https://github.com/reduxjs/redux-devtools.git"
   },
   "scripts": {
-    "start": "webpack serve --config demo/config/webpack.config.ts",
     "build": "yarn run build:types && yarn run build:js",
     "build:types": "tsc --emitDeclarationOnly",
     "build:js": "babel src --out-dir lib --extensions \".ts,.tsx\" --source-maps inline",
@@ -60,28 +59,17 @@
     "@babel/preset-react": "^7.14.5",
     "@babel/preset-typescript": "^7.15.0",
     "@redux-devtools/core": "^3.9.0",
-    "@redux-devtools/dock-monitor": "^1.4.0",
     "@redux-devtools/inspector-monitor": "^1.0.0",
     "@types/enzyme": "^3.10.9",
     "@types/enzyme-adapter-react-16": "^1.0.6",
     "@types/es6template": "^1.0.0",
-    "@types/history": "^4.7.9",
     "@types/jest": "^27.0.1",
     "@types/jsan": "^3.1.2",
-    "@types/lodash.shuffle": "^4.2.6",
-    "@types/node": "^14.17.17",
     "@types/object-path": "^0.11.1",
     "@types/react": "^16.14.15",
-    "@types/react-router": "^5.1.16",
-    "@types/redux-logger": "^3.0.9",
     "@types/simple-diff": "^1.6.1",
-    "@types/webpack": "^5.28.0",
-    "@types/webpack-dev-server": "^4.1.0",
     "@typescript-eslint/eslint-plugin": "^4.31.2",
     "@typescript-eslint/parser": "^4.31.2",
-    "babel-loader": "^8.2.2",
-    "clean-webpack-plugin": "^4.0.0",
-    "connected-react-router": "^6.9.1",
     "enzyme": "^3.11.0",
     "enzyme-adapter-react-16": "^1.15.6",
     "enzyme-to-json": "^3.6.2",
@@ -89,26 +77,13 @@
     "eslint-config-prettier": "^8.3.0",
     "eslint-plugin-jest": "^24.4.2",
     "eslint-plugin-react": "^7.25.3",
-    "fork-ts-checker-webpack-plugin": "^6.3.3",
-    "history": "^4.10.1",
-    "html-webpack-plugin": "^5.3.2",
-    "immutable": "^4.0.0-rc.15",
     "jest": "^27.2.1",
-    "lodash.shuffle": "^4.2.0",
     "react": "^16.14.0",
     "react-dom": "^16.14.0",
-    "react-redux": "^7.2.5",
-    "react-router": "^5.2.1",
     "redux": "^4.1.1",
-    "redux-logger": "^3.0.6",
     "rimraf": "^3.0.2",
-    "seamless-immutable": "^7.1.4",
     "ts-jest": "^27.0.5",
-    "ts-node": "^10.2.1",
+    "typescript": "~4.3.5"
-    "typescript": "~4.3.5",
-    "webpack": "^5.53.0",
-    "webpack-cli": "^4.8.0",
-    "webpack-dev-server": "^4.2.1"
   },
   "peerDependencies": {
     "@redux-devtools/inspector-monitor": "^1.0.0",

packages/redux-devtools-inspector-monitor/demo/package.json

@@ -24,12 +24,7 @@
     "react-redux": "^7.2.5",
     "react-router": "^5.2.1",
     "redux": "^4.1.1",
-    "redux-logger": "^3.0.6",
+    "redux-logger": "^3.0.6"
-    "seamless-immutable": "^7.1.4",
-    "ts-node": "^10.2.1",
-    "webpack": "^5.53.0",
-    "webpack-cli": "^4.8.0",
-    "webpack-dev-server": "^4.2.1"
   },
   "devDependencies": {
     "@babel/core": "^7.15.5",
@@ -55,6 +50,10 @@
     "eslint-plugin-react": "^7.25.3",
     "fork-ts-checker-webpack-plugin": "^6.3.3",
     "html-webpack-plugin": "^5.3.2",
-    "typescript": "~4.3.5"
+    "ts-node": "^10.2.1",
+    "typescript": "~4.3.5",
+    "webpack": "^5.53.0",
+    "webpack-cli": "^4.8.0",
+    "webpack-dev-server": "^4.2.1"
   }
 }

yarn.lock

@@ -4732,30 +4732,19 @@ __metadata:
     "@babel/preset-typescript": ^7.15.0
     "@babel/runtime": ^7.15.4
     "@redux-devtools/core": ^3.9.0
-    "@redux-devtools/dock-monitor": ^1.4.0
     "@redux-devtools/inspector-monitor": ^1.0.0
     "@redux-devtools/ui": ^1.0.0-9
     "@types/enzyme": ^3.10.9
     "@types/enzyme-adapter-react-16": ^1.0.6
     "@types/es6template": ^1.0.0
-    "@types/history": ^4.7.9
     "@types/jest": ^27.0.1
     "@types/jsan": ^3.1.2
-    "@types/lodash.shuffle": ^4.2.6
-    "@types/node": ^14.17.17
     "@types/object-path": ^0.11.1
     "@types/prop-types": ^15.7.4
     "@types/react": ^16.14.15
-    "@types/react-router": ^5.1.16
-    "@types/redux-logger": ^3.0.9
     "@types/simple-diff": ^1.6.1
-    "@types/webpack": ^5.28.0
-    "@types/webpack-dev-server": ^4.1.0
     "@typescript-eslint/eslint-plugin": ^4.31.2
     "@typescript-eslint/parser": ^4.31.2
-    babel-loader: ^8.2.2
-    clean-webpack-plugin: ^4.0.0
-    connected-react-router: ^6.9.1
     enzyme: ^3.11.0
     enzyme-adapter-react-16: ^1.15.6
     enzyme-to-json: ^3.6.2
@@ -4764,32 +4753,19 @@ __metadata:
     eslint-config-prettier: ^8.3.0
     eslint-plugin-jest: ^24.4.2
     eslint-plugin-react: ^7.25.3
-    fork-ts-checker-webpack-plugin: ^6.3.3
-    history: ^4.10.1
-    html-webpack-plugin: ^5.3.2
-    immutable: ^4.0.0-rc.15
     javascript-stringify: ^2.1.0
     jest: ^27.2.1
     jsan: ^3.1.13
-    lodash.shuffle: ^4.2.0
     object-path: ^0.11.8
     prop-types: ^15.7.2
     react: ^16.14.0
     react-dom: ^16.14.0
     react-icons: ^4.2.0
-    react-redux: ^7.2.5
-    react-router: ^5.2.1
     redux: ^4.1.1
-    redux-logger: ^3.0.6
     rimraf: ^3.0.2
-    seamless-immutable: ^7.1.4
     simple-diff: ^1.6.0
     ts-jest: ^27.0.5
-    ts-node: ^10.2.1
     typescript: ~4.3.5
-    webpack: ^5.53.0
-    webpack-cli: ^4.8.0
-    webpack-dev-server: ^4.2.1
   peerDependencies:
     "@redux-devtools/inspector-monitor": ^1.0.0
     "@types/react": ^16.3.0 || ^17.0.0
@@ -17178,7 +17154,6 @@ fsevents@^1.2.7:
     react-router: ^5.2.1
     redux: ^4.1.1
     redux-logger: ^3.0.6
-    seamless-immutable: ^7.1.4
     ts-node: ^10.2.1
     typescript: ~4.3.5
     webpack: ^5.53.0
@@ -26421,7 +26396,7 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
-"seamless-immutable@npm:^7.1.3, seamless-immutable@npm:^7.1.4":
+"seamless-immutable@npm:^7.1.3":
   version: 7.1.4
   resolution: "seamless-immutable@npm:7.1.4"
   checksum: f65c1dc12e460265ccc4b164085b807570f9fb8a619cd3c216fc7ed933fb09c57a24a7df1b638dc9bd6367d8d69c2f00b5370b0c0996b4046242539096d2d0c6
@@ -28454,6 +28429,57 @@ resolve@^2.0.0-next.3:
   languageName: node
   linkType: hard
 
+"test-demo@workspace:packages/redux-devtools-inspector-monitor-test-tab/demo":
+  version: 0.0.0-use.local
+  resolution: "test-demo@workspace:packages/redux-devtools-inspector-monitor-test-tab/demo"
+  dependencies:
+    "@babel/core": ^7.15.5
+    "@babel/preset-env": ^7.15.6
+    "@babel/preset-react": ^7.14.5
+    "@babel/preset-typescript": ^7.15.0
+    "@redux-devtools/core": ^3.9.0
+    "@redux-devtools/dock-monitor": ^1.4.0
+    "@redux-devtools/inspector-monitor": ^1.0.0
+    "@redux-devtools/inspector-monitor-test-tab": ^0.7.2
+    "@redux-devtools/ui": ^1.0.0-9
+    "@types/history": ^4.7.9
+    "@types/lodash.shuffle": ^4.2.6
+    "@types/node": ^14.17.17
+    "@types/react": ^16.14.15
+    "@types/react-dom": ^16.9.14
+    "@types/react-redux": ^7.1.18
+    "@types/react-router": ^5.1.16
+    "@types/redux-logger": ^3.0.9
+    "@types/webpack": ^5.28.0
+    "@types/webpack-dev-server": ^4.1.0
+    "@typescript-eslint/eslint-plugin": ^4.31.2
+    "@typescript-eslint/parser": ^4.31.2
+    babel-loader: ^8.2.2
+    connected-react-router: ^6.9.1
+    css-loader: ^6.3.0
+    eslint: ^7.32.0
+    eslint-config-prettier: ^8.3.0
+    eslint-plugin-react: ^7.25.3
+    fork-ts-checker-webpack-plugin: ^6.3.3
+    history: ^4.10.1
+    html-webpack-plugin: ^5.3.2
+    immutable: ^4.0.0-rc.15
+    lodash.shuffle: ^4.2.0
+    react: ^16.14.0
+    react-dom: ^16.14.0
+    react-redux: ^7.2.5
+    react-router: ^5.2.1
+    redux: ^4.1.1
+    redux-logger: ^3.0.6
+    style-loader: ^3.2.1
+    ts-node: ^10.2.1
+    typescript: ~4.3.5
+    webpack: ^5.53.0
+    webpack-cli: ^4.8.0
+    webpack-dev-server: ^4.2.1
+  languageName: unknown
+  linkType: soft
+
 "test-exclude@npm:^6.0.0":
   version: 6.0.0
   resolution: "test-exclude@npm:6.0.0"