Printing watched files causes FE recompilation

TouK · Jul 9, 2021 · 9510290 · 9510290
1 parent e0ae40f
commit 9510290
Show file tree

Hide file tree

Showing 3 changed files with 21 additions and 10 deletions.
diff --git a/ui/client/README.md b/ui/client/README.md
@@ -110,7 +110,7 @@ npm run test:e2e:linux
 ### Fixing cypress tests
 
 After some changes in frontend it might be needed to rewrite captured image snapshots. The easiest way is to:
-1. Run cypress tests using "Run cypress tests using unified linux environment" method (TODO: updateSnapshots = true)
+1. Run cypress tests using "Run cypress tests using unified linux environment" method
 2. Review changes in files e.g. using Intellij Idea changes diff
 3. Commit changes or do fixes in scenarios.
 

diff --git a/ui/client/package.json b/ui/client/package.json
@@ -22,9 +22,9 @@
     "pretest": "npm run check",
     "test:unit": "jest",
     "test:e2e": "cypress run",
+    "test:e2e:dev": "cypress open",
     "test:e2e:linux": "docker run --add-host=host.docker.internal:host-gateway -it -v $PWD:/client -w /client cypress/included:6.8.0 --config baseUrl=http://host.docker.internal:3000",
     "test:e2e:docker": "start-server-and-test start:backend-docker http-get://localhost:3000/static/main.html test:e2e:linux",
-    "test:e2e:dev": "cypress open",
     "coverage": "npx merge-cypress-jest-coverage",
     "commit": "lint-staged"
   },

diff --git a/ui/client/webpack.config.js b/ui/client/webpack.config.js
@@ -20,12 +20,6 @@ const GIT_HASH = childProcess.execSync("git log -1 --format=%H").toString()
 const GIT_DATE = childProcess.execSync("git log -1 --format=%cd").toString()
 const isProd = NODE_ENV === "production"
 
-const smp = new SpeedMeasurePlugin({
-  disable: true,
-  outputFormat: "humanVerbose",
-  loaderTopFiles: 5,
-})
-
 const {ModuleFederationPlugin} = webpack.container
 const {name} = require("./package.json")
 const entry = {
@@ -53,7 +47,23 @@ const fileLoader = {
   },
 }
 
-module.exports = smp.wrap({
+// From https://stackoverflow.com/a/64564708 - to monitor changed files
+class WatchRunPlugin {
+  apply(compiler) {
+    compiler.hooks.watchRun.tap('WatchRun', (comp) => {
+      if (comp.modifiedFiles) {
+        const changedFiles = Array.from(comp.modifiedFiles, (file) => `\n  ${file}`).join('');
+        const removedFiles = Array.from(comp.removedFiles, (file) => `\n  ${file}`).join('');
+        console.log('===============================');
+        console.log('FILES CHANGED:', changedFiles);
+        console.log('FILES REMOVED:', removedFiles);
+        console.log('===============================');
+      }
+    });
+  }
+}
+
+module.exports = {
   mode: NODE_ENV,
   optimization: {
     splitChunks: {
@@ -184,6 +194,7 @@ module.exports = smp.wrap({
     new ForkTsCheckerWebpackPlugin(),
     isProd ? null : new ReactRefreshWebpackPlugin(),
     new webpack.ProgressPlugin(progressBar),
+    new WatchRunPlugin()
   ].filter(Boolean),
   module: {
     rules: [
@@ -303,4 +314,4 @@ module.exports = smp.wrap({
       },
     ],
   },
-})
+}