Merge pull request #736 from sjd78/console-logger-jest

use "chalk" to enhance logging in jest tests

config/jest/chalk.logger.js

@@ -0,0 +1,9 @@
+import { enhanceOutput } from '../../src/logger'
+import chalk from 'chalk'
+
+enhanceOutput({
+  debug: [ chalk.bold.white.bgHex('#21409a')(' debug ') ],
+  info: [ chalk.bold.white.bgHex('#01acac')(' info ') ],
+  warn: [ chalk.bold.white.bgHex('#f8a51b')(' warn ') ],
+  error: [ chalk.bold.white.bgHex('#ed403c')(' error ') ],
+})

config/polyfills.js

@@ -1,3 +1,8 @@
+// NOTE: These polyfills are most likely unnecessary for our supported browsers. If verified,
+//       they may be removed and save the space in the bundle.
+
+// TODO: Verify if these polyfills are still necessary.
+
 if (typeof Promise === 'undefined') {
   // Rejection tracking prevents a common issue where React gets into an
   // inconsistent state due to an error, but it gets swallowed by a Promise,

package.json

@@ -127,7 +127,8 @@
       ".*": "<rootDir>/config/jest/transform.js"
     },
     "setupFiles": [
-      "<rootDir>/config/polyfills.js"
+      "<rootDir>/config/polyfills.js",
+      "<rootDir>/config/jest/chalk.logger.js"
     ],
     "testPathIgnorePatterns": [
       "<rootDir>/(build|docs|node_modules|__tests__/helper|config)/"

src/logger.js

@@ -4,26 +4,48 @@ export function setLogDebug (enabled) {
   isDebugEnabled = enabled
 }
 
-const noop = function () {}
+const NOOP = function () {}
+const BASE_FUNCTIONS = {
+  log: window.console.log,
+  info: window.console.info,
+  warn: window.console.warn,
+  error: window.console.error,
+}
 
 /*
  * Functions bound to the real console object, in the correct context for generating
  * appropriate file/line numbers.  Also provide the first few arguments to the real
  * function calls to add pretty line prefixes.
  */
-const consoleFunctions = {
-  log: window.console.log.bind(window.console, '%c debug %c', 'font-weight: bold; background-color: #21409a; color: white;', ''),
-  info: window.console.info.bind(window.console, '%c info %c', 'font-weight: bold; background-color: #01acac; color: white;', ''),
-  warn: window.console.warn.bind(window.console, '%c warn %c', 'font-weight: bold; background-color: #f8a51b; color: white;', ''),
-  error: window.console.error.bind(window.console, '%c error %c', 'font-weight: bold; background-color: #ed403c; color: white;', ''),
+let consoleFunctions = {}
+
+export function enhanceOutput (enhancers) {
+  consoleFunctions = {
+    log: BASE_FUNCTIONS.log.bind(window.console, ...enhancers.debug),
+    info: BASE_FUNCTIONS.info.bind(window.console, ...enhancers.info),
+    warn: BASE_FUNCTIONS.warn.bind(window.console, ...enhancers.warn),
+    error: BASE_FUNCTIONS.error.bind(window.console, ...enhancers.error),
+  }
 }
 
+enhanceOutput({
+  debug: ['%c debug %c', 'font-weight: bold; background-color: #21409a; color: white;', ''],
+  info: ['%c info %c', 'font-weight: bold; background-color: #01acac; color: white;', ''],
+  warn: ['%c warn %c', 'font-weight: bold; background-color: #f8a51b; color: white;', ''],
+  error: ['%c error %c', 'font-weight: bold; background-color: #ed403c; color: white;', ''],
+})
+
+/*
+ * Setup accessor properties on the given object to capture the base console logging
+ * functions and provide our own "enhanced" function instead. Use `setLogDebug` to
+ * control if the function returned will do any actual logging.
+ */
 function attachLoggers (object) {
-  return Object.defineProperties(window.console, {
-    'log': { get () { return isDebugEnabled ? consoleFunctions.log : noop } },
-    'info': { get () { return isDebugEnabled ? consoleFunctions.info : noop } },
-    'warn': { get () { return isDebugEnabled ? consoleFunctions.warn : noop } },
-    'error': { get () { return isDebugEnabled ? consoleFunctions.error : noop } },
+  return Object.defineProperties(object, {
+    'log': { get () { return isDebugEnabled ? consoleFunctions.log : NOOP } },
+    'info': { get () { return isDebugEnabled ? consoleFunctions.info : NOOP } },
+    'warn': { get () { return isDebugEnabled ? consoleFunctions.warn : NOOP } },
+    'error': { get () { return isDebugEnabled ? consoleFunctions.error : NOOP } },
   })
 }