refactor(gatsby-cli): update reporter to support different implementa…

…tions (#13497)

* chore(gatsby-cli): update reporter to support different reporters

* fix isVerbose & remove some binds

* fix jest test console mocks

packages/gatsby-cli/package.json

@@ -13,6 +13,7 @@
     "@babel/code-frame": "^7.0.0",
     "@babel/runtime": "^7.0.0",
     "bluebird": "^3.5.0",
+    "chalk": "^2.4.2",
     "ci-info": "^2.0.0",
     "clipboardy": "^1.2.3",
     "common-tags": "^1.4.0",

packages/gatsby-cli/src/reporter/index.js

@@ -1,50 +1,47 @@
 // @flow
-
-const { createReporter } = require(`yurnalist`)
+const util = require(`util`)
 const { stripIndent } = require(`common-tags`)
-const convertHrtime = require(`convert-hrtime`)
+const chalk = require(`chalk`)
+const { trackError } = require(`gatsby-telemetry`)
 const tracer = require(`opentracing`).globalTracer()
 const { getErrorFormatter } = require(`./errors`)
-const { trackError } = require(`gatsby-telemetry`)
-
-const VERBOSE = process.env.gatsby_log_level === `verbose`
+const reporterInstance = require(`./reporters/yurnalist`)
 
 const errorFormatter = getErrorFormatter()
-const reporter = createReporter({ emoji: true, verbose: VERBOSE })
-const base = Object.getPrototypeOf(reporter)
 
 type ActivityArgs = {
   parentSpan: Object,
 }
 
-/* Reporter module.
+/**
+ * Reporter module.
  * @module reporter
  */
-
-module.exports = Object.assign(reporter, {
+const reporter = {
   /**
    * Strip initial indentation template function.
    */
   stripIndent,
+  format: chalk,
   /**
    * Toggle verbosity.
    * @param {boolean} [isVerbose=true]
    */
-  setVerbose(isVerbose = true) {
-    this.isVerbose = !!isVerbose
-  },
+  setVerbose: (isVerbose = true) => reporterInstance.setVerbose(isVerbose),
   /**
    * Turn off colors in error output.
    * @param {boolean} [isNoColor=false]
    */
   setNoColor(isNoColor = false) {
+    reporterInstance.setColors(isNoColor)
+
     if (isNoColor) {
       errorFormatter.withoutColors()
     }
   },
   /**
    * Log arguments and exit process with status 1.
-   * @param {*} [arguments]
+   * @param {*} args
    */
   panic(...args) {
     this.error(...args)
@@ -53,7 +50,8 @@ module.exports = Object.assign(reporter, {
   },
 
   panicOnBuild(...args) {
-    this.error(...args)
+    const [message, error] = args
+    this.error(message, error)
     trackError(`BUILD_PANIC`, { error: args })
     if (process.env.gatsby_executing_command === `build`) {
       process.exit(1)
@@ -65,53 +63,48 @@ module.exports = Object.assign(reporter, {
       error = message
       message = error.message
     }
-    base.error.call(this, message)
-    if (error) console.log(errorFormatter.render(error))
+    reporterInstance.error(message)
+    if (error) this.log(errorFormatter.render(error))
   },
   /**
    * Set prefix on uptime.
    * @param {string} prefix - A string to prefix uptime with.
    */
-  uptime(prefix: string) {
+  uptime(prefix) {
     this.verbose(`${prefix}: ${(process.uptime() * 1000).toFixed(3)}ms`)
   },
+  success: reporterInstance.success,
+  verbose: reporterInstance.verbose,
+  info: reporterInstance.info,
+  warn: reporterInstance.warn,
+  log: reporterInstance.log,
   /**
    * Time an activity.
    * @param {string} name - Name of activity.
    * @param {activityArgs} activityArgs - optional object with tracer parentSpan
    * @returns {string} The elapsed time of activity.
    */
   activityTimer(name, activityArgs: ActivityArgs = {}) {
-    const spinner = reporter.activity()
-    const start = process.hrtime()
-    let status
-
-    const elapsedTime = () => {
-      var elapsed = process.hrtime(start)
-      return `${convertHrtime(elapsed)[`seconds`].toFixed(3)} s`
-    }
-
     const { parentSpan } = activityArgs
     const spanArgs = parentSpan ? { childOf: parentSpan } : {}
     const span = tracer.startSpan(name, spanArgs)
 
+    const activity = reporterInstance.createActivity(name)
+
     return {
-      start: () => {
-        spinner.tick(name)
-      },
-      setStatus: s => {
-        status = s
-        spinner.tick(`${name} — ${status}`)
-      },
-      end: () => {
+      ...activity,
+      end() {
         span.finish()
-        const str = status
-          ? `${name} — ${elapsedTime()} — ${status}`
-          : `${name} — ${elapsedTime()}`
-        reporter.success(str)
-        spinner.end()
+        activity.end()
       },
-      span: span,
+      span,
     }
   },
-})
+}
+
+console.log = (...args) => reporter.log(util.format(...args))
+console.warn = (...args) => reporter.warn(util.format(...args))
+console.info = (...args) => reporter.info(util.format(...args))
+console.error = (...args) => reporter.error(util.format(...args))
+
+module.exports = reporter

packages/gatsby-cli/src/reporter/reporters/yurnalist/index.js

@@ -0,0 +1,64 @@
+// @flow
+
+const { createReporter } = require(`yurnalist`)
+const convertHrtime = require(`convert-hrtime`)
+
+const VERBOSE = process.env.gatsby_log_level === `verbose`
+const reporter = createReporter({ emoji: true, verbose: VERBOSE })
+
+/**
+ * Reporter module.
+ * @module reporter
+ */
+module.exports = {
+  /**
+   * Toggle verbosity.
+   * @param {boolean} [isVerbose=true]
+   */
+  setVerbose(isVerbose = true) {
+    reporter.isVerbose = !!isVerbose
+  },
+  /**
+   * Turn off colors in error output.
+   */
+  setColors() {},
+
+  success: reporter.success.bind(reporter),
+  error: reporter.error.bind(reporter),
+  verbose: reporter.verbose.bind(reporter),
+  info: reporter.info.bind(reporter),
+  warn: reporter.warn.bind(reporter),
+  log: reporter.log.bind(reporter),
+  /**
+   * Time an activity.
+   * @param {string} name - Name of activity.
+   * @returns {string} The elapsed time of activity.
+   */
+  createActivity(name) {
+    const spinner = reporter.activity()
+    const start = process.hrtime()
+    let status
+
+    const elapsedTime = () => {
+      var elapsed = process.hrtime(start)
+      return `${convertHrtime(elapsed)[`seconds`].toFixed(3)} s`
+    }
+
+    return {
+      start: () => {
+        spinner.tick(name)
+      },
+      setStatus: s => {
+        status = s
+        spinner.tick(`${name} — ${status}`)
+      },
+      end: () => {
+        const str = status
+          ? `${name} — ${elapsedTime()} — ${status}`
+          : `${name} — ${elapsedTime()}`
+        reporter.success(str)
+        spinner.end()
+      },
+    }
+  },
+}

packages/gatsby-plugin-sharp/src/__tests__/index.js

@@ -269,15 +269,8 @@ describe(`gatsby-plugin-sharp`, () => {
   })
 
   describe(`fixed`, () => {
-    beforeEach(() => {
-      console.warn = jest.fn()
-    })
-
-    afterAll(() => {
-      console.warn.mockClear()
-    })
-
     it(`does not warn when the requested width is equal to the image width`, async () => {
+      console.warn = jest.fn()
       const args = { width: 1 }
 
       const result = await fixed({
@@ -287,9 +280,11 @@ describe(`gatsby-plugin-sharp`, () => {
 
       expect(result.width).toEqual(1)
       expect(console.warn).toHaveBeenCalledTimes(0)
+      console.warn.mockClear()
     })
 
     it(`warns when the requested width is greater than the image width`, async () => {
+      console.warn = jest.fn()
       const { width } = await sharp(file.absolutePath).metadata()
       const args = { width: width * 2 }
 
@@ -300,6 +295,7 @@ describe(`gatsby-plugin-sharp`, () => {
 
       expect(result.width).toEqual(width)
       expect(console.warn).toHaveBeenCalledTimes(1)
+      console.warn.mockClear()
     })
 
     it(`correctly infers the width when only the height is given`, async () => {

packages/gatsby-transformer-remark/src/__tests__/extend-node.js

@@ -99,6 +99,10 @@ const bootstrapTest = (
     const actions = { createNode, createParentChildLink }
     const createNodeId = jest.fn()
     createNodeId.mockReturnValue(`uuid-from-gatsby`)
+
+    // Used to verify that console.warn is called when field not found
+    jest.spyOn(global.console, `warn`)
+
     await onCreateNode(
       {
         node,
@@ -626,9 +630,6 @@ date: "2017-09-18T23:19:51.246Z"
 })
 
 describe(`Table of contents is generated correctly from schema`, () => {
-  // Used to verify that console.warn is called when field not found
-  jest.spyOn(global.console, `warn`)
-
   bootstrapTest(
     `returns null on non existing table of contents field`,
     `---