fix: add compilation lifecycle in watch instance (#1903)

webpack · Oct 10, 2020 · 02b6d21 · 02b6d21
1 parent ceaeefb
commit 02b6d21
Show file tree

Hide file tree

Showing 3 changed files with 54 additions and 7 deletions.
diff --git a/package.json b/package.json
@@ -36,7 +36,7 @@
     "prepsuite": "node scripts/prepareSuite.js",
     "pretest": "yarn build && yarn lint && yarn prepsuite",
     "test": "jest --reporters=default --reporters=jest-junit",
-    "test:cli": "jest test/ --reporters=default --reporters=jest-junit --forceExit",
+    "test:cli": "jest test --reporters=default --reporters=jest-junit --forceExit",
     "test:packages": "jest packages/ --reporters=default --reporters=jest-junit --forceExit",
     "test:ci": "yarn test:cli && yarn test:packages",
     "test:watch": "jest test/ packages/ --watch",

diff --git a/packages/webpack-cli/lib/utils/Compiler.js b/packages/webpack-cli/lib/utils/Compiler.js
@@ -4,6 +4,27 @@ const logger = require('./logger');
 const { writeFileSync } = require('fs');
 const bailAndWatchWarning = require('./warnings/bailAndWatchWarning');
 
+const assignWatchHooks = (compiler) => {
+    compiler.hooks.watchRun.tap('watchInfo', (compilation) => {
+        const compilationName = compilation.name || '';
+        logger.raw(`\nCompilation ${compilationName} starting…\n`);
+    });
+    compiler.hooks.done.tap('watchInfo', (compilation) => {
+        const compilationName = compilation.name || '';
+        logger.raw(`\nCompilation ${compilationName} finished\n`);
+    });
+};
+
+const watchInfo = (compiler) => {
+    if (compiler.compilers) {
+        compiler.compilers.map((comp) => {
+            assignWatchHooks(comp);
+        });
+    } else {
+        assignWatchHooks(compiler);
+    }
+};
+
 class Compiler {
     constructor() {
         this.compilerOptions = {};
@@ -151,6 +172,7 @@ class Compiler {
                 });
                 process.stdin.resume();
             }
+            watchInfo(this.compiler);
             await this.invokeWatchInstance(lastHash, options, outputOptions, watchOptions);
         } else {
             return await this.invokeCompilerInstance(lastHash, options, outputOptions);

diff --git a/test/watch/watch-flag.test.js b/test/watch/watch-flag.test.js
@@ -1,9 +1,8 @@
 'use strict';
 
-const { runAndGetWatchProc } = require('../utils/test-utils');
+const { runAndGetWatchProc, isWebpack5, isWindows } = require('../utils/test-utils');
 const { writeFileSync } = require('fs');
 const { resolve } = require('path');
-const { version } = require('webpack');
 
 const wordsInStatsv4 = ['Hash', 'Version', 'Time', 'Built at:', 'main.js'];
 const wordsInStatsv5 = ['asset', 'index.js', 'compiled successfully'];
@@ -14,13 +13,13 @@ describe('--watch flag', () => {
         let semaphore = 1;
         proc.stdout.on('data', (chunk) => {
             const data = chunk.toString();
-            if (semaphore === 1 && data.includes('watching files for updates')) {
+            if (data.includes('watching files for updates')) {
                 writeFileSync(resolve(__dirname, './src/index.js'), `console.log('watch flag test');`);
-                semaphore--;
+                semaphore = 0;
                 return;
             }
-            if (semaphore === 0) {
-                if (version.startsWith('5')) {
+            if (semaphore === 0 && data.includes('index.js')) {
+                if (isWebpack5) {
                     for (const word of wordsInStatsv5) {
                         expect(data).toContain(word);
                     }
@@ -36,4 +35,30 @@ describe('--watch flag', () => {
             }
         });
     });
+
+    it('should print compilation lifecycle', (done) => {
+        const proc = runAndGetWatchProc(__dirname, ['--watch'], false, '', true);
+        let semaphore = 0;
+        proc.stdout.on('data', (chunk) => {
+            const data = chunk.toString();
+            if (data.includes('Compilation  starting') || data.includes('Compilation  finished')) {
+                semaphore++;
+            }
+            // TODO Fix on windows
+            if ((isWindows || semaphore === 2) && data.includes('index.js')) {
+                if (isWebpack5) {
+                    for (const word of wordsInStatsv5) {
+                        expect(data).toContain(word);
+                    }
+                } else {
+                    for (const word of wordsInStatsv4) {
+                        expect(data).toContain(word);
+                    }
+                }
+                proc.kill();
+                done();
+                return;
+            }
+        });
+    });
 });