Migrate to using neo-blessed as underlying blessed renderer.

Author: parkerziegler

.eslintrc.json

@@ -1,5 +1,5 @@
 {
-  "extends": "formidable/configurations/es6-node",
+  "extends": ["formidable/configurations/es6-node", "plugin:prettier/recommended"],
   "rules": {
     "func-style": "off",
     "arrow-parens": ["error", "as-needed"]

bin/webpack-dashboard.js

@@ -13,7 +13,8 @@ const program = new commander.Command("webpack-dashboard");
 const pkg = require("../package.json");
 
 // Wrap up side effects in a script.
-const main = module.exports = opts => { // eslint-disable-line max-statements, complexity
+// eslint-disable-next-line max-statements, complexity
+const main = (module.exports = opts => {
   opts = opts || {};
   const argv = typeof opts.argv === "undefined" ? process.argv : opts.argv;
 
@@ -72,17 +73,21 @@ const main = module.exports = opts => { // eslint-disable-line max-statements, c
     });
 
     child.stdout.on("data", data => {
-      dashboard.setData([{
-        type: "log",
-        value: data.toString("utf8")
-      }]);
+      dashboard.setData([
+        {
+          type: "log",
+          value: data.toString("utf8")
+        }
+      ]);
     });
 
     child.stderr.on("data", data => {
-      dashboard.setData([{
-        type: "log",
-        value: data.toString("utf8")
-      }]);
+      dashboard.setData([
+        {
+          type: "log",
+          value: data.toString("utf8")
+        }
+      ]);
     });
 
     process.on("exit", () => {
@@ -95,7 +100,7 @@ const main = module.exports = opts => { // eslint-disable-line max-statements, c
       });
     });
   }
-};
+});
 
 if (require.main === module) {
   main();

dashboard/index.js

@@ -1,7 +1,7 @@
 "use strict";
 
 const chalk = require("chalk");
-const blessed = require("blessed");
+const blessed = require("neo-blessed");
 
 const { formatOutput } = require("../utils/format-output");
 const { formatModules } = require("../utils/format-modules");
@@ -94,13 +94,12 @@ class Dashboard {
 
   setData(dataArray) {
     dataArray
-      .map(
-        data =>
-          data.error
-            ? Object.assign({}, data, {
+      .map(data =>
+        data.error
+          ? Object.assign({}, data, {
               value: deserializeError(data.value)
             })
-            : data
+          : data
       )
       .forEach(data => {
         this.actionForMessageType[data.type](data);
@@ -133,14 +132,14 @@ class Dashboard {
     let content;
 
     switch (data.value) {
-    case "Success":
-      content = `{green-fg}{bold}${data.value}{/}`;
-      break;
-    case "Failed":
-      content = `{red-fg}{bold}${data.value}{/}`;
-      break;
-    default:
-      content = `{bold}${data.value}{/}`;
+      case "Success":
+        content = `{green-fg}{bold}${data.value}{/}`;
+        break;
+      case "Failed":
+        content = `{red-fg}{bold}${data.value}{/}`;
+        break;
+      default:
+        content = `{bold}${data.value}{/}`;
     }
     this.status.setContent(content);
   }
@@ -497,8 +496,8 @@ class Dashboard {
       tags: true,
       padding: this.minimal
         ? {
-          left: 1
-        }
+            left: 1
+          }
         : 1,
       width: this.minimal ? "33%" : "100%",
       height: this.minimal ? "100%" : "34%",

examples/simple/src/index.js

@@ -1,4 +1,3 @@
-
 /* eslint-disable no-console*/
 
 const hello = () => "hello world";

package.json

@@ -12,10 +12,12 @@
     "test": "mocha 'test/**/*.spec.js'",
     "test-cov": "nyc mocha 'test/**/*.spec.js'",
     "lint": "eslint .",
-    "check": "npm run lint && npm run test && npm run check-ts",
-    "check-ci": "npm run lint && npm run test-cov && npm run check-ts",
+    "check": "npm run format-check && npm run lint && npm run test && npm run check-ts",
+    "check-ci": "npm run format-check && npm run lint && npm run test-cov && npm run check-ts",
     "check-ts": "tsc index.d.ts --noEmit",
-    "dev": "cross-env EXAMPLE=duplicates-esm node bin/webpack-dashboard.js -- webpack-cli --config examples/config/webpack.config.js --watch"
+    "dev": "cross-env EXAMPLE=duplicates-esm node bin/webpack-dashboard.js -- webpack-cli --config examples/config/webpack.config.js --watch",
+    "format": "prettier --write './{bin,examples,plugin,test,utils}/**/*.js'",
+    "format-check": "prettier --list-different './{bin,examples,plugin,test,utils}/**/*.js'"
   },
   "repository": {
     "type": "git",
@@ -37,13 +39,13 @@
     "webpack": "*"
   },
   "dependencies": {
-    "blessed": "^0.1.81",
     "commander": "^2.15.1",
     "cross-spawn": "^6.0.5",
     "filesize": "^3.6.1",
     "handlebars": "^4.0.11",
     "inspectpack": "^4.0.0",
     "most": "^1.7.3",
+    "neo-blessed": "^0.2.0",
     "socket.io": "^2.1.1",
     "socket.io-client": "^2.1.1"
   },
@@ -53,11 +55,14 @@
     "cross-env": "^5.2.0",
     "eslint": "^4.19.1",
     "eslint-config-formidable": "^4.0.0",
+    "eslint-config-prettier": "^4.0.0",
     "eslint-plugin-filenames": "^1.1.0",
     "eslint-plugin-import": "^2.12.0",
+    "eslint-plugin-prettier": "^3.0.1",
     "eslint-plugin-promise": "^3.7.0",
     "mocha": "^5.2.0",
     "nyc": "^11.8.0",
+    "prettier": "^1.16.4",
     "sinon": "^5.0.7",
     "sinon-chai": "^3.0.0",
     "typescript": "^3.2.4",

plugin/index.js

@@ -159,10 +159,8 @@ class DashboardPlugin {
 
     webpackHook(compiler, "done", stats => {
       const options = stats.compilation.options;
-      const statsOptions
-        = options.devServer && options.devServer.stats
-        || options.stats
-        || { colors: true };
+      const statsOptions = (options.devServer && options.devServer.stats) ||
+        options.stats || { colors: true };
 
       handler([
         {
@@ -207,33 +205,40 @@ class DashboardPlugin {
   observeMetrics(statsObj) {
     const statsToObserve = statsObj.toJson();
 
-    const getSizes = stats => actions("sizes", { stats })
-      .then(instance => instance.getData())
-      .then(data => ({
-        type: "sizes",
-        value: data
-      }))
-      .catch(err => ({
-        type: "sizes",
-        error: true,
-        value: serializeError(err)
-      }));
-
-    const getProblems = stats => Promise
-      .all(INSPECTPACK_PROBLEM_ACTIONS.map(action => actions(action, { stats })
+    const getSizes = stats =>
+      actions("sizes", { stats })
         .then(instance => instance.getData())
-      ))
-      .then(datas => ({
-        type: INSPECTPACK_PROBLEM_TYPE,
-        value: INSPECTPACK_PROBLEM_ACTIONS.reduce((memo, action, i) => Object.assign({}, memo, {
-          [action]: datas[i]
-        }), {})
-      }))
-      .catch(err => ({
-        type: INSPECTPACK_PROBLEM_TYPE,
-        error: true,
-        value: serializeError(err)
-      }));
+        .then(data => ({
+          type: "sizes",
+          value: data
+        }))
+        .catch(err => ({
+          type: "sizes",
+          error: true,
+          value: serializeError(err)
+        }));
+
+    const getProblems = stats =>
+      Promise.all(
+        INSPECTPACK_PROBLEM_ACTIONS.map(action =>
+          actions(action, { stats }).then(instance => instance.getData())
+        )
+      )
+        .then(datas => ({
+          type: INSPECTPACK_PROBLEM_TYPE,
+          value: INSPECTPACK_PROBLEM_ACTIONS.reduce(
+            (memo, action, i) =>
+              Object.assign({}, memo, {
+                [action]: datas[i]
+              }),
+            {}
+          )
+        }))
+        .catch(err => ({
+          type: INSPECTPACK_PROBLEM_TYPE,
+          error: true,
+          value: serializeError(err)
+        }));
 
     const sizesStream = most.of(statsToObserve).map(getSizes);
     const problemsStream = most.of(statsToObserve).map(getProblems);

test/.eslintrc

@@ -0,0 +1,3 @@
+{
+  "extends": ["formidable/configurations/es6-node-test", "plugin:prettier/recommended"]
+}

test/.eslintrc.json

@@ -10,11 +10,11 @@
  */
 const sinon = require("sinon");
 
-const blessed = require("blessed");
+const blessed = require("neo-blessed");
 
-const base = module.exports = {
+const base = (module.exports = {
   sandbox: null
-};
+});
 
 beforeEach(() => {
   base.sandbox = sinon.createSandbox({

test/base.spec.js

@@ -6,11 +6,13 @@ const cli = require("../../bin/webpack-dashboard");
 
 describe("bin/webpack-dashboard", () => {
   it("can invoke the dashboard cli", () => {
-    expect(() => cli({
-      argv: [],
-      server: {
-        on: base.sandbox.spy()
-      }
-    })).to.not.throw();
+    expect(() =>
+      cli({
+        argv: [],
+        server: {
+          on: base.sandbox.spy()
+        }
+      })
+    ).to.not.throw();
   });
 });