From 6e1b3a254775ffbf08fbe8e90fbc3277e780979f Mon Sep 17 00:00:00 2001
From: Ben Clayton <bclayton@google.com>
Date: Mon, 18 Oct 2021 19:03:10 +0100
Subject: [PATCH] Add src/common/utils/colors.ts (#782)

This is a thin wrapper around the 'ansi-colors' module, which will be used if it can be found.

This interface may also support HTML colorization in the future.

Will be used to make the mental parsing of expectation failures easier.
---
 package-lock.json         |   1 +
 package.json              |   1 +
 src/common/util/colors.ts | 123 ++++++++++++++++++++++++++++++++++++++
 3 files changed, 125 insertions(+)
 create mode 100644 src/common/util/colors.ts

diff --git a/package-lock.json b/package-lock.json
index f3aa107b898e..7f8ed093ed6f 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -20,6 +20,7 @@
         "@types/offscreencanvas": "^2019.6.2",
         "@typescript-eslint/parser": "^4.22.0",
         "@webgpu/types": "^0.1.6",
+        "ansi-colors": "4.1.1",
         "babel-plugin-add-header-comment": "^1.0.3",
         "babel-plugin-const-enum": "^1.0.1",
         "chokidar": "^3.4.3",
diff --git a/package.json b/package.json
index 743b9d08ce79..7fefcca130e8 100644
--- a/package.json
+++ b/package.json
@@ -40,6 +40,7 @@
     "@types/offscreencanvas": "^2019.6.2",
     "@typescript-eslint/parser": "^4.22.0",
     "@webgpu/types": "^0.1.6",
+    "ansi-colors": "4.1.1",
     "babel-plugin-add-header-comment": "^1.0.3",
     "babel-plugin-const-enum": "^1.0.1",
     "chokidar": "^3.4.3",
diff --git a/src/common/util/colors.ts b/src/common/util/colors.ts
new file mode 100644
index 000000000000..e17f4d88bd6c
--- /dev/null
+++ b/src/common/util/colors.ts
@@ -0,0 +1,123 @@
+/**
+ * The interface used for formatting strings to contain color metadata.
+ *
+ * Use the interface properties to construct a style, then use the
+ * `(s: string): string` function to format the provided string with the given
+ * style.
+ */
+export interface Colors {
+  // Returns the string formatted to contain the specified color or style.
+  (s: string): string;
+
+  // modifiers
+  reset: Colors;
+  bold: Colors;
+  dim: Colors;
+  italic: Colors;
+  underline: Colors;
+  inverse: Colors;
+  hidden: Colors;
+  strikethrough: Colors;
+
+  // colors
+  black: Colors;
+  red: Colors;
+  green: Colors;
+  yellow: Colors;
+  blue: Colors;
+  magenta: Colors;
+  cyan: Colors;
+  white: Colors;
+  gray: Colors;
+  grey: Colors;
+
+  // bright colors
+  blackBright: Colors;
+  redBright: Colors;
+  greenBright: Colors;
+  yellowBright: Colors;
+  blueBright: Colors;
+  magentaBright: Colors;
+  cyanBright: Colors;
+  whiteBright: Colors;
+
+  // background colors
+  bgBlack: Colors;
+  bgRed: Colors;
+  bgGreen: Colors;
+  bgYellow: Colors;
+  bgBlue: Colors;
+  bgMagenta: Colors;
+  bgCyan: Colors;
+  bgWhite: Colors;
+
+  // bright background colors
+  bgBlackBright: Colors;
+  bgRedBright: Colors;
+  bgGreenBright: Colors;
+  bgYellowBright: Colors;
+  bgBlueBright: Colors;
+  bgMagentaBright: Colors;
+  bgCyanBright: Colors;
+  bgWhiteBright: Colors;
+}
+
+/**
+ * The interface used for formatting strings with color metadata.
+ *
+ * Currently Colors will use the 'ansi-colors' module if it can be loaded.
+ * If it cannot be loaded, then the Colors implementation is a straight pass-through.
+ *
+ * Colors may also be a no-op if the current environment does not support colors.
+ */
+export let Colors: Colors;
+
+try {
+  /* eslint-disable-next-line node/no-unpublished-require */
+  Colors = require('ansi-colors') as Colors;
+} catch {
+  const passthrough = ((s: string) => s) as Colors;
+  passthrough.reset = passthrough;
+  passthrough.bold = passthrough;
+  passthrough.dim = passthrough;
+  passthrough.italic = passthrough;
+  passthrough.underline = passthrough;
+  passthrough.inverse = passthrough;
+  passthrough.hidden = passthrough;
+  passthrough.strikethrough = passthrough;
+  passthrough.black = passthrough;
+  passthrough.red = passthrough;
+  passthrough.green = passthrough;
+  passthrough.yellow = passthrough;
+  passthrough.blue = passthrough;
+  passthrough.magenta = passthrough;
+  passthrough.cyan = passthrough;
+  passthrough.white = passthrough;
+  passthrough.gray = passthrough;
+  passthrough.grey = passthrough;
+  passthrough.blackBright = passthrough;
+  passthrough.redBright = passthrough;
+  passthrough.greenBright = passthrough;
+  passthrough.yellowBright = passthrough;
+  passthrough.blueBright = passthrough;
+  passthrough.magentaBright = passthrough;
+  passthrough.cyanBright = passthrough;
+  passthrough.whiteBright = passthrough;
+  passthrough.bgBlack = passthrough;
+  passthrough.bgRed = passthrough;
+  passthrough.bgGreen = passthrough;
+  passthrough.bgYellow = passthrough;
+  passthrough.bgBlue = passthrough;
+  passthrough.bgMagenta = passthrough;
+  passthrough.bgCyan = passthrough;
+  passthrough.bgWhite = passthrough;
+  passthrough.bgBlackBright = passthrough;
+  passthrough.bgRedBright = passthrough;
+  passthrough.bgGreenBright = passthrough;
+  passthrough.bgYellowBright = passthrough;
+  passthrough.bgBlueBright = passthrough;
+  passthrough.bgMagentaBright = passthrough;
+  passthrough.bgCyanBright = passthrough;
+  passthrough.bgWhiteBright = passthrough;
+  Colors = passthrough;
+}