From 4a51af23f5304b8632706c9b3c469e391c215ba2 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Mon, 3 Jun 2019 22:43:03 -0500 Subject: [PATCH 01/22] feat(server/client): made progress option available to API --- bin/options.js | 4 + bin/webpack-dev-server.js | 6 -- lib/Server.js | 5 + lib/options.json | 4 + lib/utils/createConfig.js | 4 + test/cli/cli.test.js | 17 ++++ test/e2e/Progress.test.js | 62 +++++++++++++ test/e2e/__snapshots__/Progress.test.js.snap | 98 ++++++++++++++++++++ test/options.test.js | 4 + 9 files changed, 198 insertions(+), 6 deletions(-) create mode 100644 test/e2e/Progress.test.js create mode 100644 test/e2e/__snapshots__/Progress.test.js.snap diff --git a/bin/options.js b/bin/options.js index 3c46d9be9f..424ac2a21a 100644 --- a/bin/options.js +++ b/bin/options.js @@ -37,6 +37,10 @@ const options = { describe: 'Inline mode (set to false to disable including client scripts like livereload)', }, + profile: { + type: 'boolean', + describe: 'Print compilation profile data for progress steps', + }, progress: { type: 'boolean', describe: 'Print compilation progress in percentage', diff --git a/bin/webpack-dev-server.js b/bin/webpack-dev-server.js index deb015f6f1..26de7d4ba6 100755 --- a/bin/webpack-dev-server.js +++ b/bin/webpack-dev-server.js @@ -97,12 +97,6 @@ function startDevServer(config, options) { throw err; } - if (options.progress) { - new webpack.ProgressPlugin({ - profile: argv.profile, - }).apply(compiler); - } - try { server = new Server(compiler, options, log); } catch (err) { diff --git a/lib/Server.js b/lib/Server.js index 28986dfdaa..128ac5797c 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -100,6 +100,7 @@ class Server { // TODO this. is deprecated (remove them in next major release.) in favor this.options. this.hot = this.options.hot || this.options.hotOnly; this.headers = this.options.headers; + this.profile = !!this.options.profile; this.progress = this.options.progress; this.serveIndex = this.options.serveIndex; @@ -153,6 +154,10 @@ class Server { } setupProgressPlugin() { + new webpack.ProgressPlugin({ + profile: this.profile, + }).apply(this.compiler); + const progressPlugin = new webpack.ProgressPlugin( (percent, msg, addInfo) => { percent = Math.floor(percent * 100); diff --git a/lib/options.json b/lib/options.json index f410e4927b..32d8340f8f 100644 --- a/lib/options.json +++ b/lib/options.json @@ -258,6 +258,9 @@ } ] }, + "profile": { + "type": "boolean" + }, "progress": { "type": "boolean" }, @@ -426,6 +429,7 @@ "pfx": "should be {String|Buffer} (https://webpack.js.org/configuration/dev-server/#devserverpfx)", "pfxPassphrase": "should be {String} (https://webpack.js.org/configuration/dev-server/#devserverpfxpassphrase)", "port": "should be {Number|String|Null} (https://webpack.js.org/configuration/dev-server/#devserverport)", + "profile": "should be {Boolean}", "progress": "should be {Boolean} (https://webpack.js.org/configuration/dev-server/#devserverprogress---cli-only)", "proxy": "should be {Object|Array} (https://webpack.js.org/configuration/dev-server/#devserverproxy)", "public": "should be {String} (https://webpack.js.org/configuration/dev-server/#devserverpublic)", diff --git a/lib/utils/createConfig.js b/lib/utils/createConfig.js index c16a95138b..242acbf5bc 100644 --- a/lib/utils/createConfig.js +++ b/lib/utils/createConfig.js @@ -46,6 +46,10 @@ function createConfig(config, argv, { port }) { options.liveReload = false; } + if (argv.profile) { + options.profile = argv.profile; + } + if (argv.progress) { options.progress = argv.progress; } diff --git a/test/cli/cli.test.js b/test/cli/cli.test.js index 8bd1e04ddd..91e82b7bc6 100644 --- a/test/cli/cli.test.js +++ b/test/cli/cli.test.js @@ -20,6 +20,23 @@ describe('CLI', () => { .then((output) => { expect(output.code).toEqual(0); expect(output.stderr.includes('0% compiling')).toBe(true); + // should not profile + expect( + output.stderr.includes('ms after chunk modules optimization') + ).toBe(false); + done(); + }) + .catch(done); + }); + + it('--progress --profile', (done) => { + testBin('--progress --profile') + .then((output) => { + expect(output.code).toEqual(0); + // should profile + expect( + output.stderr.includes('ms after chunk modules optimization') + ).toBe(true); done(); }) .catch(done); diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js new file mode 100644 index 0000000000..7917179ff0 --- /dev/null +++ b/test/e2e/Progress.test.js @@ -0,0 +1,62 @@ +'use strict'; + +/* eslint-disable + no-undef +*/ +const fs = require('fs'); +const path = require('path'); +const testServer = require('../helpers/test-server'); +const reloadConfig = require('../fixtures/reload-config/webpack.config'); +const runBrowser = require('../helpers/run-browser'); + +describe('client progress', () => { + describe('using hot', () => { + const cssFilePath = path.resolve(__dirname, '../temp/main.css'); + beforeAll((done) => { + fs.writeFileSync( + cssFilePath, + 'body { background-color: rgb(0, 0, 255); }' + ); + const options = { + port: 9000, + host: '0.0.0.0', + inline: true, + hot: true, + progress: true, + watchOptions: { + poll: 500, + }, + }; + testServer.startAwaitingCompilation(reloadConfig, options, done); + }); + + afterAll((done) => { + testServer.close(done); + }); + + describe('on browser client', () => { + jest.setTimeout(30000); + + it('should console.log progress', (done) => { + runBrowser().then(({ page, browser }) => { + const res = []; + page.waitForNavigation({ waitUntil: 'load' }).then(() => { + fs.writeFileSync( + cssFilePath, + 'body { background-color: rgb(255, 0, 0); }' + ); + page.waitFor(10000).then(() => { + expect(res).toMatchSnapshot(); + browser.close().then(done); + }); + }); + + page.goto('http://localhost:9000/main'); + page.on('console', ({ _text }) => { + res.push(_text); + }); + }); + }); + }); + }); +}); diff --git a/test/e2e/__snapshots__/Progress.test.js.snap b/test/e2e/__snapshots__/Progress.test.js.snap new file mode 100644 index 0000000000..ecb9b79b94 --- /dev/null +++ b/test/e2e/__snapshots__/Progress.test.js.snap @@ -0,0 +1,98 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`client progress using hot on browser client should console.log progress 1`] = ` +Array [ + "[HMR] Waiting for update signal from WDS...", + "[WDS] Hot Module Replacement enabled.", + "[WDS] Live Reloading enabled.", + "[WDS] App updated. Recompiling...", + "[WDS] 0% - compiling.", + "[WDS] 10% - building (0/0 modules).", + "[WDS] 10% - building (0/0 modules).", + "[WDS] 10% - building (0/1 modules).", + "[WDS] 40% - building (0/1 modules).", + "[WDS] 40% - building (1/1 modules).", + "[WDS] 70% - building (1/1 modules).", + "[WDS] 70% - finish module graph.", + "[WDS] 70% - finish module graph (FlagDependencyExportsPlugin).", + "[WDS] 70% - sealing.", + "[WDS] 70% - sealing (WarnCaseSensitiveModulesPlugin).", + "[WDS] 71% - basic dependencies optimization.", + "[WDS] 72% - dependencies optimization.", + "[WDS] 72% - advanced dependencies optimization.", + "[WDS] 73% - after dependencies optimization.", + "[WDS] 70% - chunk graph.", + "[WDS] 71% - after chunk graph.", + "[WDS] 71% - after chunk graph (WebAssemblyModulesPlugin).", + "[WDS] 73% - optimizing.", + "[WDS] 74% - basic module optimization.", + "[WDS] 74% - module optimization.", + "[WDS] 75% - advanced module optimization.", + "[WDS] 75% - after module optimization.", + "[WDS] 76% - basic chunk optimization.", + "[WDS] 76% - basic chunk optimization (EnsureChunkConditionsPlugin).", + "[WDS] 76% - basic chunk optimization (RemoveParentModulesPlugin).", + "[WDS] 76% - basic chunk optimization (RemoveEmptyChunksPlugin).", + "[WDS] 76% - basic chunk optimization (MergeDuplicateChunksPlugin).", + "[WDS] 76% - chunk optimization.", + "[WDS] 77% - advanced chunk optimization.", + "[WDS] 77% - advanced chunk optimization (SplitChunksPlugin).", + "[WDS] 77% - advanced chunk optimization (RemoveEmptyChunksPlugin).", + "[WDS] 77% - after chunk optimization.", + "[WDS] 78% - module and chunk tree optimization.", + "[WDS] 78% - after module and chunk tree optimization.", + "[WDS] 79% - basic chunk modules optimization.", + "[WDS] 79% - chunk modules optimization.", + "[WDS] 80% - advanced chunk modules optimization.", + "[WDS] 80% - after chunk modules optimization.", + "[WDS] 81% - module reviving.", + "[WDS] 81% - module reviving (RecordIdsPlugin).", + "[WDS] 81% - module order optimization.", + "[WDS] 82% - advanced module order optimization.", + "[WDS] 82% - before module ids.", + "[WDS] 82% - before module ids (NamedModulesPlugin).", + "[WDS] 83% - module ids.", + "[WDS] 83% - module id optimization.", + "[WDS] 84% - module id optimization.", + "[WDS] 84% - chunk reviving.", + "[WDS] 84% - chunk reviving (RecordIdsPlugin).", + "[WDS] 85% - chunk order optimization.", + "[WDS] 85% - chunk order optimization (OccurrenceOrderChunkIdsPlugin).", + "[WDS] 85% - before chunk ids.", + "[WDS] 85% - before chunk ids (NamedChunksPlugin).", + "[WDS] 86% - chunk id optimization.", + "[WDS] 86% - after chunk id optimization.", + "[WDS] 87% - record modules.", + "[WDS] 87% - record modules (RecordIdsPlugin).", + "[WDS] 87% - record chunks.", + "[WDS] 87% - record chunks (RecordIdsPlugin).", + "[WDS] 88% - hashing.", + "[WDS] 88% - content hashing.", + "[WDS] 88% - content hashing (JavascriptModulesPlugin).", + "[WDS] 89% - after hashing.", + "[WDS] 89% - after hashing (HotModuleReplacementPlugin).", + "[WDS] 89% - record hash.", + "[WDS] 90% - module assets processing.", + "[WDS] 90% - chunk assets processing.", + "[WDS] 91% - additional chunk assets processing.", + "[WDS] 91% - additional chunk assets processing (HotModuleReplacementPlugin).", + "[WDS] 91% - recording.", + "[WDS] 91% - recording (HotModuleReplacementPlugin).", + "[WDS] 92% - additional asset processing.", + "[WDS] 92% - chunk asset optimization.", + "[WDS] 93% - after chunk asset optimization.", + "[WDS] 93% - asset optimization.", + "[WDS] 94% - after asset optimization.", + "[WDS] 94% - after seal.", + "[WDS] 95% - emitting.", + "[WDS] 98% - after emitting.", + "[WDS] 100% - Compilation completed.", + "[WDS] App hot update...", + "[HMR] Checking for updates on the server...", + "[HMR] Updated modules:", + "[HMR] - ../../temp/main.css", + "[HMR] - ../../../node_modules/css-loader/dist/cjs.js!../../temp/main.css", + "", + "[HMR] App is up to date.", +] +`; diff --git a/test/options.test.js b/test/options.test.js index 3ba18e17f7..a515ea28dc 100644 --- a/test/options.test.js +++ b/test/options.test.js @@ -309,6 +309,10 @@ describe('options', () => { success: ['', 0, null], failure: [false], }, + profile: { + success: [false], + failure: [''], + }, progress: { success: [false], failure: [''], From f956b3fb5af957255b63fc0461dffbe68d744f99 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Mon, 3 Jun 2019 23:08:24 -0500 Subject: [PATCH 02/22] test(client): switched snapshot test to single line confirmation --- test/e2e/Progress.test.js | 2 +- test/e2e/__snapshots__/Progress.test.js.snap | 98 -------------------- 2 files changed, 1 insertion(+), 99 deletions(-) delete mode 100644 test/e2e/__snapshots__/Progress.test.js.snap diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 7917179ff0..7807d4c4a8 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -46,7 +46,7 @@ describe('client progress', () => { 'body { background-color: rgb(255, 0, 0); }' ); page.waitFor(10000).then(() => { - expect(res).toMatchSnapshot(); + expect(res.includes('[WDS] 0% - compiling.')).toBeTruthy(); browser.close().then(done); }); }); diff --git a/test/e2e/__snapshots__/Progress.test.js.snap b/test/e2e/__snapshots__/Progress.test.js.snap deleted file mode 100644 index ecb9b79b94..0000000000 --- a/test/e2e/__snapshots__/Progress.test.js.snap +++ /dev/null @@ -1,98 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`client progress using hot on browser client should console.log progress 1`] = ` -Array [ - "[HMR] Waiting for update signal from WDS...", - "[WDS] Hot Module Replacement enabled.", - "[WDS] Live Reloading enabled.", - "[WDS] App updated. Recompiling...", - "[WDS] 0% - compiling.", - "[WDS] 10% - building (0/0 modules).", - "[WDS] 10% - building (0/0 modules).", - "[WDS] 10% - building (0/1 modules).", - "[WDS] 40% - building (0/1 modules).", - "[WDS] 40% - building (1/1 modules).", - "[WDS] 70% - building (1/1 modules).", - "[WDS] 70% - finish module graph.", - "[WDS] 70% - finish module graph (FlagDependencyExportsPlugin).", - "[WDS] 70% - sealing.", - "[WDS] 70% - sealing (WarnCaseSensitiveModulesPlugin).", - "[WDS] 71% - basic dependencies optimization.", - "[WDS] 72% - dependencies optimization.", - "[WDS] 72% - advanced dependencies optimization.", - "[WDS] 73% - after dependencies optimization.", - "[WDS] 70% - chunk graph.", - "[WDS] 71% - after chunk graph.", - "[WDS] 71% - after chunk graph (WebAssemblyModulesPlugin).", - "[WDS] 73% - optimizing.", - "[WDS] 74% - basic module optimization.", - "[WDS] 74% - module optimization.", - "[WDS] 75% - advanced module optimization.", - "[WDS] 75% - after module optimization.", - "[WDS] 76% - basic chunk optimization.", - "[WDS] 76% - basic chunk optimization (EnsureChunkConditionsPlugin).", - "[WDS] 76% - basic chunk optimization (RemoveParentModulesPlugin).", - "[WDS] 76% - basic chunk optimization (RemoveEmptyChunksPlugin).", - "[WDS] 76% - basic chunk optimization (MergeDuplicateChunksPlugin).", - "[WDS] 76% - chunk optimization.", - "[WDS] 77% - advanced chunk optimization.", - "[WDS] 77% - advanced chunk optimization (SplitChunksPlugin).", - "[WDS] 77% - advanced chunk optimization (RemoveEmptyChunksPlugin).", - "[WDS] 77% - after chunk optimization.", - "[WDS] 78% - module and chunk tree optimization.", - "[WDS] 78% - after module and chunk tree optimization.", - "[WDS] 79% - basic chunk modules optimization.", - "[WDS] 79% - chunk modules optimization.", - "[WDS] 80% - advanced chunk modules optimization.", - "[WDS] 80% - after chunk modules optimization.", - "[WDS] 81% - module reviving.", - "[WDS] 81% - module reviving (RecordIdsPlugin).", - "[WDS] 81% - module order optimization.", - "[WDS] 82% - advanced module order optimization.", - "[WDS] 82% - before module ids.", - "[WDS] 82% - before module ids (NamedModulesPlugin).", - "[WDS] 83% - module ids.", - "[WDS] 83% - module id optimization.", - "[WDS] 84% - module id optimization.", - "[WDS] 84% - chunk reviving.", - "[WDS] 84% - chunk reviving (RecordIdsPlugin).", - "[WDS] 85% - chunk order optimization.", - "[WDS] 85% - chunk order optimization (OccurrenceOrderChunkIdsPlugin).", - "[WDS] 85% - before chunk ids.", - "[WDS] 85% - before chunk ids (NamedChunksPlugin).", - "[WDS] 86% - chunk id optimization.", - "[WDS] 86% - after chunk id optimization.", - "[WDS] 87% - record modules.", - "[WDS] 87% - record modules (RecordIdsPlugin).", - "[WDS] 87% - record chunks.", - "[WDS] 87% - record chunks (RecordIdsPlugin).", - "[WDS] 88% - hashing.", - "[WDS] 88% - content hashing.", - "[WDS] 88% - content hashing (JavascriptModulesPlugin).", - "[WDS] 89% - after hashing.", - "[WDS] 89% - after hashing (HotModuleReplacementPlugin).", - "[WDS] 89% - record hash.", - "[WDS] 90% - module assets processing.", - "[WDS] 90% - chunk assets processing.", - "[WDS] 91% - additional chunk assets processing.", - "[WDS] 91% - additional chunk assets processing (HotModuleReplacementPlugin).", - "[WDS] 91% - recording.", - "[WDS] 91% - recording (HotModuleReplacementPlugin).", - "[WDS] 92% - additional asset processing.", - "[WDS] 92% - chunk asset optimization.", - "[WDS] 93% - after chunk asset optimization.", - "[WDS] 93% - asset optimization.", - "[WDS] 94% - after asset optimization.", - "[WDS] 94% - after seal.", - "[WDS] 95% - emitting.", - "[WDS] 98% - after emitting.", - "[WDS] 100% - Compilation completed.", - "[WDS] App hot update...", - "[HMR] Checking for updates on the server...", - "[HMR] Updated modules:", - "[HMR] - ../../temp/main.css", - "[HMR] - ../../../node_modules/css-loader/dist/cjs.js!../../temp/main.css", - "", - "[HMR] App is up to date.", -] -`; From 0ccfce151fb613a36b68e94fb8f943b7a948d2fb Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Tue, 4 Jun 2019 10:26:30 -0500 Subject: [PATCH 03/22] refactor(server): removed this.profile --- lib/Server.js | 3 +-- test/temp/main.css | 3 +++ 2 files changed, 4 insertions(+), 2 deletions(-) create mode 100644 test/temp/main.css diff --git a/lib/Server.js b/lib/Server.js index 128ac5797c..696d68ebaf 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -100,7 +100,6 @@ class Server { // TODO this. is deprecated (remove them in next major release.) in favor this.options. this.hot = this.options.hot || this.options.hotOnly; this.headers = this.options.headers; - this.profile = !!this.options.profile; this.progress = this.options.progress; this.serveIndex = this.options.serveIndex; @@ -155,7 +154,7 @@ class Server { setupProgressPlugin() { new webpack.ProgressPlugin({ - profile: this.profile, + profile: !!this.options.profile, }).apply(this.compiler); const progressPlugin = new webpack.ProgressPlugin( diff --git a/test/temp/main.css b/test/temp/main.css new file mode 100644 index 0000000000..de725038b6 --- /dev/null +++ b/test/temp/main.css @@ -0,0 +1,3 @@ +body { + background-color: rgb(255, 0, 0); +} From ef850392e941b67d296f8bf7bf5fa0327d39d2cc Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Tue, 4 Jun 2019 10:30:40 -0500 Subject: [PATCH 04/22] test(client): fixed progress test css path --- test/e2e/Progress.test.js | 6 ++++-- test/temp/main.css | 3 --- 2 files changed, 4 insertions(+), 5 deletions(-) delete mode 100644 test/temp/main.css diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 7807d4c4a8..dd5aad9ad9 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -4,14 +4,15 @@ no-undef */ const fs = require('fs'); -const path = require('path'); +const { resolve } = require('path'); const testServer = require('../helpers/test-server'); const reloadConfig = require('../fixtures/reload-config/webpack.config'); const runBrowser = require('../helpers/run-browser'); +const cssFilePath = resolve(__dirname, '../fixtures/reload-config/main.css'); + describe('client progress', () => { describe('using hot', () => { - const cssFilePath = path.resolve(__dirname, '../temp/main.css'); beforeAll((done) => { fs.writeFileSync( cssFilePath, @@ -47,6 +48,7 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { expect(res.includes('[WDS] 0% - compiling.')).toBeTruthy(); + fs.unlinkSync(cssFilePath); browser.close().then(done); }); }); diff --git a/test/temp/main.css b/test/temp/main.css deleted file mode 100644 index de725038b6..0000000000 --- a/test/temp/main.css +++ /dev/null @@ -1,3 +0,0 @@ -body { - background-color: rgb(255, 0, 0); -} From 94ef8e757fa13fe192dab546d3d6e001bba2a256 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Tue, 4 Jun 2019 14:26:04 -0500 Subject: [PATCH 05/22] test(client): remove jest timeout --- test/e2e/Progress.test.js | 2 -- 1 file changed, 2 deletions(-) diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index dd5aad9ad9..a37097b038 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -36,8 +36,6 @@ describe('client progress', () => { }); describe('on browser client', () => { - jest.setTimeout(30000); - it('should console.log progress', (done) => { runBrowser().then(({ page, browser }) => { const res = []; From 96c9cd8c18773879f8a55644a0d6edd5045dfb91 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Tue, 11 Jun 2019 16:25:31 -0500 Subject: [PATCH 06/22] test(e2e): change how use of progress on client checked --- test/e2e/Progress.test.js | 7 ++++++- 1 file changed, 6 insertions(+), 1 deletion(-) diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index a37097b038..01028685e5 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -45,7 +45,12 @@ describe('client progress', () => { 'body { background-color: rgb(255, 0, 0); }' ); page.waitFor(10000).then(() => { - expect(res.includes('[WDS] 0% - compiling.')).toBeTruthy(); + const testExp = /\[WDS\] [0-9]{1,3}% - compiling\./; + const match = res.find((line) => { + return testExp.test(line); + }); + // eslint-disable-next-line no-undefined + expect(match).not.toEqual(undefined); fs.unlinkSync(cssFilePath); browser.close().then(done); }); From adbb746f6a11d459546bd3ea9c841528ffa113aa Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Tue, 11 Jun 2019 16:50:45 -0500 Subject: [PATCH 07/22] test(e2e): moved css unlink into afterAll --- test/e2e/Progress.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 01028685e5..a454f8633a 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -32,6 +32,7 @@ describe('client progress', () => { }); afterAll((done) => { + fs.unlinkSync(cssFilePath); testServer.close(done); }); @@ -51,7 +52,6 @@ describe('client progress', () => { }); // eslint-disable-next-line no-undefined expect(match).not.toEqual(undefined); - fs.unlinkSync(cssFilePath); browser.close().then(done); }); }); From 10a98d333c13e6585f7ce8bde608cc57b8b622a7 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Tue, 11 Jun 2019 16:53:27 -0500 Subject: [PATCH 08/22] test(e2e): use port assigner --- test/e2e/Progress.test.js | 5 +++-- test/ports-map.js | 1 + 2 files changed, 4 insertions(+), 2 deletions(-) diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index a454f8633a..b735181d58 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -8,6 +8,7 @@ const { resolve } = require('path'); const testServer = require('../helpers/test-server'); const reloadConfig = require('../fixtures/reload-config/webpack.config'); const runBrowser = require('../helpers/run-browser'); +const port = require('../ports-map').Progress; const cssFilePath = resolve(__dirname, '../fixtures/reload-config/main.css'); @@ -19,7 +20,7 @@ describe('client progress', () => { 'body { background-color: rgb(0, 0, 255); }' ); const options = { - port: 9000, + port, host: '0.0.0.0', inline: true, hot: true, @@ -56,7 +57,7 @@ describe('client progress', () => { }); }); - page.goto('http://localhost:9000/main'); + page.goto(`http://localhost:${port}/main`); page.on('console', ({ _text }) => { res.push(_text); }); diff --git a/test/ports-map.js b/test/ports-map.js index 6c56f8100c..791d0f29b9 100644 --- a/test/ports-map.js +++ b/test/ports-map.js @@ -40,6 +40,7 @@ const portsList = { WebsocketServer: 1, ClientMode: 1, 'clientMode-option': 1, + Progress: 1, }; let startPort = 8079; From 37444829214454bf3cb424dd63f6270d50fdc822 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Thu, 13 Jun 2019 11:54:14 -0500 Subject: [PATCH 09/22] test(client): add full progress snapshot --- test/e2e/Progress.test.js | 8 +- test/e2e/__snapshots__/Progress.test.js.snap | 98 ++++++++++++++++++++ 2 files changed, 101 insertions(+), 5 deletions(-) create mode 100644 test/e2e/__snapshots__/Progress.test.js.snap diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index b735181d58..bd54263850 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -47,12 +47,10 @@ describe('client progress', () => { 'body { background-color: rgb(255, 0, 0); }' ); page.waitFor(10000).then(() => { - const testExp = /\[WDS\] [0-9]{1,3}% - compiling\./; - const match = res.find((line) => { - return testExp.test(line); + browser.close().then(() => { + expect(res).toMatchSnapshot(); + done(); }); - // eslint-disable-next-line no-undefined - expect(match).not.toEqual(undefined); browser.close().then(done); }); }); diff --git a/test/e2e/__snapshots__/Progress.test.js.snap b/test/e2e/__snapshots__/Progress.test.js.snap new file mode 100644 index 0000000000..818f910ad7 --- /dev/null +++ b/test/e2e/__snapshots__/Progress.test.js.snap @@ -0,0 +1,98 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`client progress using hot on browser client should console.log progress 1`] = ` +Array [ + "[HMR] Waiting for update signal from WDS...", + "[WDS] Hot Module Replacement enabled.", + "[WDS] Live Reloading enabled.", + "[WDS] App updated. Recompiling...", + "[WDS] 0% - compiling.", + "[WDS] 10% - building (0/0 modules).", + "[WDS] 10% - building (0/0 modules).", + "[WDS] 10% - building (0/1 modules).", + "[WDS] 40% - building (0/1 modules).", + "[WDS] 40% - building (1/1 modules).", + "[WDS] 70% - building (1/1 modules).", + "[WDS] 70% - finish module graph.", + "[WDS] 70% - finish module graph (FlagDependencyExportsPlugin).", + "[WDS] 70% - sealing.", + "[WDS] 70% - sealing (WarnCaseSensitiveModulesPlugin).", + "[WDS] 71% - basic dependencies optimization.", + "[WDS] 72% - dependencies optimization.", + "[WDS] 72% - advanced dependencies optimization.", + "[WDS] 73% - after dependencies optimization.", + "[WDS] 70% - chunk graph.", + "[WDS] 71% - after chunk graph.", + "[WDS] 71% - after chunk graph (WebAssemblyModulesPlugin).", + "[WDS] 73% - optimizing.", + "[WDS] 74% - basic module optimization.", + "[WDS] 74% - module optimization.", + "[WDS] 75% - advanced module optimization.", + "[WDS] 75% - after module optimization.", + "[WDS] 76% - basic chunk optimization.", + "[WDS] 76% - basic chunk optimization (EnsureChunkConditionsPlugin).", + "[WDS] 76% - basic chunk optimization (RemoveParentModulesPlugin).", + "[WDS] 76% - basic chunk optimization (RemoveEmptyChunksPlugin).", + "[WDS] 76% - basic chunk optimization (MergeDuplicateChunksPlugin).", + "[WDS] 76% - chunk optimization.", + "[WDS] 77% - advanced chunk optimization.", + "[WDS] 77% - advanced chunk optimization (SplitChunksPlugin).", + "[WDS] 77% - advanced chunk optimization (RemoveEmptyChunksPlugin).", + "[WDS] 77% - after chunk optimization.", + "[WDS] 78% - module and chunk tree optimization.", + "[WDS] 78% - after module and chunk tree optimization.", + "[WDS] 79% - basic chunk modules optimization.", + "[WDS] 79% - chunk modules optimization.", + "[WDS] 80% - advanced chunk modules optimization.", + "[WDS] 80% - after chunk modules optimization.", + "[WDS] 81% - module reviving.", + "[WDS] 81% - module reviving (RecordIdsPlugin).", + "[WDS] 81% - module order optimization.", + "[WDS] 82% - advanced module order optimization.", + "[WDS] 82% - before module ids.", + "[WDS] 82% - before module ids (NamedModulesPlugin).", + "[WDS] 83% - module ids.", + "[WDS] 83% - module id optimization.", + "[WDS] 84% - module id optimization.", + "[WDS] 84% - chunk reviving.", + "[WDS] 84% - chunk reviving (RecordIdsPlugin).", + "[WDS] 85% - chunk order optimization.", + "[WDS] 85% - chunk order optimization (OccurrenceOrderChunkIdsPlugin).", + "[WDS] 85% - before chunk ids.", + "[WDS] 85% - before chunk ids (NamedChunksPlugin).", + "[WDS] 86% - chunk id optimization.", + "[WDS] 86% - after chunk id optimization.", + "[WDS] 87% - record modules.", + "[WDS] 87% - record modules (RecordIdsPlugin).", + "[WDS] 87% - record chunks.", + "[WDS] 87% - record chunks (RecordIdsPlugin).", + "[WDS] 88% - hashing.", + "[WDS] 88% - content hashing.", + "[WDS] 88% - content hashing (JavascriptModulesPlugin).", + "[WDS] 89% - after hashing.", + "[WDS] 89% - after hashing (HotModuleReplacementPlugin).", + "[WDS] 89% - record hash.", + "[WDS] 90% - module assets processing.", + "[WDS] 90% - chunk assets processing.", + "[WDS] 91% - additional chunk assets processing.", + "[WDS] 91% - additional chunk assets processing (HotModuleReplacementPlugin).", + "[WDS] 91% - recording.", + "[WDS] 91% - recording (HotModuleReplacementPlugin).", + "[WDS] 92% - additional asset processing.", + "[WDS] 92% - chunk asset optimization.", + "[WDS] 93% - after chunk asset optimization.", + "[WDS] 93% - asset optimization.", + "[WDS] 94% - after asset optimization.", + "[WDS] 94% - after seal.", + "[WDS] 95% - emitting.", + "[WDS] 98% - after emitting.", + "[WDS] 100% - Compilation completed.", + "[WDS] App hot update...", + "[HMR] Checking for updates on the server...", + "[HMR] Updated modules:", + "[HMR] - ./main.css", + "[HMR] - ../../../node_modules/css-loader/dist/cjs.js!./main.css", + "", + "[HMR] App is up to date.", +] +`; From b66dd47420509b793273702c308e3dbb646628f8 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Fri, 14 Jun 2019 12:56:07 -0500 Subject: [PATCH 10/22] test(client): reg exp progress test --- lib/options.json | 2 +- test/e2e/Progress.test.js | 10 +- test/e2e/__snapshots__/Progress.test.js.snap | 98 -------------------- 3 files changed, 9 insertions(+), 101 deletions(-) delete mode 100644 test/e2e/__snapshots__/Progress.test.js.snap diff --git a/lib/options.json b/lib/options.json index 32d8340f8f..26dba30afc 100644 --- a/lib/options.json +++ b/lib/options.json @@ -429,7 +429,7 @@ "pfx": "should be {String|Buffer} (https://webpack.js.org/configuration/dev-server/#devserverpfx)", "pfxPassphrase": "should be {String} (https://webpack.js.org/configuration/dev-server/#devserverpfxpassphrase)", "port": "should be {Number|String|Null} (https://webpack.js.org/configuration/dev-server/#devserverport)", - "profile": "should be {Boolean}", + "profile": "should be {Boolean} (https://webpack.js.org/configuration/dev-server/#devserverprofile)", "progress": "should be {Boolean} (https://webpack.js.org/configuration/dev-server/#devserverprogress---cli-only)", "proxy": "should be {Object|Array} (https://webpack.js.org/configuration/dev-server/#devserverproxy)", "public": "should be {String} (https://webpack.js.org/configuration/dev-server/#devserverpublic)", diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index bd54263850..302a8ab5b8 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,10 +48,16 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { - expect(res).toMatchSnapshot(); + // example output that would match: + // "[WDS] 40% - building (0/1 modules)." + const testExp = /\[WDS\] [0-9]{1,3}% - building \([0-1]\/1 modules\)\./; + const match = res.find((line) => { + return testExp.test(line); + }); + // eslint-disable-next-line no-undefined + expect(match).not.toEqual(undefined); done(); }); - browser.close().then(done); }); }); diff --git a/test/e2e/__snapshots__/Progress.test.js.snap b/test/e2e/__snapshots__/Progress.test.js.snap deleted file mode 100644 index 818f910ad7..0000000000 --- a/test/e2e/__snapshots__/Progress.test.js.snap +++ /dev/null @@ -1,98 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`client progress using hot on browser client should console.log progress 1`] = ` -Array [ - "[HMR] Waiting for update signal from WDS...", - "[WDS] Hot Module Replacement enabled.", - "[WDS] Live Reloading enabled.", - "[WDS] App updated. Recompiling...", - "[WDS] 0% - compiling.", - "[WDS] 10% - building (0/0 modules).", - "[WDS] 10% - building (0/0 modules).", - "[WDS] 10% - building (0/1 modules).", - "[WDS] 40% - building (0/1 modules).", - "[WDS] 40% - building (1/1 modules).", - "[WDS] 70% - building (1/1 modules).", - "[WDS] 70% - finish module graph.", - "[WDS] 70% - finish module graph (FlagDependencyExportsPlugin).", - "[WDS] 70% - sealing.", - "[WDS] 70% - sealing (WarnCaseSensitiveModulesPlugin).", - "[WDS] 71% - basic dependencies optimization.", - "[WDS] 72% - dependencies optimization.", - "[WDS] 72% - advanced dependencies optimization.", - "[WDS] 73% - after dependencies optimization.", - "[WDS] 70% - chunk graph.", - "[WDS] 71% - after chunk graph.", - "[WDS] 71% - after chunk graph (WebAssemblyModulesPlugin).", - "[WDS] 73% - optimizing.", - "[WDS] 74% - basic module optimization.", - "[WDS] 74% - module optimization.", - "[WDS] 75% - advanced module optimization.", - "[WDS] 75% - after module optimization.", - "[WDS] 76% - basic chunk optimization.", - "[WDS] 76% - basic chunk optimization (EnsureChunkConditionsPlugin).", - "[WDS] 76% - basic chunk optimization (RemoveParentModulesPlugin).", - "[WDS] 76% - basic chunk optimization (RemoveEmptyChunksPlugin).", - "[WDS] 76% - basic chunk optimization (MergeDuplicateChunksPlugin).", - "[WDS] 76% - chunk optimization.", - "[WDS] 77% - advanced chunk optimization.", - "[WDS] 77% - advanced chunk optimization (SplitChunksPlugin).", - "[WDS] 77% - advanced chunk optimization (RemoveEmptyChunksPlugin).", - "[WDS] 77% - after chunk optimization.", - "[WDS] 78% - module and chunk tree optimization.", - "[WDS] 78% - after module and chunk tree optimization.", - "[WDS] 79% - basic chunk modules optimization.", - "[WDS] 79% - chunk modules optimization.", - "[WDS] 80% - advanced chunk modules optimization.", - "[WDS] 80% - after chunk modules optimization.", - "[WDS] 81% - module reviving.", - "[WDS] 81% - module reviving (RecordIdsPlugin).", - "[WDS] 81% - module order optimization.", - "[WDS] 82% - advanced module order optimization.", - "[WDS] 82% - before module ids.", - "[WDS] 82% - before module ids (NamedModulesPlugin).", - "[WDS] 83% - module ids.", - "[WDS] 83% - module id optimization.", - "[WDS] 84% - module id optimization.", - "[WDS] 84% - chunk reviving.", - "[WDS] 84% - chunk reviving (RecordIdsPlugin).", - "[WDS] 85% - chunk order optimization.", - "[WDS] 85% - chunk order optimization (OccurrenceOrderChunkIdsPlugin).", - "[WDS] 85% - before chunk ids.", - "[WDS] 85% - before chunk ids (NamedChunksPlugin).", - "[WDS] 86% - chunk id optimization.", - "[WDS] 86% - after chunk id optimization.", - "[WDS] 87% - record modules.", - "[WDS] 87% - record modules (RecordIdsPlugin).", - "[WDS] 87% - record chunks.", - "[WDS] 87% - record chunks (RecordIdsPlugin).", - "[WDS] 88% - hashing.", - "[WDS] 88% - content hashing.", - "[WDS] 88% - content hashing (JavascriptModulesPlugin).", - "[WDS] 89% - after hashing.", - "[WDS] 89% - after hashing (HotModuleReplacementPlugin).", - "[WDS] 89% - record hash.", - "[WDS] 90% - module assets processing.", - "[WDS] 90% - chunk assets processing.", - "[WDS] 91% - additional chunk assets processing.", - "[WDS] 91% - additional chunk assets processing (HotModuleReplacementPlugin).", - "[WDS] 91% - recording.", - "[WDS] 91% - recording (HotModuleReplacementPlugin).", - "[WDS] 92% - additional asset processing.", - "[WDS] 92% - chunk asset optimization.", - "[WDS] 93% - after chunk asset optimization.", - "[WDS] 93% - asset optimization.", - "[WDS] 94% - after asset optimization.", - "[WDS] 94% - after seal.", - "[WDS] 95% - emitting.", - "[WDS] 98% - after emitting.", - "[WDS] 100% - Compilation completed.", - "[WDS] App hot update...", - "[HMR] Checking for updates on the server...", - "[HMR] Updated modules:", - "[HMR] - ./main.css", - "[HMR] - ../../../node_modules/css-loader/dist/cjs.js!./main.css", - "", - "[HMR] App is up to date.", -] -`; From e6884493e2384ff0db4d923c599b0c93d80a8f56 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Fri, 14 Jun 2019 14:34:11 -0500 Subject: [PATCH 11/22] test(client): check end of progress updates in console --- test/e2e/Progress.test.js | 5 +---- 1 file changed, 1 insertion(+), 4 deletions(-) diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 302a8ab5b8..6cfa00f0f4 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,11 +48,8 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { - // example output that would match: - // "[WDS] 40% - building (0/1 modules)." - const testExp = /\[WDS\] [0-9]{1,3}% - building \([0-1]\/1 modules\)\./; const match = res.find((line) => { - return testExp.test(line); + return line === '[WDS] 100% - Compilation completed.'; }); // eslint-disable-next-line no-undefined expect(match).not.toEqual(undefined); From fe1db5de0555fe3379e2a218278139fea37708e8 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Fri, 14 Jun 2019 15:00:47 -0500 Subject: [PATCH 12/22] test(client): more generalized test reg exp --- test/e2e/Progress.test.js | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 6cfa00f0f4..075effd9cd 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,8 +48,10 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { + // check that there is some percentage progress output + const regExp = /^\[WDS\] [0-9]{1,3}% - /; const match = res.find((line) => { - return line === '[WDS] 100% - Compilation completed.'; + return regExp.test(line); }); // eslint-disable-next-line no-undefined expect(match).not.toEqual(undefined); From 08f79ff11ec115a7c48f144335f2dc3446cef0ee Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Fri, 14 Jun 2019 17:01:30 -0500 Subject: [PATCH 13/22] test(client): test to isolate ci problem --- lib/Server.js | 6 +++--- test/e2e/Progress.test.js | 1 + 2 files changed, 4 insertions(+), 3 deletions(-) diff --git a/lib/Server.js b/lib/Server.js index 696d68ebaf..8a949d3c5b 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -153,9 +153,9 @@ class Server { } setupProgressPlugin() { - new webpack.ProgressPlugin({ - profile: !!this.options.profile, - }).apply(this.compiler); + // new webpack.ProgressPlugin({ + // profile: !!this.options.profile, + // }).apply(this.compiler); const progressPlugin = new webpack.ProgressPlugin( (percent, msg, addInfo) => { diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 075effd9cd..b93fecaac7 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,6 +48,7 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { + console.log(res); // check that there is some percentage progress output const regExp = /^\[WDS\] [0-9]{1,3}% - /; const match = res.find((line) => { From 33bf227208bee35a24b200a1718ad606dc2ade84 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 12:01:59 -0500 Subject: [PATCH 14/22] test(client): made custom progress plugin to test --- lib/Server.js | 29 +- lib/utils/ProgressPlugin.js | 352 +++++++++++++++++++ test/e2e/Progress.test.js | 17 +- test/e2e/__snapshots__/Progress.test.js.snap | 99 ++++++ 4 files changed, 474 insertions(+), 23 deletions(-) create mode 100644 lib/utils/ProgressPlugin.js create mode 100644 test/e2e/__snapshots__/Progress.test.js.snap diff --git a/lib/Server.js b/lib/Server.js index 8a949d3c5b..8c5a4bd6d9 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -31,6 +31,7 @@ const createDomain = require('./utils/createDomain'); const runBonjour = require('./utils/runBonjour'); const routes = require('./utils/routes'); const getSocketServerImplementation = require('./utils/getSocketServerImplementation'); +const ProgressPlugin = require('./utils/ProgressPlugin'); const schema = require('./options.json'); // Workaround for node ^8.6.0, ^9.0.0 @@ -153,25 +154,23 @@ class Server { } setupProgressPlugin() { - // new webpack.ProgressPlugin({ - // profile: !!this.options.profile, - // }).apply(this.compiler); + new webpack.ProgressPlugin({ + profile: !!this.options.profile, + }).apply(this.compiler); - const progressPlugin = new webpack.ProgressPlugin( - (percent, msg, addInfo) => { - percent = Math.floor(percent * 100); + const progressPlugin = new ProgressPlugin((percent, msg, addInfo) => { + percent = Math.floor(percent * 100); - if (percent === 100) { - msg = 'Compilation completed'; - } - - if (addInfo) { - msg = `${msg} (${addInfo})`; - } + if (percent === 100) { + msg = 'Compilation completed'; + } - this.sockWrite(this.sockets, 'progress-update', { percent, msg }); + if (addInfo) { + msg = `${msg} (${addInfo})`; } - ); + + this.sockWrite(this.sockets, 'progress-update', { percent, msg }); + }); progressPlugin.apply(this.compiler); } diff --git a/lib/utils/ProgressPlugin.js b/lib/utils/ProgressPlugin.js new file mode 100644 index 0000000000..be7392d321 --- /dev/null +++ b/lib/utils/ProgressPlugin.js @@ -0,0 +1,352 @@ +/* + MIT License http://www.opensource.org/licenses/mit-license.php + Author Tobias Koppers @sokra +*/ + +'use strict'; + +/* eslint-disable line-comment-position, no-continue, no-use-before-define, no-shadow, no-plusplus, no-unused-vars, no-multi-assign */ + +const validateOptions = require('schema-utils'); +const schema = require('webpack/schemas/plugins/ProgressPlugin.json'); + +/** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginArgument} ProgressPluginArgument */ +/** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginOptions} ProgressPluginOptions */ + +const createDefaultHandler = (profile) => { + let lineCaretPosition = 0; + let lastMessage = ''; + let lastState; + let lastStateTime; + + const defaultHandler = (percentage, msg, ...args) => { + let state = msg; + const details = args.filter((v) => v.length); + const maxLineLength = process.stderr.columns || Infinity; + if (percentage < 1) { + percentage = Math.floor(percentage * 100); + msg = `${percentage}% ${msg}`; + if (percentage < 100) { + msg = ` ${msg}`; + } + if (percentage < 10) { + msg = ` ${msg}`; + } + + if (details.length) { + const maxTotalDetailsLength = maxLineLength - msg.length; + const totalDetailsLength = details.reduce( + (a, b) => a + b.length, + details.length // account for added space before each detail text + ); + const maxDetailLength = + totalDetailsLength < maxTotalDetailsLength + ? Infinity + : Math.floor(maxTotalDetailsLength / details.length); + + for (let detail of details) { + if (!detail) continue; + if (detail.length + 1 > maxDetailLength) { + const truncatePrefix = '...'; + detail = `${truncatePrefix}${detail.substr( + -(maxDetailLength - truncatePrefix.length - 1) + )}`; + } + msg += ` ${detail}`; + } + } + } + if (profile) { + state = state.replace(/^\d+\/\d+\s+/, ''); + if (percentage === 0) { + lastState = null; + lastStateTime = Date.now(); + } else if (state !== lastState || percentage === 1) { + const now = Date.now(); + if (lastState) { + const stateMsg = `${now - lastStateTime}ms ${lastState}`; + goToLineStart(stateMsg); + process.stderr.write(`${stateMsg}\n`); + lineCaretPosition = 0; + } + lastState = state; + lastStateTime = now; + } + } + if (lastMessage !== msg) { + goToLineStart(msg); + msg = msg.substring(0, maxLineLength); + process.stderr.write(msg); + lastMessage = msg; + } + }; + + const goToLineStart = (nextMessage) => { + let str = ''; + for (; lineCaretPosition > nextMessage.length; lineCaretPosition--) { + str += '\b \b'; + } + for (let i = 0; i < lineCaretPosition; i++) { + str += '\b'; + } + lineCaretPosition = nextMessage.length; + if (str) process.stderr.write(str); + }; + + return defaultHandler; +}; + +class ProgressPlugin { + /** + * @param {ProgressPluginArgument} options options + */ + constructor(options) { + if (typeof options === 'function') { + options = { + handler: options, + }; + } + + options = options || {}; + validateOptions(schema, options, 'Progress Plugin'); + options = Object.assign({}, ProgressPlugin.defaultOptions, options); + + this.profile = options.profile; + this.handler = options.handler; + this.modulesCount = options.modulesCount; + this.showEntries = options.entries; + this.showModules = options.modules; + this.showActiveModules = options.activeModules; + } + + apply(compiler) { + const { modulesCount } = this; + const handler = this.handler || createDefaultHandler(this.profile); + const showEntries = this.showEntries; + const showModules = this.showModules; + const showActiveModules = this.showActiveModules; + if (compiler.compilers) { + const states = new Array(compiler.compilers.length); + compiler.compilers.forEach((compiler, idx) => { + new ProgressPlugin((p, msg, ...args) => { + states[idx] = [p, msg, ...args]; + handler( + states + .map((state) => (state && state[0]) || 0) + .reduce((a, b) => a + b) / states.length, + `[${idx}] ${msg}`, + ...args + ); + }).apply(compiler); + }); + } else { + let lastModulesCount = 0; + let lastEntriesCount = 0; + let moduleCount = modulesCount; + let entriesCount = 1; + let doneModules = 0; + let doneEntries = 0; + const activeModules = new Set(); + let lastActiveModule = ''; + + const update = () => { + const percentByModules = + doneModules / Math.max(lastModulesCount, moduleCount); + const percentByEntries = + doneEntries / Math.max(lastEntriesCount, entriesCount); + + const items = [ + 0.1 + Math.max(percentByModules, percentByEntries) * 0.6, + 'building', + ]; + if (showEntries) { + items.push(`${doneEntries}/${entriesCount} entries`); + } + if (showModules) { + items.push(`${doneModules}/${moduleCount} modules`); + } + if (showActiveModules) { + items.push(`${activeModules.size} active`); + items.push(lastActiveModule); + } + handler(...items); + }; + + const moduleAdd = (module) => { + moduleCount++; + if (showActiveModules) { + const ident = module.identifier(); + if (ident) { + activeModules.add(ident); + lastActiveModule = ident; + } + } + update(); + }; + + const entryAdd = (entry, name) => { + entriesCount++; + update(); + }; + + const moduleDone = (module) => { + doneModules++; + if (showActiveModules) { + const ident = module.identifier(); + if (ident) { + activeModules.delete(ident); + if (lastActiveModule === ident) { + lastActiveModule = ''; + for (const m of activeModules) { + lastActiveModule = m; + } + } + } + } + update(); + }; + + const entryDone = (entry, name) => { + doneEntries++; + update(); + }; + + compiler.hooks.compilation.tap('ProgressPlugin2', (compilation) => { + if (compilation.compiler.isChild()) return; + lastModulesCount = moduleCount; + lastEntriesCount = entriesCount; + moduleCount = entriesCount = 0; + doneModules = doneEntries = 0; + handler(0, 'compiling'); + + compilation.hooks.buildModule.tap('ProgressPlugin2', moduleAdd); + compilation.hooks.failedModule.tap('ProgressPlugin2', moduleDone); + compilation.hooks.succeedModule.tap('ProgressPlugin2', moduleDone); + + compilation.hooks.addEntry.tap('ProgressPlugin2', entryAdd); + compilation.hooks.failedEntry.tap('ProgressPlugin2', entryDone); + compilation.hooks.succeedEntry.tap('ProgressPlugin2', entryDone); + + const hooks = { + finishModules: 'finish module graph', + seal: 'sealing', + beforeChunks: 'chunk graph', + afterChunks: 'after chunk graph', + optimizeDependenciesBasic: 'basic dependencies optimization', + optimizeDependencies: 'dependencies optimization', + optimizeDependenciesAdvanced: 'advanced dependencies optimization', + afterOptimizeDependencies: 'after dependencies optimization', + optimize: 'optimizing', + optimizeModulesBasic: 'basic module optimization', + optimizeModules: 'module optimization', + optimizeModulesAdvanced: 'advanced module optimization', + afterOptimizeModules: 'after module optimization', + optimizeChunksBasic: 'basic chunk optimization', + optimizeChunks: 'chunk optimization', + optimizeChunksAdvanced: 'advanced chunk optimization', + afterOptimizeChunks: 'after chunk optimization', + optimizeTree: 'module and chunk tree optimization', + afterOptimizeTree: 'after module and chunk tree optimization', + optimizeChunkModulesBasic: 'basic chunk modules optimization', + optimizeChunkModules: 'chunk modules optimization', + optimizeChunkModulesAdvanced: 'advanced chunk modules optimization', + afterOptimizeChunkModules: 'after chunk modules optimization', + reviveModules: 'module reviving', + optimizeModuleOrder: 'module order optimization', + advancedOptimizeModuleOrder: 'advanced module order optimization', + beforeModuleIds: 'before module ids', + moduleIds: 'module ids', + optimizeModuleIds: 'module id optimization', + afterOptimizeModuleIds: 'module id optimization', + reviveChunks: 'chunk reviving', + optimizeChunkOrder: 'chunk order optimization', + beforeChunkIds: 'before chunk ids', + optimizeChunkIds: 'chunk id optimization', + afterOptimizeChunkIds: 'after chunk id optimization', + recordModules: 'record modules', + recordChunks: 'record chunks', + beforeHash: 'hashing', + contentHash: 'content hashing', + afterHash: 'after hashing', + recordHash: 'record hash', + beforeModuleAssets: 'module assets processing', + beforeChunkAssets: 'chunk assets processing', + additionalChunkAssets: 'additional chunk assets processing', + record: 'recording', + additionalAssets: 'additional asset processing', + optimizeChunkAssets: 'chunk asset optimization', + afterOptimizeChunkAssets: 'after chunk asset optimization', + optimizeAssets: 'asset optimization', + afterOptimizeAssets: 'after asset optimization', + afterSeal: 'after seal', + }; + const numberOfHooks = Object.keys(hooks).length; + Object.keys(hooks).forEach((name, idx) => { + const title = hooks[name]; + const percentage = (idx / numberOfHooks) * 0.25 + 0.7; + compilation.hooks[name].intercept({ + name: 'ProgressPlugin2', + context: true, + call: () => { + handler(percentage, title); + }, + tap: (context, tap) => { + if (context) { + // p is percentage from 0 to 1 + // args is any number of messages in a hierarchical matter + context.reportProgress = (p, ...args) => { + handler(percentage, title, tap.name, ...args); + }; + } + handler(percentage, title, tap.name); + }, + }); + }); + }); + compiler.hooks.emit.intercept({ + name: 'ProgressPlugin2', + context: true, + call: () => { + handler(0.95, 'emitting'); + }, + tap: (context, tap) => { + if (context) { + context.reportProgress = (p, ...args) => { + handler(0.95, 'emitting', tap.name, ...args); + }; + } + handler(0.95, 'emitting', tap.name); + }, + }); + compiler.hooks.afterEmit.intercept({ + name: 'ProgressPlugin2', + context: true, + call: () => { + handler(0.98, 'after emitting'); + }, + tap: (context, tap) => { + if (context) { + context.reportProgress = (p, ...args) => { + handler(0.98, 'after emitting', tap.name, ...args); + }; + } + handler(0.98, 'after emitting', tap.name); + }, + }); + compiler.hooks.done.tap('ProgressPlugin2', () => { + handler(1, ''); + }); + } + } +} + +ProgressPlugin.defaultOptions = { + profile: false, + modulesCount: 500, + modules: true, + activeModules: true, + // TODO webpack 5 default this to true + entries: false, +}; + +module.exports = ProgressPlugin; diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index b93fecaac7..99ee9da58a 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,14 +48,15 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { - console.log(res); - // check that there is some percentage progress output - const regExp = /^\[WDS\] [0-9]{1,3}% - /; - const match = res.find((line) => { - return regExp.test(line); - }); - // eslint-disable-next-line no-undefined - expect(match).not.toEqual(undefined); + // console.log(res); + // // check that there is some percentage progress output + // const regExp = /^\[WDS\] [0-9]{1,3}% - /; + // const match = res.find((line) => { + // return regExp.test(line); + // }); + // // eslint-disable-next-line no-undefined + // expect(match).not.toEqual(undefined); + expect(res).toMatchSnapshot(); done(); }); }); diff --git a/test/e2e/__snapshots__/Progress.test.js.snap b/test/e2e/__snapshots__/Progress.test.js.snap new file mode 100644 index 0000000000..500d80e045 --- /dev/null +++ b/test/e2e/__snapshots__/Progress.test.js.snap @@ -0,0 +1,99 @@ +// Jest Snapshot v1, https://goo.gl/fbAQLP + +exports[`client progress using hot on browser client should console.log progress 1`] = ` +Array [ + "[HMR] Waiting for update signal from WDS...", + "[WDS] Hot Module Replacement enabled.", + "[WDS] Live Reloading enabled.", + "[WDS] App updated. Recompiling...", + "[WDS] App updated. Recompiling...", + "[WDS] 0% - compiling.", + "[WDS] 10% - building (0/0 modules).", + "[WDS] 10% - building (0/0 modules).", + "[WDS] 10% - building (0/1 modules).", + "[WDS] 40% - building (0/1 modules).", + "[WDS] 40% - building (1/1 modules).", + "[WDS] 70% - building (1/1 modules).", + "[WDS] 70% - finish module graph.", + "[WDS] 70% - finish module graph (FlagDependencyExportsPlugin).", + "[WDS] 70% - sealing.", + "[WDS] 70% - sealing (WarnCaseSensitiveModulesPlugin).", + "[WDS] 71% - basic dependencies optimization.", + "[WDS] 72% - dependencies optimization.", + "[WDS] 72% - advanced dependencies optimization.", + "[WDS] 73% - after dependencies optimization.", + "[WDS] 70% - chunk graph.", + "[WDS] 71% - after chunk graph.", + "[WDS] 71% - after chunk graph (WebAssemblyModulesPlugin).", + "[WDS] 73% - optimizing.", + "[WDS] 74% - basic module optimization.", + "[WDS] 74% - module optimization.", + "[WDS] 75% - advanced module optimization.", + "[WDS] 75% - after module optimization.", + "[WDS] 76% - basic chunk optimization.", + "[WDS] 76% - basic chunk optimization (EnsureChunkConditionsPlugin).", + "[WDS] 76% - basic chunk optimization (RemoveParentModulesPlugin).", + "[WDS] 76% - basic chunk optimization (RemoveEmptyChunksPlugin).", + "[WDS] 76% - basic chunk optimization (MergeDuplicateChunksPlugin).", + "[WDS] 76% - chunk optimization.", + "[WDS] 77% - advanced chunk optimization.", + "[WDS] 77% - advanced chunk optimization (SplitChunksPlugin).", + "[WDS] 77% - advanced chunk optimization (RemoveEmptyChunksPlugin).", + "[WDS] 77% - after chunk optimization.", + "[WDS] 78% - module and chunk tree optimization.", + "[WDS] 78% - after module and chunk tree optimization.", + "[WDS] 79% - basic chunk modules optimization.", + "[WDS] 79% - chunk modules optimization.", + "[WDS] 80% - advanced chunk modules optimization.", + "[WDS] 80% - after chunk modules optimization.", + "[WDS] 81% - module reviving.", + "[WDS] 81% - module reviving (RecordIdsPlugin).", + "[WDS] 81% - module order optimization.", + "[WDS] 82% - advanced module order optimization.", + "[WDS] 82% - before module ids.", + "[WDS] 82% - before module ids (NamedModulesPlugin).", + "[WDS] 83% - module ids.", + "[WDS] 83% - module id optimization.", + "[WDS] 84% - module id optimization.", + "[WDS] 84% - chunk reviving.", + "[WDS] 84% - chunk reviving (RecordIdsPlugin).", + "[WDS] 85% - chunk order optimization.", + "[WDS] 85% - chunk order optimization (OccurrenceOrderChunkIdsPlugin).", + "[WDS] 85% - before chunk ids.", + "[WDS] 85% - before chunk ids (NamedChunksPlugin).", + "[WDS] 86% - chunk id optimization.", + "[WDS] 86% - after chunk id optimization.", + "[WDS] 87% - record modules.", + "[WDS] 87% - record modules (RecordIdsPlugin).", + "[WDS] 87% - record chunks.", + "[WDS] 87% - record chunks (RecordIdsPlugin).", + "[WDS] 88% - hashing.", + "[WDS] 88% - content hashing.", + "[WDS] 88% - content hashing (JavascriptModulesPlugin).", + "[WDS] 89% - after hashing.", + "[WDS] 89% - after hashing (HotModuleReplacementPlugin).", + "[WDS] 89% - record hash.", + "[WDS] 90% - module assets processing.", + "[WDS] 90% - chunk assets processing.", + "[WDS] 91% - additional chunk assets processing.", + "[WDS] 91% - additional chunk assets processing (HotModuleReplacementPlugin).", + "[WDS] 91% - recording.", + "[WDS] 91% - recording (HotModuleReplacementPlugin).", + "[WDS] 92% - additional asset processing.", + "[WDS] 92% - chunk asset optimization.", + "[WDS] 93% - after chunk asset optimization.", + "[WDS] 93% - asset optimization.", + "[WDS] 94% - after asset optimization.", + "[WDS] 94% - after seal.", + "[WDS] 95% - emitting.", + "[WDS] 98% - after emitting.", + "[WDS] 100% - Compilation completed.", + "[WDS] App hot update...", + "[HMR] Checking for updates on the server...", + "[HMR] Updated modules:", + "[HMR] - ./main.css", + "[HMR] - ../../../node_modules/css-loader/dist/cjs.js!./main.css", + "", + "[HMR] App is up to date.", +] +`; From 357df68cfcf147a27573990f2f249d4b9d321ffb Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 12:37:45 -0500 Subject: [PATCH 15/22] test(client): new progress plugin multi handler test --- lib/Server.js | 28 +++--- lib/utils/ProgressPlugin.js | 31 +++--- test/e2e/Progress.test.js | 17 ++-- test/e2e/__snapshots__/Progress.test.js.snap | 99 -------------------- 4 files changed, 42 insertions(+), 133 deletions(-) delete mode 100644 test/e2e/__snapshots__/Progress.test.js.snap diff --git a/lib/Server.js b/lib/Server.js index 8c5a4bd6d9..cc43f5c992 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -20,7 +20,6 @@ const httpProxyMiddleware = require('http-proxy-middleware'); const historyApiFallback = require('connect-history-api-fallback'); const compress = require('compression'); const serveIndex = require('serve-index'); -const webpack = require('webpack'); const webpackDevMiddleware = require('webpack-dev-middleware'); const validateOptions = require('schema-utils'); const updateCompiler = require('./utils/updateCompiler'); @@ -154,22 +153,25 @@ class Server { } setupProgressPlugin() { - new webpack.ProgressPlugin({ - profile: !!this.options.profile, - }).apply(this.compiler); + // new webpack.ProgressPlugin({ + // profile: !!this.options.profile, + // }).apply(this.compiler); - const progressPlugin = new ProgressPlugin((percent, msg, addInfo) => { - percent = Math.floor(percent * 100); + const progressPlugin = new ProgressPlugin({ + handler: (percent, msg, addInfo) => { + percent = Math.floor(percent * 100); - if (percent === 100) { - msg = 'Compilation completed'; - } + if (percent === 100) { + msg = 'Compilation completed'; + } - if (addInfo) { - msg = `${msg} (${addInfo})`; - } + if (addInfo) { + msg = `${msg} (${addInfo})`; + } - this.sockWrite(this.sockets, 'progress-update', { percent, msg }); + this.sockWrite(this.sockets, 'progress-update', { percent, msg }); + }, + profile: !!this.options.profile, }); progressPlugin.apply(this.compiler); diff --git a/lib/utils/ProgressPlugin.js b/lib/utils/ProgressPlugin.js index be7392d321..0bb717ccd4 100644 --- a/lib/utils/ProgressPlugin.js +++ b/lib/utils/ProgressPlugin.js @@ -121,7 +121,14 @@ class ProgressPlugin { apply(compiler) { const { modulesCount } = this; - const handler = this.handler || createDefaultHandler(this.profile); + const defaultHandler = createDefaultHandler(this.profile); + // const handler = this.handler || createDefaultHandler(this.profile); + const handler = (...args) => { + defaultHandler(...args); + if (this.handler) { + this.handler(...args); + } + }; const showEntries = this.showEntries; const showModules = this.showModules; const showActiveModules = this.showActiveModules; @@ -211,7 +218,7 @@ class ProgressPlugin { update(); }; - compiler.hooks.compilation.tap('ProgressPlugin2', (compilation) => { + compiler.hooks.compilation.tap('ProgressPlugin', (compilation) => { if (compilation.compiler.isChild()) return; lastModulesCount = moduleCount; lastEntriesCount = entriesCount; @@ -219,13 +226,13 @@ class ProgressPlugin { doneModules = doneEntries = 0; handler(0, 'compiling'); - compilation.hooks.buildModule.tap('ProgressPlugin2', moduleAdd); - compilation.hooks.failedModule.tap('ProgressPlugin2', moduleDone); - compilation.hooks.succeedModule.tap('ProgressPlugin2', moduleDone); + compilation.hooks.buildModule.tap('ProgressPlugin', moduleAdd); + compilation.hooks.failedModule.tap('ProgressPlugin', moduleDone); + compilation.hooks.succeedModule.tap('ProgressPlugin', moduleDone); - compilation.hooks.addEntry.tap('ProgressPlugin2', entryAdd); - compilation.hooks.failedEntry.tap('ProgressPlugin2', entryDone); - compilation.hooks.succeedEntry.tap('ProgressPlugin2', entryDone); + compilation.hooks.addEntry.tap('ProgressPlugin', entryAdd); + compilation.hooks.failedEntry.tap('ProgressPlugin', entryDone); + compilation.hooks.succeedEntry.tap('ProgressPlugin', entryDone); const hooks = { finishModules: 'finish module graph', @@ -285,7 +292,7 @@ class ProgressPlugin { const title = hooks[name]; const percentage = (idx / numberOfHooks) * 0.25 + 0.7; compilation.hooks[name].intercept({ - name: 'ProgressPlugin2', + name: 'ProgressPlugin', context: true, call: () => { handler(percentage, title); @@ -304,7 +311,7 @@ class ProgressPlugin { }); }); compiler.hooks.emit.intercept({ - name: 'ProgressPlugin2', + name: 'ProgressPlugin', context: true, call: () => { handler(0.95, 'emitting'); @@ -319,7 +326,7 @@ class ProgressPlugin { }, }); compiler.hooks.afterEmit.intercept({ - name: 'ProgressPlugin2', + name: 'ProgressPlugin', context: true, call: () => { handler(0.98, 'after emitting'); @@ -333,7 +340,7 @@ class ProgressPlugin { handler(0.98, 'after emitting', tap.name); }, }); - compiler.hooks.done.tap('ProgressPlugin2', () => { + compiler.hooks.done.tap('ProgressPlugin', () => { handler(1, ''); }); } diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index 99ee9da58a..b93fecaac7 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,15 +48,14 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { - // console.log(res); - // // check that there is some percentage progress output - // const regExp = /^\[WDS\] [0-9]{1,3}% - /; - // const match = res.find((line) => { - // return regExp.test(line); - // }); - // // eslint-disable-next-line no-undefined - // expect(match).not.toEqual(undefined); - expect(res).toMatchSnapshot(); + console.log(res); + // check that there is some percentage progress output + const regExp = /^\[WDS\] [0-9]{1,3}% - /; + const match = res.find((line) => { + return regExp.test(line); + }); + // eslint-disable-next-line no-undefined + expect(match).not.toEqual(undefined); done(); }); }); diff --git a/test/e2e/__snapshots__/Progress.test.js.snap b/test/e2e/__snapshots__/Progress.test.js.snap deleted file mode 100644 index 500d80e045..0000000000 --- a/test/e2e/__snapshots__/Progress.test.js.snap +++ /dev/null @@ -1,99 +0,0 @@ -// Jest Snapshot v1, https://goo.gl/fbAQLP - -exports[`client progress using hot on browser client should console.log progress 1`] = ` -Array [ - "[HMR] Waiting for update signal from WDS...", - "[WDS] Hot Module Replacement enabled.", - "[WDS] Live Reloading enabled.", - "[WDS] App updated. Recompiling...", - "[WDS] App updated. Recompiling...", - "[WDS] 0% - compiling.", - "[WDS] 10% - building (0/0 modules).", - "[WDS] 10% - building (0/0 modules).", - "[WDS] 10% - building (0/1 modules).", - "[WDS] 40% - building (0/1 modules).", - "[WDS] 40% - building (1/1 modules).", - "[WDS] 70% - building (1/1 modules).", - "[WDS] 70% - finish module graph.", - "[WDS] 70% - finish module graph (FlagDependencyExportsPlugin).", - "[WDS] 70% - sealing.", - "[WDS] 70% - sealing (WarnCaseSensitiveModulesPlugin).", - "[WDS] 71% - basic dependencies optimization.", - "[WDS] 72% - dependencies optimization.", - "[WDS] 72% - advanced dependencies optimization.", - "[WDS] 73% - after dependencies optimization.", - "[WDS] 70% - chunk graph.", - "[WDS] 71% - after chunk graph.", - "[WDS] 71% - after chunk graph (WebAssemblyModulesPlugin).", - "[WDS] 73% - optimizing.", - "[WDS] 74% - basic module optimization.", - "[WDS] 74% - module optimization.", - "[WDS] 75% - advanced module optimization.", - "[WDS] 75% - after module optimization.", - "[WDS] 76% - basic chunk optimization.", - "[WDS] 76% - basic chunk optimization (EnsureChunkConditionsPlugin).", - "[WDS] 76% - basic chunk optimization (RemoveParentModulesPlugin).", - "[WDS] 76% - basic chunk optimization (RemoveEmptyChunksPlugin).", - "[WDS] 76% - basic chunk optimization (MergeDuplicateChunksPlugin).", - "[WDS] 76% - chunk optimization.", - "[WDS] 77% - advanced chunk optimization.", - "[WDS] 77% - advanced chunk optimization (SplitChunksPlugin).", - "[WDS] 77% - advanced chunk optimization (RemoveEmptyChunksPlugin).", - "[WDS] 77% - after chunk optimization.", - "[WDS] 78% - module and chunk tree optimization.", - "[WDS] 78% - after module and chunk tree optimization.", - "[WDS] 79% - basic chunk modules optimization.", - "[WDS] 79% - chunk modules optimization.", - "[WDS] 80% - advanced chunk modules optimization.", - "[WDS] 80% - after chunk modules optimization.", - "[WDS] 81% - module reviving.", - "[WDS] 81% - module reviving (RecordIdsPlugin).", - "[WDS] 81% - module order optimization.", - "[WDS] 82% - advanced module order optimization.", - "[WDS] 82% - before module ids.", - "[WDS] 82% - before module ids (NamedModulesPlugin).", - "[WDS] 83% - module ids.", - "[WDS] 83% - module id optimization.", - "[WDS] 84% - module id optimization.", - "[WDS] 84% - chunk reviving.", - "[WDS] 84% - chunk reviving (RecordIdsPlugin).", - "[WDS] 85% - chunk order optimization.", - "[WDS] 85% - chunk order optimization (OccurrenceOrderChunkIdsPlugin).", - "[WDS] 85% - before chunk ids.", - "[WDS] 85% - before chunk ids (NamedChunksPlugin).", - "[WDS] 86% - chunk id optimization.", - "[WDS] 86% - after chunk id optimization.", - "[WDS] 87% - record modules.", - "[WDS] 87% - record modules (RecordIdsPlugin).", - "[WDS] 87% - record chunks.", - "[WDS] 87% - record chunks (RecordIdsPlugin).", - "[WDS] 88% - hashing.", - "[WDS] 88% - content hashing.", - "[WDS] 88% - content hashing (JavascriptModulesPlugin).", - "[WDS] 89% - after hashing.", - "[WDS] 89% - after hashing (HotModuleReplacementPlugin).", - "[WDS] 89% - record hash.", - "[WDS] 90% - module assets processing.", - "[WDS] 90% - chunk assets processing.", - "[WDS] 91% - additional chunk assets processing.", - "[WDS] 91% - additional chunk assets processing (HotModuleReplacementPlugin).", - "[WDS] 91% - recording.", - "[WDS] 91% - recording (HotModuleReplacementPlugin).", - "[WDS] 92% - additional asset processing.", - "[WDS] 92% - chunk asset optimization.", - "[WDS] 93% - after chunk asset optimization.", - "[WDS] 93% - asset optimization.", - "[WDS] 94% - after asset optimization.", - "[WDS] 94% - after seal.", - "[WDS] 95% - emitting.", - "[WDS] 98% - after emitting.", - "[WDS] 100% - Compilation completed.", - "[WDS] App hot update...", - "[HMR] Checking for updates on the server...", - "[HMR] Updated modules:", - "[HMR] - ./main.css", - "[HMR] - ../../../node_modules/css-loader/dist/cjs.js!./main.css", - "", - "[HMR] App is up to date.", -] -`; From ce5603eef052ddbedbe8595cedf6db67312c27fc Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 13:55:25 -0500 Subject: [PATCH 16/22] test(client): more testing to identify progress problem --- client-src/default/index.js | 1 + lib/Server.js | 18 +- lib/utils/ProgressPlugin.js | 359 ------------------------------------ 3 files changed, 10 insertions(+), 368 deletions(-) delete mode 100644 lib/utils/ProgressPlugin.js diff --git a/client-src/default/index.js b/client-src/default/index.js index dede6f0763..9bf69d4da9 100644 --- a/client-src/default/index.js +++ b/client-src/default/index.js @@ -85,6 +85,7 @@ const onSocketMessage = { } }, 'progress-update': function progressUpdate(data) { + console.log(data.msg); if (options.useProgress) { log.info(`[WDS] ${data.percent}% - ${data.msg}.`); } diff --git a/lib/Server.js b/lib/Server.js index cc43f5c992..762beca59e 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -20,6 +20,7 @@ const httpProxyMiddleware = require('http-proxy-middleware'); const historyApiFallback = require('connect-history-api-fallback'); const compress = require('compression'); const serveIndex = require('serve-index'); +const webpack = require('webpack'); const webpackDevMiddleware = require('webpack-dev-middleware'); const validateOptions = require('schema-utils'); const updateCompiler = require('./utils/updateCompiler'); @@ -30,7 +31,6 @@ const createDomain = require('./utils/createDomain'); const runBonjour = require('./utils/runBonjour'); const routes = require('./utils/routes'); const getSocketServerImplementation = require('./utils/getSocketServerImplementation'); -const ProgressPlugin = require('./utils/ProgressPlugin'); const schema = require('./options.json'); // Workaround for node ^8.6.0, ^9.0.0 @@ -153,12 +153,12 @@ class Server { } setupProgressPlugin() { - // new webpack.ProgressPlugin({ - // profile: !!this.options.profile, - // }).apply(this.compiler); + new webpack.ProgressPlugin({ + profile: !!this.options.profile, + }).apply(this.compiler); - const progressPlugin = new ProgressPlugin({ - handler: (percent, msg, addInfo) => { + const progressPlugin = new webpack.ProgressPlugin( + (percent, msg, addInfo) => { percent = Math.floor(percent * 100); if (percent === 100) { @@ -169,10 +169,10 @@ class Server { msg = `${msg} (${addInfo})`; } + this.log.warn(`progress-update: ${percent} ${msg}`); this.sockWrite(this.sockets, 'progress-update', { percent, msg }); - }, - profile: !!this.options.profile, - }); + } + ); progressPlugin.apply(this.compiler); } diff --git a/lib/utils/ProgressPlugin.js b/lib/utils/ProgressPlugin.js deleted file mode 100644 index 0bb717ccd4..0000000000 --- a/lib/utils/ProgressPlugin.js +++ /dev/null @@ -1,359 +0,0 @@ -/* - MIT License http://www.opensource.org/licenses/mit-license.php - Author Tobias Koppers @sokra -*/ - -'use strict'; - -/* eslint-disable line-comment-position, no-continue, no-use-before-define, no-shadow, no-plusplus, no-unused-vars, no-multi-assign */ - -const validateOptions = require('schema-utils'); -const schema = require('webpack/schemas/plugins/ProgressPlugin.json'); - -/** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginArgument} ProgressPluginArgument */ -/** @typedef {import("../declarations/plugins/ProgressPlugin").ProgressPluginOptions} ProgressPluginOptions */ - -const createDefaultHandler = (profile) => { - let lineCaretPosition = 0; - let lastMessage = ''; - let lastState; - let lastStateTime; - - const defaultHandler = (percentage, msg, ...args) => { - let state = msg; - const details = args.filter((v) => v.length); - const maxLineLength = process.stderr.columns || Infinity; - if (percentage < 1) { - percentage = Math.floor(percentage * 100); - msg = `${percentage}% ${msg}`; - if (percentage < 100) { - msg = ` ${msg}`; - } - if (percentage < 10) { - msg = ` ${msg}`; - } - - if (details.length) { - const maxTotalDetailsLength = maxLineLength - msg.length; - const totalDetailsLength = details.reduce( - (a, b) => a + b.length, - details.length // account for added space before each detail text - ); - const maxDetailLength = - totalDetailsLength < maxTotalDetailsLength - ? Infinity - : Math.floor(maxTotalDetailsLength / details.length); - - for (let detail of details) { - if (!detail) continue; - if (detail.length + 1 > maxDetailLength) { - const truncatePrefix = '...'; - detail = `${truncatePrefix}${detail.substr( - -(maxDetailLength - truncatePrefix.length - 1) - )}`; - } - msg += ` ${detail}`; - } - } - } - if (profile) { - state = state.replace(/^\d+\/\d+\s+/, ''); - if (percentage === 0) { - lastState = null; - lastStateTime = Date.now(); - } else if (state !== lastState || percentage === 1) { - const now = Date.now(); - if (lastState) { - const stateMsg = `${now - lastStateTime}ms ${lastState}`; - goToLineStart(stateMsg); - process.stderr.write(`${stateMsg}\n`); - lineCaretPosition = 0; - } - lastState = state; - lastStateTime = now; - } - } - if (lastMessage !== msg) { - goToLineStart(msg); - msg = msg.substring(0, maxLineLength); - process.stderr.write(msg); - lastMessage = msg; - } - }; - - const goToLineStart = (nextMessage) => { - let str = ''; - for (; lineCaretPosition > nextMessage.length; lineCaretPosition--) { - str += '\b \b'; - } - for (let i = 0; i < lineCaretPosition; i++) { - str += '\b'; - } - lineCaretPosition = nextMessage.length; - if (str) process.stderr.write(str); - }; - - return defaultHandler; -}; - -class ProgressPlugin { - /** - * @param {ProgressPluginArgument} options options - */ - constructor(options) { - if (typeof options === 'function') { - options = { - handler: options, - }; - } - - options = options || {}; - validateOptions(schema, options, 'Progress Plugin'); - options = Object.assign({}, ProgressPlugin.defaultOptions, options); - - this.profile = options.profile; - this.handler = options.handler; - this.modulesCount = options.modulesCount; - this.showEntries = options.entries; - this.showModules = options.modules; - this.showActiveModules = options.activeModules; - } - - apply(compiler) { - const { modulesCount } = this; - const defaultHandler = createDefaultHandler(this.profile); - // const handler = this.handler || createDefaultHandler(this.profile); - const handler = (...args) => { - defaultHandler(...args); - if (this.handler) { - this.handler(...args); - } - }; - const showEntries = this.showEntries; - const showModules = this.showModules; - const showActiveModules = this.showActiveModules; - if (compiler.compilers) { - const states = new Array(compiler.compilers.length); - compiler.compilers.forEach((compiler, idx) => { - new ProgressPlugin((p, msg, ...args) => { - states[idx] = [p, msg, ...args]; - handler( - states - .map((state) => (state && state[0]) || 0) - .reduce((a, b) => a + b) / states.length, - `[${idx}] ${msg}`, - ...args - ); - }).apply(compiler); - }); - } else { - let lastModulesCount = 0; - let lastEntriesCount = 0; - let moduleCount = modulesCount; - let entriesCount = 1; - let doneModules = 0; - let doneEntries = 0; - const activeModules = new Set(); - let lastActiveModule = ''; - - const update = () => { - const percentByModules = - doneModules / Math.max(lastModulesCount, moduleCount); - const percentByEntries = - doneEntries / Math.max(lastEntriesCount, entriesCount); - - const items = [ - 0.1 + Math.max(percentByModules, percentByEntries) * 0.6, - 'building', - ]; - if (showEntries) { - items.push(`${doneEntries}/${entriesCount} entries`); - } - if (showModules) { - items.push(`${doneModules}/${moduleCount} modules`); - } - if (showActiveModules) { - items.push(`${activeModules.size} active`); - items.push(lastActiveModule); - } - handler(...items); - }; - - const moduleAdd = (module) => { - moduleCount++; - if (showActiveModules) { - const ident = module.identifier(); - if (ident) { - activeModules.add(ident); - lastActiveModule = ident; - } - } - update(); - }; - - const entryAdd = (entry, name) => { - entriesCount++; - update(); - }; - - const moduleDone = (module) => { - doneModules++; - if (showActiveModules) { - const ident = module.identifier(); - if (ident) { - activeModules.delete(ident); - if (lastActiveModule === ident) { - lastActiveModule = ''; - for (const m of activeModules) { - lastActiveModule = m; - } - } - } - } - update(); - }; - - const entryDone = (entry, name) => { - doneEntries++; - update(); - }; - - compiler.hooks.compilation.tap('ProgressPlugin', (compilation) => { - if (compilation.compiler.isChild()) return; - lastModulesCount = moduleCount; - lastEntriesCount = entriesCount; - moduleCount = entriesCount = 0; - doneModules = doneEntries = 0; - handler(0, 'compiling'); - - compilation.hooks.buildModule.tap('ProgressPlugin', moduleAdd); - compilation.hooks.failedModule.tap('ProgressPlugin', moduleDone); - compilation.hooks.succeedModule.tap('ProgressPlugin', moduleDone); - - compilation.hooks.addEntry.tap('ProgressPlugin', entryAdd); - compilation.hooks.failedEntry.tap('ProgressPlugin', entryDone); - compilation.hooks.succeedEntry.tap('ProgressPlugin', entryDone); - - const hooks = { - finishModules: 'finish module graph', - seal: 'sealing', - beforeChunks: 'chunk graph', - afterChunks: 'after chunk graph', - optimizeDependenciesBasic: 'basic dependencies optimization', - optimizeDependencies: 'dependencies optimization', - optimizeDependenciesAdvanced: 'advanced dependencies optimization', - afterOptimizeDependencies: 'after dependencies optimization', - optimize: 'optimizing', - optimizeModulesBasic: 'basic module optimization', - optimizeModules: 'module optimization', - optimizeModulesAdvanced: 'advanced module optimization', - afterOptimizeModules: 'after module optimization', - optimizeChunksBasic: 'basic chunk optimization', - optimizeChunks: 'chunk optimization', - optimizeChunksAdvanced: 'advanced chunk optimization', - afterOptimizeChunks: 'after chunk optimization', - optimizeTree: 'module and chunk tree optimization', - afterOptimizeTree: 'after module and chunk tree optimization', - optimizeChunkModulesBasic: 'basic chunk modules optimization', - optimizeChunkModules: 'chunk modules optimization', - optimizeChunkModulesAdvanced: 'advanced chunk modules optimization', - afterOptimizeChunkModules: 'after chunk modules optimization', - reviveModules: 'module reviving', - optimizeModuleOrder: 'module order optimization', - advancedOptimizeModuleOrder: 'advanced module order optimization', - beforeModuleIds: 'before module ids', - moduleIds: 'module ids', - optimizeModuleIds: 'module id optimization', - afterOptimizeModuleIds: 'module id optimization', - reviveChunks: 'chunk reviving', - optimizeChunkOrder: 'chunk order optimization', - beforeChunkIds: 'before chunk ids', - optimizeChunkIds: 'chunk id optimization', - afterOptimizeChunkIds: 'after chunk id optimization', - recordModules: 'record modules', - recordChunks: 'record chunks', - beforeHash: 'hashing', - contentHash: 'content hashing', - afterHash: 'after hashing', - recordHash: 'record hash', - beforeModuleAssets: 'module assets processing', - beforeChunkAssets: 'chunk assets processing', - additionalChunkAssets: 'additional chunk assets processing', - record: 'recording', - additionalAssets: 'additional asset processing', - optimizeChunkAssets: 'chunk asset optimization', - afterOptimizeChunkAssets: 'after chunk asset optimization', - optimizeAssets: 'asset optimization', - afterOptimizeAssets: 'after asset optimization', - afterSeal: 'after seal', - }; - const numberOfHooks = Object.keys(hooks).length; - Object.keys(hooks).forEach((name, idx) => { - const title = hooks[name]; - const percentage = (idx / numberOfHooks) * 0.25 + 0.7; - compilation.hooks[name].intercept({ - name: 'ProgressPlugin', - context: true, - call: () => { - handler(percentage, title); - }, - tap: (context, tap) => { - if (context) { - // p is percentage from 0 to 1 - // args is any number of messages in a hierarchical matter - context.reportProgress = (p, ...args) => { - handler(percentage, title, tap.name, ...args); - }; - } - handler(percentage, title, tap.name); - }, - }); - }); - }); - compiler.hooks.emit.intercept({ - name: 'ProgressPlugin', - context: true, - call: () => { - handler(0.95, 'emitting'); - }, - tap: (context, tap) => { - if (context) { - context.reportProgress = (p, ...args) => { - handler(0.95, 'emitting', tap.name, ...args); - }; - } - handler(0.95, 'emitting', tap.name); - }, - }); - compiler.hooks.afterEmit.intercept({ - name: 'ProgressPlugin', - context: true, - call: () => { - handler(0.98, 'after emitting'); - }, - tap: (context, tap) => { - if (context) { - context.reportProgress = (p, ...args) => { - handler(0.98, 'after emitting', tap.name, ...args); - }; - } - handler(0.98, 'after emitting', tap.name); - }, - }); - compiler.hooks.done.tap('ProgressPlugin', () => { - handler(1, ''); - }); - } - } -} - -ProgressPlugin.defaultOptions = { - profile: false, - modulesCount: 500, - modules: true, - activeModules: true, - // TODO webpack 5 default this to true - entries: false, -}; - -module.exports = ProgressPlugin; From ea99c9facb78934659b6d682c925a95187de7707 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 14:28:19 -0500 Subject: [PATCH 17/22] test(client): test with 1 progress plugin --- lib/Server.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/Server.js b/lib/Server.js index 762beca59e..ca98c4a4c8 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -153,9 +153,9 @@ class Server { } setupProgressPlugin() { - new webpack.ProgressPlugin({ - profile: !!this.options.profile, - }).apply(this.compiler); + // new webpack.ProgressPlugin({ + // profile: !!this.options.profile, + // }).apply(this.compiler); const progressPlugin = new webpack.ProgressPlugin( (percent, msg, addInfo) => { From 9d9aa2400f9940c6db426c0bc6ac34b669ed50bb Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 14:47:20 -0500 Subject: [PATCH 18/22] test(client): new console.log to test sending of data --- lib/Server.js | 2 +- test/e2e/Progress.test.js | 4 ++-- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/Server.js b/lib/Server.js index ca98c4a4c8..fbebacfba3 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -169,7 +169,7 @@ class Server { msg = `${msg} (${addInfo})`; } - this.log.warn(`progress-update: ${percent} ${msg}`); + console.log(`progress-update: ${percent} ${msg}`); this.sockWrite(this.sockets, 'progress-update', { percent, msg }); } ); diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index b93fecaac7..aa2110e1da 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -62,8 +62,8 @@ describe('client progress', () => { }); page.goto(`http://localhost:${port}/main`); - page.on('console', ({ _text }) => { - res.push(_text); + page.on('console', (data) => { + res.push(data.text()); }); }); }); From ad7a5b59b96fd726d74e012d43c662759daca305 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 17:54:13 -0500 Subject: [PATCH 19/22] feat(server): re-add two progress plugins --- lib/Server.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/lib/Server.js b/lib/Server.js index fbebacfba3..b73aaf76bd 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -153,9 +153,9 @@ class Server { } setupProgressPlugin() { - // new webpack.ProgressPlugin({ - // profile: !!this.options.profile, - // }).apply(this.compiler); + new webpack.ProgressPlugin({ + profile: !!this.options.profile, + }).apply(this.compiler); const progressPlugin = new webpack.ProgressPlugin( (percent, msg, addInfo) => { From 8faed38a1791c8e3917d92ac0854fe72d5fcea64 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Sat, 15 Jun 2019 19:07:06 -0500 Subject: [PATCH 20/22] test(client): revert to original changes --- client-src/default/index.js | 1 - lib/Server.js | 1 - test/e2e/Progress.test.js | 1 - 3 files changed, 3 deletions(-) diff --git a/client-src/default/index.js b/client-src/default/index.js index 9bf69d4da9..dede6f0763 100644 --- a/client-src/default/index.js +++ b/client-src/default/index.js @@ -85,7 +85,6 @@ const onSocketMessage = { } }, 'progress-update': function progressUpdate(data) { - console.log(data.msg); if (options.useProgress) { log.info(`[WDS] ${data.percent}% - ${data.msg}.`); } diff --git a/lib/Server.js b/lib/Server.js index b73aaf76bd..696d68ebaf 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -169,7 +169,6 @@ class Server { msg = `${msg} (${addInfo})`; } - console.log(`progress-update: ${percent} ${msg}`); this.sockWrite(this.sockets, 'progress-update', { percent, msg }); } ); diff --git a/test/e2e/Progress.test.js b/test/e2e/Progress.test.js index aa2110e1da..dd1a3588a6 100644 --- a/test/e2e/Progress.test.js +++ b/test/e2e/Progress.test.js @@ -48,7 +48,6 @@ describe('client progress', () => { ); page.waitFor(10000).then(() => { browser.close().then(() => { - console.log(res); // check that there is some percentage progress output const regExp = /^\[WDS\] [0-9]{1,3}% - /; const match = res.find((line) => { From 4741e21ea1535b86b8ee358fbc9a84af61a1cc80 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Mon, 24 Jun 2019 11:41:11 -0500 Subject: [PATCH 21/22] test(progress): added progress and profile option tests --- lib/Server.js | 24 ++++++------- test/ports-map.js | 2 ++ test/server/profile-option.test.js | 53 +++++++++++++++++++++++++++++ test/server/progress-option.test.js | 51 +++++++++++++++++++++++++++ 4 files changed, 117 insertions(+), 13 deletions(-) create mode 100644 test/server/profile-option.test.js create mode 100644 test/server/progress-option.test.js diff --git a/lib/Server.js b/lib/Server.js index 696d68ebaf..1f7f5097fb 100644 --- a/lib/Server.js +++ b/lib/Server.js @@ -153,27 +153,25 @@ class Server { } setupProgressPlugin() { + // for CLI output new webpack.ProgressPlugin({ profile: !!this.options.profile, }).apply(this.compiler); - const progressPlugin = new webpack.ProgressPlugin( - (percent, msg, addInfo) => { - percent = Math.floor(percent * 100); + // for browser console output + new webpack.ProgressPlugin((percent, msg, addInfo) => { + percent = Math.floor(percent * 100); - if (percent === 100) { - msg = 'Compilation completed'; - } - - if (addInfo) { - msg = `${msg} (${addInfo})`; - } + if (percent === 100) { + msg = 'Compilation completed'; + } - this.sockWrite(this.sockets, 'progress-update', { percent, msg }); + if (addInfo) { + msg = `${msg} (${addInfo})`; } - ); - progressPlugin.apply(this.compiler); + this.sockWrite(this.sockets, 'progress-update', { percent, msg }); + }).apply(this.compiler); } setupApp() { diff --git a/test/ports-map.js b/test/ports-map.js index 791d0f29b9..551a9f514f 100644 --- a/test/ports-map.js +++ b/test/ports-map.js @@ -41,6 +41,8 @@ const portsList = { ClientMode: 1, 'clientMode-option': 1, Progress: 1, + 'progress-option': 1, + 'profile-option': 1, }; let startPort = 8079; diff --git a/test/server/profile-option.test.js b/test/server/profile-option.test.js new file mode 100644 index 0000000000..5806a57e3a --- /dev/null +++ b/test/server/profile-option.test.js @@ -0,0 +1,53 @@ +'use strict'; + +const webpack = require('webpack'); +const Server = require('../../lib/Server'); +const config = require('../fixtures/simple-config/webpack.config'); +const port = require('../ports-map')['progress-option']; + +describe('profile', () => { + describe('output', () => { + let mockStderr; + + beforeAll(() => { + mockStderr = jest + .spyOn(process.stderr, 'write') + .mockImplementation(() => {}); + }); + + it('should show percentage progress with profile data', (done) => { + const compiler = webpack(config); + const server = new Server(compiler, { + port, + // profile will only have an effect when progress is enabled + progress: true, + profile: true, + }); + + compiler.hooks.done.tap('webpack-dev-server', () => { + const calls = mockStderr.mock.calls; + mockStderr.mockRestore(); + let foundProgress = false; + let foundProfile = false; + calls.forEach((call) => { + if (call[0].includes('0% compiling')) { + foundProgress = true; + } + + // this is an indicator that the profile option is enabled, + // so we should expect to find it in stderr since profile is enabled + if (call[0].includes('ms after chunk modules optimization')) { + foundProfile = true; + } + }); + expect(foundProgress).toBeTruthy(); + expect(foundProfile).toBeTruthy(); + + server.close(done); + }); + + compiler.run(() => {}); + server.listen(port, 'localhost'); + }); + }); +}); diff --git a/test/server/progress-option.test.js b/test/server/progress-option.test.js new file mode 100644 index 0000000000..ae2d23c07f --- /dev/null +++ b/test/server/progress-option.test.js @@ -0,0 +1,51 @@ +'use strict'; + +const webpack = require('webpack'); +const Server = require('../../lib/Server'); +const config = require('../fixtures/simple-config/webpack.config'); +const port = require('../ports-map')['progress-option']; + +describe('progress', () => { + describe('output', () => { + let mockStderr; + + beforeAll(() => { + mockStderr = jest + .spyOn(process.stderr, 'write') + .mockImplementation(() => {}); + }); + + it('should show percentage progress without profile data', (done) => { + const compiler = webpack(config); + const server = new Server(compiler, { + port, + progress: true, + }); + + compiler.hooks.done.tap('webpack-dev-server', () => { + const calls = mockStderr.mock.calls; + mockStderr.mockRestore(); + let foundProgress = false; + let foundProfile = false; + calls.forEach((call) => { + if (call[0].includes('0% compiling')) { + foundProgress = true; + } + + // this is an indicator that the profile option is enabled, + // so we should expect to not find it in stderr since it is not enabled + if (call[0].includes('ms after chunk modules optimization')) { + foundProfile = true; + } + }); + expect(foundProgress).toBeTruthy(); + expect(foundProfile).toBeFalsy(); + + server.close(done); + }); + + compiler.run(() => {}); + server.listen(port, 'localhost'); + }); + }); +}); From 0b898ec6f4431af146f38929e876df2178419a47 Mon Sep 17 00:00:00 2001 From: Kirill Nagaitsev Date: Mon, 24 Jun 2019 12:25:04 -0500 Subject: [PATCH 22/22] fix(test): fix profile test port map --- test/server/profile-option.test.js | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/test/server/profile-option.test.js b/test/server/profile-option.test.js index 5806a57e3a..025e502d4f 100644 --- a/test/server/profile-option.test.js +++ b/test/server/profile-option.test.js @@ -3,7 +3,7 @@ const webpack = require('webpack'); const Server = require('../../lib/Server'); const config = require('../fixtures/simple-config/webpack.config'); -const port = require('../ports-map')['progress-option']; +const port = require('../ports-map')['profile-option']; describe('profile', () => { describe('output', () => {