From c2a3d4f35a035cf7470b0c355e30b0c6f6d01941 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Fri, 16 Aug 2019 10:47:50 -0700 Subject: [PATCH 1/6] Bump lodash from 4.17.11 to 4.17.15 (#290) Bumps [lodash](https://github.com/lodash/lodash) from 4.17.11 to 4.17.15. - [Release notes](https://github.com/lodash/lodash/releases) - [Commits](https://github.com/lodash/lodash/compare/4.17.11...4.17.15) Signed-off-by: dependabot[bot] --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index ad11665..069b2f3 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2648,9 +2648,9 @@ lodash.upperfirst@4.3.1: integrity sha1-E2Xt9DFIBIHvDRxolXpe2Z1J984= lodash@^4.17.11: - version "4.17.11" - resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.11.tgz#b39ea6229ef607ecd89e2c8df12536891cac9b8d" - integrity sha512-cQKh8igo5QUhZ7lg38DYWAxMvjSAKG0A8wGSVimP07SIUEK2UO+arSRKbRZWtelMtN5V0Hkwh5ryOto/SshYIg== + version "4.17.15" + resolved "https://registry.yarnpkg.com/lodash/-/lodash-4.17.15.tgz#b447f6670a0455bbfeedd11392eff330ea097548" + integrity sha512-8xOcRHvCjnocdS5cpwXQXVzmmh5e5+saE2QGoeQmbKmRS6J3VQppPOIt0MnmE+4xlZoumy0GPG0D0MVIQbNA1A== lolex@^2.3.2, lolex@^2.4.2: version "2.7.5" From ad73aedd15235455cc78f97471f9487fcaf6e597 Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 27 Aug 2019 12:30:47 -0700 Subject: [PATCH 2/6] Bump eslint-utils from 1.3.1 to 1.4.2 (#292) Bumps [eslint-utils](https://github.com/mysticatea/eslint-utils) from 1.3.1 to 1.4.2. - [Release notes](https://github.com/mysticatea/eslint-utils/releases) - [Commits](https://github.com/mysticatea/eslint-utils/compare/v1.3.1...v1.4.2) Signed-off-by: dependabot[bot] --- yarn.lock | 14 ++++++++------ 1 file changed, 8 insertions(+), 6 deletions(-) diff --git a/yarn.lock b/yarn.lock index 069b2f3..212c677 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1473,14 +1473,16 @@ eslint-scope@^4.0.0, eslint-scope@^4.0.3: estraverse "^4.1.1" eslint-utils@^1.3.1: - version "1.3.1" - resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-1.3.1.tgz#9a851ba89ee7c460346f97cf8939c7298827e512" - integrity sha512-Z7YjnIldX+2XMcjr7ZkgEsOj/bREONV60qYeB/bjMAqqqZ4zxKyWX+BOUkdmRmA9riiIPVvo5x86m5elviOk0Q== + version "1.4.2" + resolved "https://registry.yarnpkg.com/eslint-utils/-/eslint-utils-1.4.2.tgz#166a5180ef6ab7eb462f162fd0e6f2463d7309ab" + integrity sha512-eAZS2sEUMlIeCjBeubdj45dmBHQwPHWyBcT1VSYB7o9x9WRRqKxyUoiXlRjyAwzN7YEzHJlYg0NmzDRWx6GP4Q== + dependencies: + eslint-visitor-keys "^1.0.0" eslint-visitor-keys@^1.0.0: - version "1.0.0" - resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.0.0.tgz#3f3180fb2e291017716acb4c9d6d5b5c34a6a81d" - integrity sha512-qzm/XxIbxm/FHyH341ZrbnMUpe+5Bocte9xkmFMzPMjRaZMcXww+MpBptFvtU+79L362nqiLhekCxCxDPaUMBQ== + version "1.1.0" + resolved "https://registry.yarnpkg.com/eslint-visitor-keys/-/eslint-visitor-keys-1.1.0.tgz#e2a82cea84ff246ad6fb57f9bde5b46621459ec2" + integrity sha512-8y9YjtM1JBJU/A9Kc+SbaOV4y29sSWckBwMHa+FGtVj5gN/sbnKDf6xJUl+8g7FAij9LVaP8C24DUiH/f/2Z9A== eslint@^5.16.0: version "5.16.0" From ea109dd1ef1c8e94bf69a339cb55243bf73b2f2a Mon Sep 17 00:00:00 2001 From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com> Date: Tue, 27 Aug 2019 14:48:21 -0700 Subject: [PATCH 3/6] Bump mixin-deep from 1.3.1 to 1.3.2 (#293) Bumps [mixin-deep](https://github.com/jonschlinkert/mixin-deep) from 1.3.1 to 1.3.2. - [Release notes](https://github.com/jonschlinkert/mixin-deep/releases) - [Commits](https://github.com/jonschlinkert/mixin-deep/compare/1.3.1...1.3.2) Signed-off-by: dependabot[bot] --- yarn.lock | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/yarn.lock b/yarn.lock index 212c677..a887951 100644 --- a/yarn.lock +++ b/yarn.lock @@ -2864,9 +2864,9 @@ mississippi@^3.0.0: through2 "^2.0.0" mixin-deep@^1.2.0: - version "1.3.1" - resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.1.tgz#a49e7268dce1a0d9698e45326c5626df3543d0fe" - integrity sha512-8ZItLHeEgaqEvd5lYBXfm4EZSFCX29Jb9K+lAHhDKzReKBQKj3R+7NOF6tjqYi9t4oI8VUfaWITJQm86wnXGNQ== + version "1.3.2" + resolved "https://registry.yarnpkg.com/mixin-deep/-/mixin-deep-1.3.2.tgz#1120b43dc359a785dce65b55b82e257ccf479566" + integrity sha512-WRoDn//mXBiJ1H40rqa3vH0toePwSsGb45iInWlTySa+Uu4k3tYUSxa2v1KqAiLtvlrSzaExqS1gtk96A9zvEA== dependencies: for-in "^1.0.2" is-extendable "^1.0.1" From 95e5ca1cd0cd4c1f263de08fb6e097ee69364d6e Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Tue, 27 Aug 2019 14:50:17 -0700 Subject: [PATCH 4/6] Feature: Include only specified assets in plugin and/or CLI. (#291) - Add `DashboardPlugin({ includeAssets: [ "stringPrefix", /regexObj/ ] })` Webpack plugin filtering option. - Add `webpack-dashboard --include-assets stringPrefix1 -a stringPrefix2` CLI filtering option. - Change `"mode"` SocketIO event to `"options"` as it now passes both `minimal` and `includeAssets` from CLI to the Webpack plugin. - Fix unit tests that incorrectly relied on `.complete()` for `most` observables. - Add additional `examples` fixture of `hello` for development (useful for this scenario to have 2). - Updates a really old README PNG of the dashboard CLI! - Replaces @wapgear 's great initial foray into an `--ignore-assets` flag. Closes #289 --- CHANGELOG.md | 8 +++ README.md | 4 +- bin/webpack-dashboard.js | 8 ++- examples/config/webpack.config.js | 9 ++- plugin/index.js | 29 +++++++++- test/dashboard/index.spec.js | 14 ++--- test/plugin/index.spec.js | 91 +++++++++++++++++++++++-------- 7 files changed, 127 insertions(+), 36 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 24cf2c6..c99bc0c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,6 +3,14 @@ This project adheres to [Semantic Versioning](http://semver.org/). Every release, along with the migration instructions, is documented on the Github [Releases](https://github.com/FormidableLabs/webpack-dashboard/releases) page. +## UNRELEASED + +- Add `DashboardPlugin({ includeAssets: [ "stringPrefix", /regexObj/ ] })` Webpack plugin filtering option. +- Add `webpack-dashboard --include-assets stringPrefix1 -a stringPrefix2` CLI filtering option. +- Change `"mode"` SocketIO event to `"options"` as it now passes both `minimal` and `includeAssets` from CLI to the Webpack plugin. +- Fix unit tests that incorrectly relied on `.complete()` for `most` observables. +- Add additional `examples` fixture for development. + ## [3.0.7] - 2019-05-15 ### Features diff --git a/README.md b/README.md index 034cf5a..1934fd2 100644 --- a/README.md +++ b/README.md @@ -15,7 +15,7 @@ When using webpack, especially for a dev server, you are probably used to seeing That's cool, but it's mostly noise and scrolly and not super helpful. This plugin changes that. Now when you run your dev server, you basically work at NASA: -![http://i.imgur.com/5BWa1hB.png](http://i.imgur.com/5BWa1hB.png) +![http://i.imgur.com/qL6dXJd.png](http://i.imgur.com/qL6dXJd.png) ### Install @@ -87,6 +87,7 @@ Webpack Dashboard works in Terminal, iTerm 2, and Hyper. For mouse events, like - `-m, --minimal` - Runs the dashboard in minimal mode - `-t, --title [title]` - Set title of terminal window - `-p, --port [port]` - Custom port for socket communication server +- `-a, --include-assets [string prefix]` - Limit display to asset names matching string prefix (option can be repeated and is concatenated to `new DashboardPlugin({ includeAssets })` options array) ##### Arguments @@ -98,6 +99,7 @@ Webpack Dashboard works in Terminal, iTerm 2, and Hyper. For mouse events, like - `host` - Custom host for connection the socket client - `port` - Custom port for connecting the socket client +- `includeAssets` - Limit display to asset names matching string prefix or regex (`Array`) - `handler` - Plugin handler method, i.e. `dashboard.setData` _Note: you can also just pass a function in as an argument, which then becomes the handler, i.e. `new DashboardPlugin(dashboard.setData)`_ diff --git a/bin/webpack-dashboard.js b/bin/webpack-dashboard.js index 0b27363..829e72e 100755 --- a/bin/webpack-dashboard.js +++ b/bin/webpack-dashboard.js @@ -12,6 +12,8 @@ const DEFAULT_PORT = 9838; const program = new commander.Command("webpack-dashboard"); const pkg = require("../package.json"); +const collect = (val, prev) => prev.concat([val]); + // Wrap up side effects in a script. // eslint-disable-next-line max-statements, complexity const main = (module.exports = opts => { @@ -24,6 +26,7 @@ const main = (module.exports = opts => { program.option("-m, --minimal", "Minimal mode"); program.option("-t, --title [title]", "Terminal window title"); program.option("-p, --port [port]", "Socket listener port"); + program.option("-a, --include-assets [string prefix]", "Asset names to limit to", collect, []); program.usage("[options] -- [script] [arguments]"); program.parse(argv); @@ -64,7 +67,10 @@ const main = (module.exports = opts => { if (logFromChild) { server.on("connection", socket => { - socket.emit("mode", { minimal: program.minimal || false }); + socket.emit("options", { + minimal: program.minimal || false, + includeAssets: program.includeAssets || [] + }); socket.on("message", (message, ack) => { if (message.type !== "log") { diff --git a/examples/config/webpack.config.js b/examples/config/webpack.config.js index 122ec39..32a99bc 100644 --- a/examples/config/webpack.config.js +++ b/examples/config/webpack.config.js @@ -14,7 +14,9 @@ module.exports = { devtool: false, context: resolve(cwd), entry: { - bundle: "./src/index.js" + bundle: "./src/index.js", + // Hard-code path to the "hello world" no-dep entry for 2+ asset testing + hello: "../simple/src/index.js" }, output: { path: resolve(cwd, "dist-development-4"), @@ -29,6 +31,9 @@ module.exports = { verbose: true, emitErrors: false }), - new Dashboard() + new Dashboard({ + // Optionally filter which assets to report on by string prefix or regex. + // includeAssets: ["bundle", /bund/] + }) ] }; diff --git a/plugin/index.js b/plugin/index.js index 4aa35b7..2bcc7b9 100644 --- a/plugin/index.js +++ b/plugin/index.js @@ -5,9 +5,9 @@ const most = require("most"); const webpack = require("webpack"); const SocketIOClient = require("socket.io-client"); -const { actions } = require("inspectpack"); +const inspectpack = require("inspectpack"); -const { serializeError } = require("../utils/error-serialization"); +const serializer = require("../utils/error-serialization"); const DEFAULT_PORT = 9838; const DEFAULT_HOST = "127.0.0.1"; @@ -55,6 +55,7 @@ class DashboardPlugin { options = options || {}; this.host = options.host || DEFAULT_HOST; this.port = options.port || DEFAULT_PORT; + this.includeAssets = options.includeAssets || []; this.handler = options.handler || null; } @@ -83,8 +84,9 @@ class DashboardPlugin { this.socket.on("connect", () => { handler = this.socket.emit.bind(this.socket, "message"); }); - this.socket.once("mode", args => { + this.socket.once("options", args => { this.minimal = args.minimal; + this.includeAssets = this.includeAssets.concat(args.includeAssets || []); }); this.socket.on("error", err => { // eslint-disable-next-line no-console @@ -232,6 +234,27 @@ class DashboardPlugin { // Get the **full** stats object here for `inspectpack` analysis. const statsToObserve = statsObj.toJson(); + // Truncate off non-included assets. + const { includeAssets } = this; + if (includeAssets.length) { + statsToObserve.assets = statsToObserve.assets.filter(({ name }) => + includeAssets.some(pattern => { + if (typeof pattern === "string") { + return name.startsWith(pattern); + } else if (pattern instanceof RegExp) { + return pattern.test(name); + } + + // Pass through bad options.. + return false; + }) + ); + } + + // Late destructure so that we can stub. + const { actions } = inspectpack; + const { serializeError } = serializer; + const getSizes = stats => actions("sizes", { stats }) .then(instance => instance.getData()) diff --git a/test/dashboard/index.spec.js b/test/dashboard/index.spec.js index 4c0aacb..6258b64 100644 --- a/test/dashboard/index.spec.js +++ b/test/dashboard/index.spec.js @@ -199,14 +199,14 @@ describe("dashboard", () => { } }; - const formattedData = [ - ["Name", "Size"], - ["foo", "456 B"], - ["bar", "123 B"], - ["Total", "579 B"] - ]; - it("can setSizes", () => { + const formattedData = [ + ["Name", "Size"], + ["foo", "456 B"], + ["bar", "123 B"], + ["Total", "579 B"] + ]; + expect(() => dashboard.setSizes(data)).to.not.throw; dashboard.setSizes(data); diff --git a/test/plugin/index.spec.js b/test/plugin/index.spec.js index aa7627b..9f8d1b0 100644 --- a/test/plugin/index.spec.js +++ b/test/plugin/index.spec.js @@ -1,7 +1,6 @@ "use strict"; const inspectpack = require("inspectpack"); -const most = require("most"); const base = require("../base.spec"); const Plugin = require("../../plugin"); @@ -38,8 +37,11 @@ describe("plugin", () => { let plugin; beforeEach(() => { - stats = {}; - toJson = base.sandbox.stub().returns(stats); + stats = { + modules: [], + assets: [] + }; + toJson = base.sandbox.stub().callsFake(() => stats); compilation = { errors: [], warnings: [], @@ -87,31 +89,76 @@ describe("plugin", () => { it("can do a basic observeMetrics", () => { const actions = base.sandbox.spy(inspectpack, "actions"); - const of = base.sandbox.spy(most, "of"); - const mergeArray = base.sandbox.spy(most, "mergeArray"); - - plugin.observeMetrics({ toJson }).subscribe({ - next: base.sandbox.spy(), - error: base.sandbox.spy(), - complete: () => { - expect(actions).to.have.been.calledThrice; - expect(of).to.have.been.calledTwice; - expect(mergeArray).to.have.been.called; - } + + return ( + plugin + .observeMetrics({ toJson }) + .drain() + // eslint-disable-next-line promise/always-return + .then(() => { + expect(actions).to.have.been.calledThrice; + }) + ); + }); + + it("filters assets for includeAssets", () => { + const actions = base.sandbox.spy(inspectpack, "actions"); + + stats = { + assets: [ + { + name: "one.js", + modules: [] + }, + { + name: "two.js", + modules: [] + }, + { + name: "three.js", + modules: [] + } + ] + }; + + plugin = new Plugin({ + includeAssets: [ + "one", // string prefix + /tw/ // regex match + ] }); + + return ( + plugin + .observeMetrics({ toJson }) + .drain() + // eslint-disable-next-line promise/always-return + .then(() => { + expect(actions).to.have.been.calledWith("sizes", { + stats: { + assets: [{ modules: [], name: "one.js" }, { modules: [], name: "two.js" }] + } + }); + }) + ); }); it("should serialize errors when encountered", () => { - base.sandbox.stub(inspectpack, "actions").rejects(); + const actions = base.sandbox.stub(inspectpack, "actions").rejects(); const serializeError = base.sandbox.spy(errorSerializer, "serializeError"); - plugin.observeMetrics({ toJson }).subscribe({ - next: base.sandbox.spy(), - error: base.sandbox.spy(), - complete: () => { - expect(serializeError).to.have.been.calledThrice; - } - }); + return ( + plugin + .observeMetrics({ toJson }) + .drain() + // eslint-disable-next-line promise/always-return + .then(() => { + // All three actions called. + expect(actions).to.have.been.calledThrice; + // ... but since two are in Promise.all only get one rejection. + expect(serializeError).to.have.been.calledTwice; + }) + ); }); }); }); From cec04bbfb86b362548f53b1e7fb8d67e3fa82318 Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Tue, 27 Aug 2019 14:52:07 -0700 Subject: [PATCH 5/6] Changes for v3.1.0 --- CHANGELOG.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index c99bc0c..c7eb48d 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -3,7 +3,7 @@ This project adheres to [Semantic Versioning](http://semver.org/). Every release, along with the migration instructions, is documented on the Github [Releases](https://github.com/FormidableLabs/webpack-dashboard/releases) page. -## UNRELEASED +## [3.1.0] - 2019-08-27 - Add `DashboardPlugin({ includeAssets: [ "stringPrefix", /regexObj/ ] })` Webpack plugin filtering option. - Add `webpack-dashboard --include-assets stringPrefix1 -a stringPrefix2` CLI filtering option. From 1a933ef53cf060f9c26a38504332ecf295618963 Mon Sep 17 00:00:00 2001 From: Ryan Roemer Date: Tue, 27 Aug 2019 14:52:12 -0700 Subject: [PATCH 6/6] 3.1.0 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 9f37abf..0369be3 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "webpack-dashboard", - "version": "3.0.7", + "version": "3.1.0", "description": "a CLI dashboard for webpack dev server", "bin": "bin/webpack-dashboard.js", "main": "index.js",