From 1be93158e1ee5a1d31ae4e30cf0443f915aa389e Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Micha=C5=82=20Pierzcha=C5=82a?= <thymikee@gmail.com>
Date: Fri, 10 Mar 2017 17:01:01 +0100
Subject: [PATCH] Human-readable colors for jest-matchers snapshots (#3119)

* Human-readable colors for jest-matchers snapshots

* Use ConvertAnsi pretty-format plugin as snapshotSerializer

* Convert ansi escapes in all snapshots
---
 package.json                                  |    5 +
 .../formatTestNameByPattern-test.js.snap      |   26 +-
 .../__snapshots__/highlight-test.js.snap      |   76 +-
 .../__snapshots__/utils-test.js.snap          |   20 +-
 .../__snapshots__/normalize-test.js.snap      |   42 +-
 .../__tests__/__snapshots__/diff-test.js.snap |   46 +-
 .../__snapshots__/matchers-test.js.snap       |    6 +-
 .../__snapshots__/index-test.js.snap          |   20 +-
 .../__snapshots__/extend-test.js.snap         |    2 +-
 .../__snapshots__/matchers-test.js.snap       | 2424 ++++++++---------
 .../__snapshots__/spyMatchers-test.js.snap    |  280 +-
 .../toThrowMatchers-test.js.snap              |  136 +-
 .../__snapshots__/messages-test.js.snap       |    8 +-
 .../validateCLIOptions-test.js.snap           |   16 +-
 .../__snapshots__/validate-test.js.snap       |  100 +-
 .../__snapshots__/pretty-format-test.js.snap  |   60 +-
 .../pretty-format/src/plugins/ConvertAnsi.js  |   51 +
 17 files changed, 1687 insertions(+), 1631 deletions(-)
 create mode 100644 packages/pretty-format/src/plugins/ConvertAnsi.js

diff --git a/package.json b/package.json
index d55f3240a257..72fadcbf4100 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,8 @@
 {
   "private": true,
   "devDependencies": {
+    "ansi-regex": "^2.0.0",
+    "ansi-styles": "^3.0.0",
     "babel-core": "^6.23.1",
     "babel-eslint": "^7.1.1",
     "babel-plugin-syntax-trailing-function-commas": "^6.13.0",
@@ -84,6 +86,9 @@
       "^.+\\.js$": "<rootDir>/packages/babel-jest"
     },
     "setupTestFrameworkScriptFile": "<rootDir>/testSetupFile.js",
+    "snapshotSerializers": [
+      "<rootDir>/packages/pretty-format/build/plugins/ConvertAnsi.js"
+    ],
     "testEnvironment": "./packages/jest-environment-node",
     "testPathIgnorePatterns": [
       "/node_modules/",
diff --git a/packages/jest-cli/src/lib/__tests__/__snapshots__/formatTestNameByPattern-test.js.snap b/packages/jest-cli/src/lib/__tests__/__snapshots__/formatTestNameByPattern-test.js.snap
index b660c992e17a..db0e46a1f88a 100644
--- a/packages/jest-cli/src/lib/__tests__/__snapshots__/formatTestNameByPattern-test.js.snap
+++ b/packages/jest-cli/src/lib/__tests__/__snapshots__/formatTestNameByPattern-test.js.snap
@@ -1,27 +1,27 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`for multiline test name returns test name with highlighted pattern and replaced line breaks 1`] = `"should⏎ name the ⏎function you at..."`;
+exports[`for multiline test name returns test name with highlighted pattern and replaced line breaks 1`] = `"<dim>should⏎ </>name</><dim> the ⏎function you at..."`;
 
-exports[`for multiline test name returns test name with highlighted pattern and replaced line breaks 2`] = `"should⏎ name the ⏎function you at..."`;
+exports[`for multiline test name returns test name with highlighted pattern and replaced line breaks 2`] = `"<dim>should⏎ </>name</><dim> the ⏎function you at..."`;
 
-exports[`for multiline test name returns test name with highlighted pattern and replaced line breaks 3`] = `"should⏎ name the ⏎function you at..."`;
+exports[`for multiline test name returns test name with highlighted pattern and replaced line breaks 3`] = `"<dim>should⏎ </>name</><dim> the ⏎function you at..."`;
 
-exports[`for one line test name pattern in the middle test name with cutted tail and cutted highlighted pattern 1`] = `"should nam..."`;
+exports[`for one line test name pattern in the middle test name with cutted tail and cutted highlighted pattern 1`] = `"<dim>should </>nam...</>"`;
 
-exports[`for one line test name pattern in the middle test name with cutted tail and highlighted pattern 1`] = `"should name the functi..."`;
+exports[`for one line test name pattern in the middle test name with cutted tail and highlighted pattern 1`] = `"<dim>should </>name</><dim> the functi..."`;
 
-exports[`for one line test name pattern in the middle test name with highlighted cutted 1`] = `"sho..."`;
+exports[`for one line test name pattern in the middle test name with highlighted cutted 1`] = `"<dim>sho</>...</>"`;
 
-exports[`for one line test name pattern in the middle test name with highlighted pattern returns 1`] = `"should name the function you attach"`;
+exports[`for one line test name pattern in the middle test name with highlighted pattern returns 1`] = `"<dim>should </>name</><dim> the function you attach"`;
 
-exports[`for one line test name pattern in the tail returns test name with cutted tail and cutted highlighted pattern 1`] = `"should name the function you a..."`;
+exports[`for one line test name pattern in the tail returns test name with cutted tail and cutted highlighted pattern 1`] = `"<dim>should name the function you </>a...</>"`;
 
-exports[`for one line test name pattern in the tail returns test name with highlighted cutted 1`] = `"sho..."`;
+exports[`for one line test name pattern in the tail returns test name with highlighted cutted 1`] = `"<dim>sho</>...</>"`;
 
-exports[`for one line test name pattern in the tail returns test name with highlighted pattern 1`] = `"should name the function you attach"`;
+exports[`for one line test name pattern in the tail returns test name with highlighted pattern 1`] = `"<dim>should name the function you </>attach</>"`;
 
-exports[`for one line test name with pattern in the head returns test name with cutted tail and cutted highlighted pattern 1`] = `"shoul..."`;
+exports[`for one line test name with pattern in the head returns test name with cutted tail and cutted highlighted pattern 1`] = `"</>shoul...</>"`;
 
-exports[`for one line test name with pattern in the head returns test name with cutted tail and highlighted pattern 1`] = `"should name the function yo..."`;
+exports[`for one line test name with pattern in the head returns test name with cutted tail and highlighted pattern 1`] = `"</>should</><dim> name the function yo..."`;
 
-exports[`for one line test name with pattern in the head returns test name with highlighted pattern 1`] = `"should name the function you attach"`;
+exports[`for one line test name with pattern in the head returns test name with highlighted pattern 1`] = `"</>should</><dim> name the function you attach"`;
diff --git a/packages/jest-cli/src/lib/__tests__/__snapshots__/highlight-test.js.snap b/packages/jest-cli/src/lib/__tests__/__snapshots__/highlight-test.js.snap
index 4ce34c19542e..803e3b8c5dd6 100644
--- a/packages/jest-cli/src/lib/__tests__/__snapshots__/highlight-test.js.snap
+++ b/packages/jest-cli/src/lib/__tests__/__snapshots__/highlight-test.js.snap
@@ -1,77 +1,77 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`dims everything when there is no match 1`] = `"jest-cli/__tests__/watch-test.js"`;
+exports[`dims everything when there is no match 1`] = `"<dim>jest-cli/__tests__/watch-test.js"`;
 
-exports[`dims everything when there is no match 2`] = `"...t-cli/__tests__/watch-test.js"`;
+exports[`dims everything when there is no match 2`] = `"<dim>...t-cli/__tests__/watch-test.js"`;
 
-exports[`dims everything when there is no match 3`] = `".../__tests__/watch-test.js"`;
+exports[`dims everything when there is no match 3`] = `"<dim>.../__tests__/watch-test.js"`;
 
-exports[`dims everything when there is no match 4`] = `"...sts__/watch-test.js"`;
+exports[`dims everything when there is no match 4`] = `"<dim>...sts__/watch-test.js"`;
 
-exports[`dims everything when there is no match 5`] = `"...watch-test.js"`;
+exports[`dims everything when there is no match 5`] = `"<dim>...watch-test.js"`;
 
-exports[`dims everything when there is no match 6`] = `"...-test.js"`;
+exports[`dims everything when there is no match 6`] = `"<dim>...-test.js"`;
 
-exports[`dims everything when there is no match 7`] = `"....js"`;
+exports[`dims everything when there is no match 7`] = `"<dim>....js"`;
 
-exports[`dims everything when there is no match 8`] = `"./watch-test.js"`;
+exports[`dims everything when there is no match 8`] = `"<dim>./watch-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 1`] = `"jest-cli/__tests__/watch-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 1`] = `"<dim>jest-cli/__tests__/watch-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 2`] = `"...t-cli/__tests__/watch-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 2`] = `"</>...</><dim>t-cli/__tests__/watch-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 3`] = `".../__tests__/watch-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 3`] = `"</>...</><dim>/__tests__/watch-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 4`] = `"...sts__/watch-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 4`] = `"</>...</><dim>sts__/watch-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 5`] = `"...watch-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 5`] = `"</>...</><dim>watch-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 6`] = `"...-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 6`] = `"</>...</><dim>-test.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 7`] = `"....js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 7`] = `"</>...</><dim>.js"`;
 
-exports[`highlight the trimmed part when there is only a rootDir match 8`] = `"./watch-test.js"`;
+exports[`highlight the trimmed part when there is only a rootDir match 8`] = `"</>./</><dim>watch-test.js"`;
 
-exports[`highlights everything when there is a full match 1`] = `"jest-cli/__tests__/watch-test.js"`;
+exports[`highlights everything when there is a full match 1`] = `"</>jest-cli/__tests__/watch-test.js</>"`;
 
-exports[`highlights everything when there is a full match 2`] = `"...t-cli/__tests__/watch-test.js"`;
+exports[`highlights everything when there is a full match 2`] = `"</>...t-cli/__tests__/watch-test.js</>"`;
 
-exports[`highlights everything when there is a full match 3`] = `".../__tests__/watch-test.js"`;
+exports[`highlights everything when there is a full match 3`] = `"</>.../__tests__/watch-test.js</>"`;
 
-exports[`highlights everything when there is a full match 4`] = `"...sts__/watch-test.js"`;
+exports[`highlights everything when there is a full match 4`] = `"</>...sts__/watch-test.js</>"`;
 
-exports[`highlights everything when there is a full match 5`] = `"...watch-test.js"`;
+exports[`highlights everything when there is a full match 5`] = `"</>...watch-test.js</>"`;
 
-exports[`highlights everything when there is a full match 6`] = `"...-test.js"`;
+exports[`highlights everything when there is a full match 6`] = `"</>...-test.js</>"`;
 
-exports[`highlights everything when there is a full match 7`] = `"....js"`;
+exports[`highlights everything when there is a full match 7`] = `"</>....js</>"`;
 
-exports[`highlights everything when there is a full match 8`] = `"./watch-test.js"`;
+exports[`highlights everything when there is a full match 8`] = `"</>./watch-test.js</>"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 1`] = `"jest-cli/__tests__/watch-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 1`] = `"<dim>jest-cli/__tests__/</>watch</><dim>-test.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 2`] = `"...t-cli/__tests__/watch-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 2`] = `"<dim>...t-cli/__tests__/</>watch</><dim>-test.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 3`] = `".../__tests__/watch-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 3`] = `"<dim>.../__tests__/</>watch</><dim>-test.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 4`] = `"...sts__/watch-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 4`] = `"<dim>...sts__/</>watch</><dim>-test.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 5`] = `"...watch-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 5`] = `"<dim>...</>watch</><dim>-test.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 6`] = `"...-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 6`] = `"</>...</><dim>-test.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 7`] = `"....js"`;
+exports[`highlights part of file name when there is a partially match of the file name 7`] = `"</>...</><dim>.js"`;
 
-exports[`highlights part of file name when there is a partially match of the file name 8`] = `"./watch-test.js"`;
+exports[`highlights part of file name when there is a partially match of the file name 8`] = `"<dim>./</>watch</><dim>-test.js"`;
 
-exports[`highlights the trimmed part there is a non visible match 1`] = `"...t-cli/__tests__/watch-test.js"`;
+exports[`highlights the trimmed part there is a non visible match 1`] = `"</>...t-cli</><dim>/__tests__/watch-test.js"`;
 
-exports[`highlights the trimmed part there is a non visible match 2`] = `".../__tests__/watch-test.js"`;
+exports[`highlights the trimmed part there is a non visible match 2`] = `"</>...</><dim>/__tests__/watch-test.js"`;
 
-exports[`highlights the trimmed part there is a non visible match 3`] = `"...sts__/watch-test.js"`;
+exports[`highlights the trimmed part there is a non visible match 3`] = `"</>...</><dim>sts__/watch-test.js"`;
 
-exports[`highlights the trimmed part there is a non visible match 4`] = `"...watch-test.js"`;
+exports[`highlights the trimmed part there is a non visible match 4`] = `"</>...</><dim>watch-test.js"`;
 
-exports[`highlights the trimmed part there is a non visible match 5`] = `"...-test.js"`;
+exports[`highlights the trimmed part there is a non visible match 5`] = `"</>...</><dim>-test.js"`;
 
-exports[`highlights the trimmed part there is a non visible match 6`] = `"....js"`;
+exports[`highlights the trimmed part there is a non visible match 6`] = `"</>...</><dim>.js"`;
diff --git a/packages/jest-cli/src/reporters/__tests__/__snapshots__/utils-test.js.snap b/packages/jest-cli/src/reporters/__tests__/__snapshots__/utils-test.js.snap
index a359b563e3ca..27b939ba8e4f 100644
--- a/packages/jest-cli/src/reporters/__tests__/__snapshots__/utils-test.js.snap
+++ b/packages/jest-cli/src/reporters/__tests__/__snapshots__/utils-test.js.snap
@@ -1,23 +1,23 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`trimAndFormatPath() does not trim anything 1`] = `"1234567890/1234567890/1234.js"`;
+exports[`trimAndFormatPath() does not trim anything 1`] = `"<dim>1234567890/1234567890/<bold>1234.js"`;
 
-exports[`trimAndFormatPath() split at the path.sep index 1`] = `".../1234.js"`;
+exports[`trimAndFormatPath() split at the path.sep index 1`] = `"<dim>.../<bold>1234.js"`;
 
-exports[`trimAndFormatPath() trims dirname (longer line width) 1`] = `"...890/1234567890/1234.js"`;
+exports[`trimAndFormatPath() trims dirname (longer line width) 1`] = `"<dim>...890/1234567890/<bold>1234.js"`;
 
-exports[`trimAndFormatPath() trims dirname 1`] = `"...234567890/1234.js"`;
+exports[`trimAndFormatPath() trims dirname 1`] = `"<dim>...234567890/<bold>1234.js"`;
 
-exports[`trimAndFormatPath() trims dirname and basename 1`] = `"...1234.js"`;
+exports[`trimAndFormatPath() trims dirname and basename 1`] = `"<bold>...1234.js"`;
 
 exports[`wrapAnsiString() returns the string unaltered if given a terminal width of zero 1`] = `"This string shouldn't cause you any trouble"`;
 
 exports[`wrapAnsiString() returns the string unaltered if given a terminal width of zero 2`] = `"This string shouldn't cause you any trouble"`;
 
 exports[`wrapAnsiString() wraps a long string containing ansi chars 1`] = `
-"abcde red-
-bold 12344
-56bcd 123t
+"abcde <red><bold>red-
+bold</> 12344
+56<dim>bcd 123t
 tttttththt
 hththththt
 hththththt
@@ -25,8 +25,8 @@ hththththt
 hthththtet
 etetetette
 tetetetete
-tetetestnh
-snthsnthss
+tetete<bold>stnh
+snthsnthss
 ot"
 `;
 
diff --git a/packages/jest-config/src/__tests__/__snapshots__/normalize-test.js.snap b/packages/jest-config/src/__tests__/__snapshots__/normalize-test.js.snap
index d737c3056952..e258773b577e 100644
--- a/packages/jest-config/src/__tests__/__snapshots__/normalize-test.js.snap
+++ b/packages/jest-config/src/__tests__/__snapshots__/normalize-test.js.snap
@@ -1,58 +1,58 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`Upgrade help logs a warning when \`scriptPreprocessor\` and/or \`preprocessorIgnorePatterns\` are used 1`] = `
-"● Deprecation Warning:
+"<bold><bold>●<bold> Deprecation Warning:
 
-  Option \\"preprocessorIgnorePatterns\\" was replaced by \\"transformIgnorePatterns\\", which support multiple preprocessors.
+  Option <bold>\\"preprocessorIgnorePatterns\\" was replaced by <bold>\\"transformIgnorePatterns\\", which support multiple preprocessors.
 
   Jest now treats your current configuration as:
   {
-    \\"transformIgnorePatterns\\": [\\"bar/baz\\", \\"qux/quux\\"]
+    <bold>\\"transformIgnorePatterns\\": <bold>[\\"bar/baz\\", \\"qux/quux\\"]
   }
 
   Please update your configuration.
 
-  Configuration Documentation:
+  <bold>Configuration Documentation:
   https://facebook.github.io/jest/docs/configuration.html
-"
+</>"
 `;
 
 exports[`preset throws when preset not found 1`] = `
-"● Validation Error:
+"<red><bold><bold>● <bold>Validation Error:
 
-  Preset doesnt-exist not found.
+  Preset <bold>doesnt-exist not found.
 
-  Configuration Documentation:
+  <bold>Configuration Documentation:
   https://facebook.github.io/jest/docs/configuration.html
-"
+</>"
 `;
 
 exports[`rootDir throws if the config is missing a rootDir property 1`] = `
-"● Validation Error:
+"<red><bold><bold>● <bold>Validation Error:
 
-  Configuration option rootDir must be specified.
+  Configuration option <bold>rootDir must be specified.
 
-  Configuration Documentation:
+  <bold>Configuration Documentation:
   https://facebook.github.io/jest/docs/configuration.html
-"
+</>"
 `;
 
 exports[`testEnvironment throws on invalid environment names 1`] = `
-"● Validation Error:
+"<red><bold><bold>● <bold>Validation Error:
 
-  Test environment phantom cannot be found. Make sure the testEnvironment configuration option points to an existing node module.
+  Test environment <bold>phantom cannot be found. Make sure the <bold>testEnvironment configuration option points to an existing node module.
 
-  Configuration Documentation:
+  <bold>Configuration Documentation:
   https://facebook.github.io/jest/docs/configuration.html
-"
+</>"
 `;
 
 exports[`testMatch throws if testRegex and testMatch are both specified 1`] = `
-"● Validation Error:
+"<red><bold><bold>● <bold>Validation Error:
 
-  Configuration options testMatch and testRegex cannot be used together.
+  Configuration options <bold>testMatch and <bold>testRegex cannot be used together.
 
-  Configuration Documentation:
+  <bold>Configuration Documentation:
   https://facebook.github.io/jest/docs/configuration.html
-"
+</>"
 `;
diff --git a/packages/jest-diff/src/__tests__/__snapshots__/diff-test.js.snap b/packages/jest-diff/src/__tests__/__snapshots__/diff-test.js.snap
index f236c580d46d..e01e56d8cf13 100644
--- a/packages/jest-diff/src/__tests__/__snapshots__/diff-test.js.snap
+++ b/packages/jest-diff/src/__tests__/__snapshots__/diff-test.js.snap
@@ -1,34 +1,34 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`collapses big diffs to patch format 1`] = `
-"- Expected
-+ Received
+"<green>- Expected</>
+<red>+ Received</>
 
-@@ -6,9 +6,9 @@
-     4,
-     5,
-     6,
-     7,
-     8,
-+    10,
-     9,
--    10,
-   ],
- }"
+@@ -6,9 +6,9 @@
+</><dim>     4,
+<dim>     5,
+<dim>     6,
+<dim>     7,
+<dim>     8,
+<red>+    10,</>
+<dim>     9,
+<green>-    10,</>
+<dim>   ],
+<dim> }"
 `;
 
 exports[`falls back to not call toJSON if objects look identical 1`] = `
-"Compared values serialize to the same structure.
-Printing internal object structure without calling \`toJSON\` instead.
+"<dim>Compared values serialize to the same structure.
+Printing internal object structure without calling \`toJSON\` instead.
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
-  Object {
--   \\"line\\": 1,
-+   \\"line\\": 2,
-    \\"toJSON\\": [Function toJSON],
-  }"
+<dim>  <dim>Object {
+<green>-</> <green>  \\"line\\": 1,</>
+<red>+</> <red>  \\"line\\": 2,</>
+<dim>  <dim>  \\"toJSON\\": [Function toJSON],
+<dim>  <dim>}"
 `;
 
-exports[`prints a fallback message if two objects truly look identical 1`] = `"Compared values have no visual difference."`;
+exports[`prints a fallback message if two objects truly look identical 1`] = `"<dim>Compared values have no visual difference."`;
diff --git a/packages/jest-jasmine2/src/__tests__/__snapshots__/matchers-test.js.snap b/packages/jest-jasmine2/src/__tests__/__snapshots__/matchers-test.js.snap
index bf60bb1a78c6..ab86a24dc19f 100644
--- a/packages/jest-jasmine2/src/__tests__/__snapshots__/matchers-test.js.snap
+++ b/packages/jest-jasmine2/src/__tests__/__snapshots__/matchers-test.js.snap
@@ -1,10 +1,10 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`matchers proxies matchers to jest-matchers 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
diff --git a/packages/jest-matcher-utils/src/__tests__/__snapshots__/index-test.js.snap b/packages/jest-matcher-utils/src/__tests__/__snapshots__/index-test.js.snap
index b4c01d9071ab..a25786610f30 100644
--- a/packages/jest-matcher-utils/src/__tests__/__snapshots__/index-test.js.snap
+++ b/packages/jest-matcher-utils/src/__tests__/__snapshots__/index-test.js.snap
@@ -5,21 +5,21 @@ exports[`.stringify() reduces maxDepth if stringifying very large objects 1`] =
 exports[`.stringify() reduces maxDepth if stringifying very large objects 2`] = `"{\\"a\\": 1, \\"b\\": {\\"0\\": \\"test\\", \\"1\\": \\"test\\", \\"2\\": \\"test\\", \\"3\\": \\"test\\", \\"4\\": \\"test\\", \\"5\\": \\"test\\", \\"6\\": \\"test\\", \\"7\\": \\"test\\", \\"8\\": \\"test\\", \\"9\\": \\"test\\"}}"`;
 
 exports[`.stringify() toJSON errors when comparing two objects 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  {\\"b\\": 1, \\"toJSON\\": [Function toJSON]}
+  <green>{\\"b\\": 1, \\"toJSON\\": [Function toJSON]}</>
 Received:
-  {\\"a\\": 1, \\"toJSON\\": [Function toJSON]}
+  <red>{\\"a\\": 1, \\"toJSON\\": [Function toJSON]}</>
 
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"b\\": 1,
-+  \\"a\\": 1,
-   \\"toJSON\\": [Function toJSON],
- }"
+<dim> Object {
+<green>-  \\"b\\": 1,</>
+<red>+  \\"a\\": 1,</>
+<dim>   \\"toJSON\\": [Function toJSON],
+<dim> }"
 `;
diff --git a/packages/jest-matchers/src/__tests__/__snapshots__/extend-test.js.snap b/packages/jest-matchers/src/__tests__/__snapshots__/extend-test.js.snap
index 4ef46beb012f..7565cb732261 100644
--- a/packages/jest-matchers/src/__tests__/__snapshots__/extend-test.js.snap
+++ b/packages/jest-matchers/src/__tests__/__snapshots__/extend-test.js.snap
@@ -2,4 +2,4 @@
 
 exports[`is available globally 1`] = `"expected 15 to be divisible by 2"`;
 
-exports[`is ok if there is no message specified 1`] = `"No message was specified for this matcher."`;
+exports[`is ok if there is no message specified 1`] = `"<red>No message was specified for this matcher.</>"`;
diff --git a/packages/jest-matchers/src/__tests__/__snapshots__/matchers-test.js.snap b/packages/jest-matchers/src/__tests__/__snapshots__/matchers-test.js.snap
index 862c69a08131..b9d2dd73753b 100644
--- a/packages/jest-matchers/src/__tests__/__snapshots__/matchers-test.js.snap
+++ b/packages/jest-matchers/src/__tests__/__snapshots__/matchers-test.js.snap
@@ -1,3278 +1,3278 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`.toBe() does not crash on circular references 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  {}
+  <green>{}</>
 Received:
-  {\\"circular\\": [Circular]}
+  <red>{\\"circular\\": [Circular]}</>
 
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
--Object {}
-+Object {
-+  \\"circular\\": [Circular],
-+}"
+<green>-Object {}</>
+<red>+Object {</>
+<red>+  \\"circular\\": [Circular],</>
+<red>+}</>"
 `;
 
 exports[`.toBe() fails for '"a"' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  \\"a\\"
+  <green>\\"a\\"</>
 Received:
-  \\"a\\""
+  <red>\\"a\\"</>"
 `;
 
 exports[`.toBe() fails for '{}' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  {}
+  <green>{}</>
 Received:
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBe() fails for '1' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  1
+  <green>1</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBe() fails for 'Array []' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  Array []
+  <green>Array []</>
 Received:
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBe() fails for 'false' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  false
+  <green>false</>
 Received:
-  false"
+  <red>false</>"
 `;
 
 exports[`.toBe() fails for 'null' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  null
+  <green>null</>
 Received:
-  null"
+  <red>null</>"
 `;
 
 exports[`.toBe() fails for 'undefined' with '.not' 1`] = `
-"expect(received).not.toBe(expected)
+"<dim>expect(<red>received</><dim>).not.toBe(<green>expected</><dim>)
 
 Expected value to not be (using ===):
-  undefined
+  <green>undefined</>
 Received:
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBe() fails for: "abc" and "cde" 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  \\"cde\\"
+  <green>\\"cde\\"</>
 Received:
-  \\"abc\\""
+  <red>\\"abc\\"</>"
 `;
 
 exports[`.toBe() fails for: {"a": 1} and {"a": 1} 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  {\\"a\\": 1}
+  <green>{\\"a\\": 1}</>
 Received:
-  {\\"a\\": 1}
+  <red>{\\"a\\": 1}</>
 
 Difference:
 
-Compared values have no visual difference."
+<dim>Compared values have no visual difference."
 `;
 
 exports[`.toBe() fails for: {"a": 1} and {"a": 5} 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  {\\"a\\": 5}
+  <green>{\\"a\\": 5}</>
 Received:
-  {\\"a\\": 1}
+  <red>{\\"a\\": 1}</>
 
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": 5,
-+  \\"a\\": 1,
- }"
+<dim> Object {
+<green>-  \\"a\\": 5,</>
+<red>+  \\"a\\": 1,</>
+<dim> }"
 `;
 
 exports[`.toBe() fails for: {} and {} 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  {}
+  <green>{}</>
 Received:
-  {}
+  <red>{}</>
 
 Difference:
 
-Compared values have no visual difference."
+<dim>Compared values have no visual difference."
 `;
 
 exports[`.toBe() fails for: 1 and 2 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBe() fails for: Array [] and Array [] 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  Array []
+  <green>Array []</>
 Received:
-  Array []
+  <red>Array []</>
 
 Difference:
 
-Compared values have no visual difference."
+<dim>Compared values have no visual difference."
 `;
 
 exports[`.toBe() fails for: null and undefined 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  undefined
+  <green>undefined</>
 Received:
-  null
+  <red>null</>
 
 Difference:
 
-  Comparing two different types of values. Expected undefined but received null."
+  Comparing two different types of values. Expected <green>undefined</> but received <red>null</>."
 `;
 
 exports[`.toBe() fails for: true and false 1`] = `
-"expect(received).toBe(expected)
+"<dim>expect(<red>received</><dim>).toBe(<green>expected</><dim>)
 
 Expected value to be (using ===):
-  false
+  <green>false</>
 Received:
-  true"
+  <red>true</>"
 `;
 
 exports[`.toBeCloseTo() accepts an optional precision argument: [0, 0.000004, 5] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 5-digit precision):
-  0.000004
+Expected value not to be close to (with <green>5</>-digit precision):
+  <green>0.000004</>
 Received:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeCloseTo() accepts an optional precision argument: [0, 0.0001, 3] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 3-digit precision):
-  0.0001
+Expected value not to be close to (with <green>3</>-digit precision):
+  <green>0.0001</>
 Received:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeCloseTo() accepts an optional precision argument: [0, 0.1, 0] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 0-digit precision):
-  0.1
+Expected value not to be close to (with <green>0</>-digit precision):
+  <green>0.1</>
 Received:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeCloseTo() passes: [0, 0.001] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 2-digit precision):
-  0.001
+Expected value not to be close to (with <green>2</>-digit precision):
+  <green>0.001</>
 Received:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeCloseTo() passes: [0, 0] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 2-digit precision):
-  0
+Expected value not to be close to (with <green>2</>-digit precision):
+  <green>0</>
 Received:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeCloseTo() passes: [1.23, 1.225] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 2-digit precision):
-  1.225
+Expected value not to be close to (with <green>2</>-digit precision):
+  <green>1.225</>
 Received:
-  1.23"
+  <red>1.23</>"
 `;
 
 exports[`.toBeCloseTo() passes: [1.23, 1.226] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 2-digit precision):
-  1.226
+Expected value not to be close to (with <green>2</>-digit precision):
+  <green>1.226</>
 Received:
-  1.23"
+  <red>1.23</>"
 `;
 
 exports[`.toBeCloseTo() passes: [1.23, 1.229] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 2-digit precision):
-  1.229
+Expected value not to be close to (with <green>2</>-digit precision):
+  <green>1.229</>
 Received:
-  1.23"
+  <red>1.23</>"
 `;
 
 exports[`.toBeCloseTo() passes: [1.23, 1.234] 1`] = `
-"expect(received).not.toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).not.toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value not to be close to (with 2-digit precision):
-  1.234
+Expected value not to be close to (with <green>2</>-digit precision):
+  <green>1.234</>
 Received:
-  1.23"
+  <red>1.23</>"
 `;
 
 exports[`.toBeCloseTo() throws: [0, 0.01] 1`] = `
-"expect(received).toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value to be close to (with 2-digit precision):
-  0.01
+Expected value to be close to (with <green>2</>-digit precision):
+  <green>0.01</>
 Received:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeCloseTo() throws: [1, 1.23] 1`] = `
-"expect(received).toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value to be close to (with 2-digit precision):
-  1.23
+Expected value to be close to (with <green>2</>-digit precision):
+  <green>1.23</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeCloseTo() throws: [1.23, 1.2249999] 1`] = `
-"expect(received).toBeCloseTo(expected, precision)
+"<dim>expect(<red>received</><dim>).toBeCloseTo(<green>expected, precision</><dim>)
 
-Expected value to be close to (with 2-digit precision):
-  1.2249999
+Expected value to be close to (with <green>2</>-digit precision):
+  <green>1.2249999</>
 Received:
-  1.23"
+  <red>1.23</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '"a"' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  \\"a\\""
+  <red>\\"a\\"</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '"a"' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  \\"a\\""
+  <red>\\"a\\"</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '[Function anonymous]' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  [Function anonymous]"
+  <red>[Function anonymous]</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '[Function anonymous]' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  [Function anonymous]"
+  <red>[Function anonymous]</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '{}' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '{}' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '0.5' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  0.5"
+  <red>0.5</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '0.5' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  0.5"
+  <red>0.5</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '1' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() '1' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'Array []' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'Array []' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'Infinity' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'Infinity' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'Map {}' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  Map {}"
+  <red>Map {}</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'Map {}' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  Map {}"
+  <red>Map {}</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'true' is defined 1`] = `
-"expect(received).not.toBeDefined()
+"<dim>expect(<red>received</><dim>).not.toBeDefined(<dim>)
 
 Expected value not to be defined, instead received
-  true"
+  <red>true</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() 'true' is defined 2`] = `
-"expect(received).toBeUndefined()
+"<dim>expect(<red>received</><dim>).toBeUndefined(<dim>)
 
 Expected value to be undefined, instead received
-  true"
+  <red>true</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() undefined is undefined 1`] = `
-"expect(received).toBeDefined()
+"<dim>expect(<red>received</><dim>).toBeDefined(<dim>)
 
 Expected value to be defined, instead received
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBeDefined(), .toBeUndefined() undefined is undefined 2`] = `
-"expect(received).not.toBeUndefined()
+"<dim>expect(<red>received</><dim>).not.toBeUndefined(<dim>)
 
 Expected value not to be undefined, instead received
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [-Infinity, -Infinity] 1`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  -Infinity
+  <green>-Infinity</>
 Received:
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [-Infinity, -Infinity] 2`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  -Infinity
+  <green>-Infinity</>
 Received:
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [1, 1] 1`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  1
+  <green>1</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [1, 1] 2`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  1
+  <green>1</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [1.7976931348623157e+308, 1.7976931348623157e+308] 1`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  1.7976931348623157e+308
+  <green>1.7976931348623157e+308</>
 Received:
-  1.7976931348623157e+308"
+  <red>1.7976931348623157e+308</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [1.7976931348623157e+308, 1.7976931348623157e+308] 2`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  1.7976931348623157e+308
+  <green>1.7976931348623157e+308</>
 Received:
-  1.7976931348623157e+308"
+  <red>1.7976931348623157e+308</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [5e-324, 5e-324] 1`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  5e-324
+  <green>5e-324</>
 Received:
-  5e-324"
+  <red>5e-324</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [5e-324, 5e-324] 2`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  5e-324
+  <green>5e-324</>
 Received:
-  5e-324"
+  <red>5e-324</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [Infinity, Infinity] 1`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  Infinity
+  <green>Infinity</>
 Received:
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() equal numbers: [Infinity, Infinity] 2`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  Infinity
+  <green>Infinity</>
 Received:
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  Infinity
+  <green>Infinity</>
 Received:
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  Infinity
+  <green>Infinity</>
 Received:
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  -Infinity
+  <green>-Infinity</>
 Received:
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  -Infinity
+  <green>-Infinity</>
 Received:
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  Infinity
+  <green>Infinity</>
 Received:
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  Infinity
+  <green>Infinity</>
 Received:
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  -Infinity
+  <green>-Infinity</>
 Received:
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [-Infinity, Infinity] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  -Infinity
+  <green>-Infinity</>
 Received:
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  0.2
+  <green>0.2</>
 Received:
-  0.1"
+  <red>0.1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  0.2
+  <green>0.2</>
 Received:
-  0.1"
+  <red>0.1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  0.1
+  <green>0.1</>
 Received:
-  0.2"
+  <red>0.2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  0.1
+  <green>0.1</>
 Received:
-  0.2"
+  <red>0.2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  0.2
+  <green>0.2</>
 Received:
-  0.1"
+  <red>0.1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  0.2
+  <green>0.2</>
 Received:
-  0.1"
+  <red>0.1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  0.1
+  <green>0.1</>
 Received:
-  0.2"
+  <red>0.2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [0.1, 0.2] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  0.1
+  <green>0.1</>
 Received:
-  0.2"
+  <red>0.2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  1
+  <green>1</>
 Received:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  1
+  <green>1</>
 Received:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  1
+  <green>1</>
 Received:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [1, 2] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  1
+  <green>1</>
 Received:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  7
+  <green>7</>
 Received:
-  3"
+  <red>3</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  7
+  <green>7</>
 Received:
-  3"
+  <red>3</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  3
+  <green>3</>
 Received:
-  7"
+  <red>7</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  3
+  <green>3</>
 Received:
-  7"
+  <red>7</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  7
+  <green>7</>
 Received:
-  3"
+  <red>3</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  7
+  <green>7</>
 Received:
-  3"
+  <red>3</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  3
+  <green>3</>
 Received:
-  7"
+  <red>7</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [3, 7] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  3
+  <green>3</>
 Received:
-  7"
+  <red>7</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  1.7976931348623157e+308
+  <green>1.7976931348623157e+308</>
 Received:
-  5e-324"
+  <red>5e-324</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  1.7976931348623157e+308
+  <green>1.7976931348623157e+308</>
 Received:
-  5e-324"
+  <red>5e-324</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  5e-324
+  <green>5e-324</>
 Received:
-  1.7976931348623157e+308"
+  <red>1.7976931348623157e+308</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  5e-324
+  <green>5e-324</>
 Received:
-  1.7976931348623157e+308"
+  <red>1.7976931348623157e+308</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  1.7976931348623157e+308
+  <green>1.7976931348623157e+308</>
 Received:
-  5e-324"
+  <red>5e-324</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  1.7976931348623157e+308
+  <green>1.7976931348623157e+308</>
 Received:
-  5e-324"
+  <red>5e-324</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  5e-324
+  <green>5e-324</>
 Received:
-  1.7976931348623157e+308"
+  <red>1.7976931348623157e+308</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [5e-324, 1.7976931348623157e+308] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  5e-324
+  <green>5e-324</>
 Received:
-  1.7976931348623157e+308"
+  <red>1.7976931348623157e+308</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  18
+  <green>18</>
 Received:
-  9"
+  <red>9</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  18
+  <green>18</>
 Received:
-  9"
+  <red>9</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  9
+  <green>9</>
 Received:
-  18"
+  <red>18</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  9
+  <green>9</>
 Received:
-  18"
+  <red>18</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  18
+  <green>18</>
 Received:
-  9"
+  <red>9</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  18
+  <green>18</>
 Received:
-  9"
+  <red>9</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  9
+  <green>9</>
 Received:
-  18"
+  <red>18</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [9, 18] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  9
+  <green>9</>
 Received:
-  18"
+  <red>18</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 1`] = `
-"expect(received).toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThan(<green>expected</><dim>)
 
 Expected value to be greater than:
-  34
+  <green>34</>
 Received:
-  17"
+  <red>17</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 2`] = `
-"expect(received).not.toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThan(<green>expected</><dim>)
 
 Expected value not to be less than:
-  34
+  <green>34</>
 Received:
-  17"
+  <red>17</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 3`] = `
-"expect(received).not.toBeGreaterThan(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThan(<green>expected</><dim>)
 
 Expected value not to be greater than:
-  17
+  <green>17</>
 Received:
-  34"
+  <red>34</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 4`] = `
-"expect(received).toBeLessThan(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThan(<green>expected</><dim>)
 
 Expected value to be less than:
-  17
+  <green>17</>
 Received:
-  34"
+  <red>34</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 5`] = `
-"expect(received).toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value to be greater than or equal:
-  34
+  <green>34</>
 Received:
-  17"
+  <red>17</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 6`] = `
-"expect(received).not.toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be less than or equal:
-  34
+  <green>34</>
 Received:
-  17"
+  <red>17</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 7`] = `
-"expect(received).not.toBeGreaterThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toBeGreaterThanOrEqual(<green>expected</><dim>)
 
 Expected value not to be greater than or equal:
-  17
+  <green>17</>
 Received:
-  34"
+  <red>34</>"
 `;
 
 exports[`.toBeGreaterThan(), .toBeLessThan(), .toBeGreaterThanOrEqual(), .toBeLessThanOrEqual() throws: [17, 34] 8`] = `
-"expect(received).toBeLessThanOrEqual(expected)
+"<dim>expect(<red>received</><dim>).toBeLessThanOrEqual(<green>expected</><dim>)
 
 Expected value to be less than or equal:
-  17
+  <green>17</>
 Received:
-  34"
+  <red>34</>"
 `;
 
 exports[`.toBeInstanceOf() failing "a" and [Function String] 1`] = `
-"expect(value).toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value to be an instance of:
-  \\"String\\"
+  <green>\\"String\\"</>
 Received:
-  \\"a\\"
+  <red>\\"a\\"</>
 Constructor:
-  \\"String\\""
+  <red>\\"String\\"</>"
 `;
 
 exports[`.toBeInstanceOf() failing {} and [Function A] 1`] = `
-"expect(value).toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value to be an instance of:
-  \\"A\\"
+  <green>\\"A\\"</>
 Received:
-  {}
+  <red>{}</>
 Constructor:
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBeInstanceOf() failing {} and [Function B] 1`] = `
-"expect(value).toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value to be an instance of:
-  \\"B\\"
+  <green>\\"B\\"</>
 Received:
-  {}
+  <red>{}</>
 Constructor:
-  \\"A\\""
+  <red>\\"A\\"</>"
 `;
 
 exports[`.toBeInstanceOf() failing 1 and [Function Number] 1`] = `
-"expect(value).toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value to be an instance of:
-  \\"Number\\"
+  <green>\\"Number\\"</>
 Received:
-  1
+  <red>1</>
 Constructor:
-  \\"Number\\""
+  <red>\\"Number\\"</>"
 `;
 
 exports[`.toBeInstanceOf() failing true and [Function Boolean] 1`] = `
-"expect(value).toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value to be an instance of:
-  \\"Boolean\\"
+  <green>\\"Boolean\\"</>
 Received:
-  true
+  <red>true</>
 Constructor:
-  \\"Boolean\\""
+  <red>\\"Boolean\\"</>"
 `;
 
 exports[`.toBeInstanceOf() passing {} and [Function A] 1`] = `
-"expect(value).not.toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).not.toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value not to be an instance of:
-  \\"A\\"
+  <green>\\"A\\"</>
 Received:
-  {}
+  <red>{}</>
 "
 `;
 
 exports[`.toBeInstanceOf() passing Array [] and [Function Array] 1`] = `
-"expect(value).not.toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).not.toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value not to be an instance of:
-  \\"Array\\"
+  <green>\\"Array\\"</>
 Received:
-  Array []
+  <red>Array []</>
 "
 `;
 
 exports[`.toBeInstanceOf() passing Map {} and [Function Map] 1`] = `
-"expect(value).not.toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>).not.toBeInstanceOf(<green>constructor</><dim>)
 
 Expected value not to be an instance of:
-  \\"Map\\"
+  <green>\\"Map\\"</>
 Received:
-  Map {}
+  <red>Map {}</>
 "
 `;
 
 exports[`.toBeInstanceOf() throws if constructor is not a function 1`] = `
-"expect(value)[.not].toBeInstanceOf(constructor)
+"<dim>expect(<red>value</><dim>)[.not].toBeInstanceOf(<green>constructor</><dim>)
 
 Expected constructor to be a function. Instead got:
-  \\"number\\""
+  <green>\\"number\\"</>"
 `;
 
 exports[`.toBeNaN() passes 1`] = `
-"expect(received).not.toBeNaN()
+"<dim>expect(<red>received</><dim>).not.toBeNaN(<dim>)
 
 Expected value not to be NaN, instead received
-  NaN"
+  <red>NaN</>"
 `;
 
 exports[`.toBeNaN() passes 2`] = `
-"expect(received).not.toBeNaN()
+"<dim>expect(<red>received</><dim>).not.toBeNaN(<dim>)
 
 Expected value not to be NaN, instead received
-  NaN"
+  <red>NaN</>"
 `;
 
 exports[`.toBeNaN() passes 3`] = `
-"expect(received).not.toBeNaN()
+"<dim>expect(<red>received</><dim>).not.toBeNaN(<dim>)
 
 Expected value not to be NaN, instead received
-  NaN"
+  <red>NaN</>"
 `;
 
 exports[`.toBeNaN() passes 4`] = `
-"expect(received).not.toBeNaN()
+"<dim>expect(<red>received</><dim>).not.toBeNaN(<dim>)
 
 Expected value not to be NaN, instead received
-  NaN"
+  <red>NaN</>"
 `;
 
 exports[`.toBeNaN() throws 1`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeNaN() throws 2`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  \\"\\""
+  <red>\\"\\"</>"
 `;
 
 exports[`.toBeNaN() throws 3`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  null"
+  <red>null</>"
 `;
 
 exports[`.toBeNaN() throws 4`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBeNaN() throws 5`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBeNaN() throws 6`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBeNaN() throws 7`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  0.2"
+  <red>0.2</>"
 `;
 
 exports[`.toBeNaN() throws 8`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeNaN() throws 9`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeNaN() throws 10`] = `
-"expect(received).toBeNaN()
+"<dim>expect(<red>received</><dim>).toBeNaN(<dim>)
 
 Expected value to be NaN, instead received
-  -Infinity"
+  <red>-Infinity</>"
 `;
 
 exports[`.toBeNull() fails for '"a"' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  \\"a\\""
+  <red>\\"a\\"</>"
 `;
 
 exports[`.toBeNull() fails for '[Function anonymous]' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  [Function anonymous]"
+  <red>[Function anonymous]</>"
 `;
 
 exports[`.toBeNull() fails for '{}' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBeNull() fails for '0.5' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  0.5"
+  <red>0.5</>"
 `;
 
 exports[`.toBeNull() fails for '1' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeNull() fails for 'Array []' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBeNull() fails for 'Infinity' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeNull() fails for 'Map {}' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  Map {}"
+  <red>Map {}</>"
 `;
 
 exports[`.toBeNull() fails for 'true' with .not 1`] = `
-"expect(received).toBeNull()
+"<dim>expect(<red>received</><dim>).toBeNull(<dim>)
 
 Expected value to be null, instead received
-  true"
+  <red>true</>"
 `;
 
 exports[`.toBeNull() pass for null 1`] = `
-"expect(received).not.toBeNull()
+"<dim>expect(<red>received</><dim>).not.toBeNull(<dim>)
 
 Expected value not to be null, instead received
-  null"
+  <red>null</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '""' is falsy 1`] = `
-"expect(received).toBeTruthy()
+"<dim>expect(<red>received</><dim>).toBeTruthy(<dim>)
 
 Expected value to be truthy, instead received
-  \\"\\""
+  <red>\\"\\"</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '""' is falsy 2`] = `
-"expect(received).not.toBeFalsy()
+"<dim>expect(<red>received</><dim>).not.toBeFalsy(<dim>)
 
 Expected value not to be falsy, instead received
-  \\"\\""
+  <red>\\"\\"</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '"a"' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  \\"a\\""
+  <red>\\"a\\"</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '"a"' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  \\"a\\""
+  <red>\\"a\\"</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '[Function anonymous]' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  [Function anonymous]"
+  <red>[Function anonymous]</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '[Function anonymous]' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  [Function anonymous]"
+  <red>[Function anonymous]</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '{}' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '{}' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  {}"
+  <red>{}</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '0' is falsy 1`] = `
-"expect(received).toBeTruthy()
+"<dim>expect(<red>received</><dim>).toBeTruthy(<dim>)
 
 Expected value to be truthy, instead received
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '0' is falsy 2`] = `
-"expect(received).not.toBeFalsy()
+"<dim>expect(<red>received</><dim>).not.toBeFalsy(<dim>)
 
 Expected value not to be falsy, instead received
-  0"
+  <red>0</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '0.5' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  0.5"
+  <red>0.5</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '0.5' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  0.5"
+  <red>0.5</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '1' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() '1' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  1"
+  <red>1</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'Array []' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'Array []' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'Infinity' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'Infinity' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  Infinity"
+  <red>Infinity</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'Map {}' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  Map {}"
+  <red>Map {}</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'Map {}' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  Map {}"
+  <red>Map {}</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'NaN' is falsy 1`] = `
-"expect(received).toBeTruthy()
+"<dim>expect(<red>received</><dim>).toBeTruthy(<dim>)
 
 Expected value to be truthy, instead received
-  NaN"
+  <red>NaN</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'NaN' is falsy 2`] = `
-"expect(received).not.toBeFalsy()
+"<dim>expect(<red>received</><dim>).not.toBeFalsy(<dim>)
 
 Expected value not to be falsy, instead received
-  NaN"
+  <red>NaN</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'false' is falsy 1`] = `
-"expect(received).toBeTruthy()
+"<dim>expect(<red>received</><dim>).toBeTruthy(<dim>)
 
 Expected value to be truthy, instead received
-  false"
+  <red>false</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'false' is falsy 2`] = `
-"expect(received).not.toBeFalsy()
+"<dim>expect(<red>received</><dim>).not.toBeFalsy(<dim>)
 
 Expected value not to be falsy, instead received
-  false"
+  <red>false</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'null' is falsy 1`] = `
-"expect(received).toBeTruthy()
+"<dim>expect(<red>received</><dim>).toBeTruthy(<dim>)
 
 Expected value to be truthy, instead received
-  null"
+  <red>null</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'null' is falsy 2`] = `
-"expect(received).not.toBeFalsy()
+"<dim>expect(<red>received</><dim>).not.toBeFalsy(<dim>)
 
 Expected value not to be falsy, instead received
-  null"
+  <red>null</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'true' is truthy 1`] = `
-"expect(received).not.toBeTruthy()
+"<dim>expect(<red>received</><dim>).not.toBeTruthy(<dim>)
 
 Expected value not to be truthy, instead received
-  true"
+  <red>true</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'true' is truthy 2`] = `
-"expect(received).toBeFalsy()
+"<dim>expect(<red>received</><dim>).toBeFalsy(<dim>)
 
 Expected value to be falsy, instead received
-  true"
+  <red>true</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'undefined' is falsy 1`] = `
-"expect(received).toBeTruthy()
+"<dim>expect(<red>received</><dim>).toBeTruthy(<dim>)
 
 Expected value to be truthy, instead received
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() 'undefined' is falsy 2`] = `
-"expect(received).not.toBeFalsy()
+"<dim>expect(<red>received</><dim>).not.toBeFalsy(<dim>)
 
 Expected value not to be falsy, instead received
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() does not accept arguments 1`] = `
-"expect(received)[.not].toBeTruthy()
+"<dim>expect(<red>received</><dim>)[.not].toBeTruthy(<dim>)
 
 Matcher does not accept any arguments.
-Got: null"
+Got: <green>null</>"
 `;
 
 exports[`.toBeTruthy(), .toBeFalsy() does not accept arguments 2`] = `
-"expect(received)[.not].toBeFalsy()
+"<dim>expect(<red>received</><dim>)[.not].toBeFalsy(<dim>)
 
 Matcher does not accept any arguments.
-Got: null"
+Got: <green>null</>"
 `;
 
 exports[`.toContain(), .toContainEqual() '"11112111"' contains '"2"' 1`] = `
-"expect(string).not.toContain(value)
+"<dim>expect(<red>string</><dim>).not.toContain(<green>value</><dim>)
 
 Expected string:
-  \\"11112111\\"
+  <red>\\"11112111\\"</>
 Not to contain value:
-  \\"2\\"
+  <green>\\"2\\"</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '"abcdef"' contains '"abc"' 1`] = `
-"expect(string).not.toContain(value)
+"<dim>expect(<red>string</><dim>).not.toContain(<green>value</><dim>)
 
 Expected string:
-  \\"abcdef\\"
+  <red>\\"abcdef\\"</>
 Not to contain value:
-  \\"abc\\"
+  <green>\\"abc\\"</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '["a", "b", "c", "d"]' contains '"a"' 1`] = `
-"expect(array).not.toContain(value)
+"<dim>expect(<red>array</><dim>).not.toContain(<green>value</><dim>)
 
 Expected array:
-  [\\"a\\", \\"b\\", \\"c\\", \\"d\\"]
+  <red>[\\"a\\", \\"b\\", \\"c\\", \\"d\\"]</>
 Not to contain value:
-  \\"a\\"
+  <green>\\"a\\"</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '["a", "b", "c", "d"]' contains a value equal to '"a"' 1`] = `
-"expect(array).not.toContainEqual(value)
+"<dim>expect(<red>array</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [\\"a\\", \\"b\\", \\"c\\", \\"d\\"]
+  <red>[\\"a\\", \\"b\\", \\"c\\", \\"d\\"]</>
 Not to contain a value equal to:
-  \\"a\\"
+  <green>\\"a\\"</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[{"a": "b"}, {"a": "c"}]' contains a value equal to '{"a": "b"}' 1`] = `
-"expect(array).not.toContainEqual(value)
+"<dim>expect(<red>array</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [{\\"a\\": \\"b\\"}, {\\"a\\": \\"c\\"}]
+  <red>[{\\"a\\": \\"b\\"}, {\\"a\\": \\"c\\"}]</>
 Not to contain a value equal to:
-  {\\"a\\": \\"b\\"}
+  <green>{\\"a\\": \\"b\\"}</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[{"a": "b"}, {"a": "c"}]' does not contain a value equal to'{"a": "d"}' 1`] = `
-"expect(array).toContainEqual(value)
+"<dim>expect(<red>array</><dim>).toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [{\\"a\\": \\"b\\"}, {\\"a\\": \\"c\\"}]
+  <red>[{\\"a\\": \\"b\\"}, {\\"a\\": \\"c\\"}]</>
 To contain a value equal to:
-  {\\"a\\": \\"d\\"}"
+  <green>{\\"a\\": \\"d\\"}</>"
 `;
 
 exports[`.toContain(), .toContainEqual() '[{}, Array []]' does not contain '{}' 1`] = `
-"expect(array).toContain(value)
+"<dim>expect(<red>array</><dim>).toContain(<green>value</><dim>)
 
 Expected array:
-  [{}, Array []]
+  <red>[{}, Array []]</>
 To contain value:
-  {}"
+  <green>{}</>"
 `;
 
 exports[`.toContain(), .toContainEqual() '[{}, Array []]' does not contain 'Array []' 1`] = `
-"expect(array).toContain(value)
+"<dim>expect(<red>array</><dim>).toContain(<green>value</><dim>)
 
 Expected array:
-  [{}, Array []]
+  <red>[{}, Array []]</>
 To contain value:
-  Array []"
+  <green>Array []</>"
 `;
 
 exports[`.toContain(), .toContainEqual() '[0, 1]' contains '1' 1`] = `
-"expect(object).not.toContain(value)
+"<dim>expect(<red>object</><dim>).not.toContain(<green>value</><dim>)
 
 Expected object:
-  [0, 1]
+  <red>[0, 1]</>
 Not to contain value:
-  1
+  <green>1</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[0, 1]' contains a value equal to '1' 1`] = `
-"expect(object).not.toContainEqual(value)
+"<dim>expect(<red>object</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected object:
-  [0, 1]
+  <red>[0, 1]</>
 Not to contain a value equal to:
-  1
+  <green>1</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[1, 2, 3, 4]' contains '1' 1`] = `
-"expect(array).not.toContain(value)
+"<dim>expect(<red>array</><dim>).not.toContain(<green>value</><dim>)
 
 Expected array:
-  [1, 2, 3, 4]
+  <red>[1, 2, 3, 4]</>
 Not to contain value:
-  1
+  <green>1</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[1, 2, 3, 4]' contains a value equal to '1' 1`] = `
-"expect(array).not.toContainEqual(value)
+"<dim>expect(<red>array</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [1, 2, 3, 4]
+  <red>[1, 2, 3, 4]</>
 Not to contain a value equal to:
-  1
+  <green>1</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[1, 2, 3]' does not contain '4' 1`] = `
-"expect(array).toContain(value)
+"<dim>expect(<red>array</><dim>).toContain(<green>value</><dim>)
 
 Expected array:
-  [1, 2, 3]
+  <red>[1, 2, 3]</>
 To contain value:
-  4"
+  <green>4</>"
 `;
 
 exports[`.toContain(), .toContainEqual() '[Symbol(a)]' contains 'Symbol(a)' 1`] = `
-"expect(array).not.toContain(value)
+"<dim>expect(<red>array</><dim>).not.toContain(<green>value</><dim>)
 
 Expected array:
-  [Symbol(a)]
+  <red>[Symbol(a)]</>
 Not to contain value:
-  Symbol(a)
+  <green>Symbol(a)</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[Symbol(a)]' contains a value equal to 'Symbol(a)' 1`] = `
-"expect(array).not.toContainEqual(value)
+"<dim>expect(<red>array</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [Symbol(a)]
+  <red>[Symbol(a)]</>
 Not to contain a value equal to:
-  Symbol(a)
+  <green>Symbol(a)</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[null, undefined]' does not contain '1' 1`] = `
-"expect(array).toContain(value)
+"<dim>expect(<red>array</><dim>).toContain(<green>value</><dim>)
 
 Expected array:
-  [null, undefined]
+  <red>[null, undefined]</>
 To contain value:
-  1"
+  <green>1</>"
 `;
 
 exports[`.toContain(), .toContainEqual() '[undefined, null]' contains 'null' 1`] = `
-"expect(array).not.toContain(value)
+"<dim>expect(<red>array</><dim>).not.toContain(<green>value</><dim>)
 
 Expected array:
-  [undefined, null]
+  <red>[undefined, null]</>
 Not to contain value:
-  null
+  <green>null</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[undefined, null]' contains 'undefined' 1`] = `
-"expect(array).not.toContain(value)
+"<dim>expect(<red>array</><dim>).not.toContain(<green>value</><dim>)
 
 Expected array:
-  [undefined, null]
+  <red>[undefined, null]</>
 Not to contain value:
-  undefined
+  <green>undefined</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[undefined, null]' contains a value equal to 'null' 1`] = `
-"expect(array).not.toContainEqual(value)
+"<dim>expect(<red>array</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [undefined, null]
+  <red>[undefined, null]</>
 Not to contain a value equal to:
-  null
+  <green>null</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() '[undefined, null]' contains a value equal to 'undefined' 1`] = `
-"expect(array).not.toContainEqual(value)
+"<dim>expect(<red>array</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected array:
-  [undefined, null]
+  <red>[undefined, null]</>
 Not to contain a value equal to:
-  undefined
+  <green>undefined</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() 'Set {"abc", "def"}' contains '"abc"' 1`] = `
-"expect(set).not.toContain(value)
+"<dim>expect(<red>set</><dim>).not.toContain(<green>value</><dim>)
 
 Expected set:
-  Set {\\"abc\\", \\"def\\"}
+  <red>Set {\\"abc\\", \\"def\\"}</>
 Not to contain value:
-  \\"abc\\"
+  <green>\\"abc\\"</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() 'Set {1, 2, 3, 4}' contains a value equal to '1' 1`] = `
-"expect(set).not.toContainEqual(value)
+"<dim>expect(<red>set</><dim>).not.toContainEqual(<green>value</><dim>)
 
 Expected set:
-  Set {1, 2, 3, 4}
+  <red>Set {1, 2, 3, 4}</>
 Not to contain a value equal to:
-  1
+  <green>1</>
 "
 `;
 
 exports[`.toContain(), .toContainEqual() error cases 1`] = `
-"expect(collection)[.not].toContainEqual(value)
+"<dim>expect(<red>collection</><dim>)[.not].toContainEqual(<green>value</><dim>)
 
-Expected collection to be an array-like structure.
-Received: null"
+Expected <red>collection</> to be an array-like structure.
+Received: <red>null</>"
 `;
 
 exports[`.toContain(), .toContainEqual() error cases for toContainEqual 1`] = `
-"expect(collection)[.not].toContainEqual(value)
+"<dim>expect(<red>collection</><dim>)[.not].toContainEqual(<green>value</><dim>)
 
-Expected collection to be an array-like structure.
-Received: null"
+Expected <red>collection</> to be an array-like structure.
+Received: <red>null</>"
 `;
 
 exports[`.toEqual() expect("Alice").not.toEqual({"asymmetricMatch": [Function asymmetricMatch]}) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  {\\"asymmetricMatch\\": [Function asymmetricMatch]}
+  <green>{\\"asymmetricMatch\\": [Function asymmetricMatch]}</>
 Received:
-  \\"Alice\\""
+  <red>\\"Alice\\"</>"
 `;
 
 exports[`.toEqual() expect("Eve").toEqual({"asymmetricMatch": [Function asymmetricMatch]}) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  {\\"asymmetricMatch\\": [Function asymmetricMatch]}
+  <green>{\\"asymmetricMatch\\": [Function asymmetricMatch]}</>
 Received:
-  \\"Eve\\""
+  <red>\\"Eve\\"</>"
 `;
 
 exports[`.toEqual() expect("abc").not.toEqual("abc") 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  \\"abc\\"
+  <green>\\"abc\\"</>
 Received:
-  \\"abc\\""
+  <red>\\"abc\\"</>"
 `;
 
 exports[`.toEqual() expect("abcd").not.toEqual(StringContaining "bc") 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  StringContaining \\"bc\\"
+  <green>StringContaining \\"bc\\"</>
 Received:
-  \\"abcd\\""
+  <red>\\"abcd\\"</>"
 `;
 
 exports[`.toEqual() expect("abcd").not.toEqual(StringMatching /bc/) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  StringMatching /bc/
+  <green>StringMatching /bc/</>
 Received:
-  \\"abcd\\""
+  <red>\\"abcd\\"</>"
 `;
 
 exports[`.toEqual() expect("abd").toEqual(StringContaining "bc") 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  StringContaining \\"bc\\"
+  <green>StringContaining \\"bc\\"</>
 Received:
-  \\"abd\\""
+  <red>\\"abd\\"</>"
 `;
 
 exports[`.toEqual() expect("abd").toEqual(StringMatching /bc/i) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  StringMatching /bc/i
+  <green>StringMatching /bc/i</>
 Received:
-  \\"abd\\""
+  <red>\\"abd\\"</>"
 `;
 
 exports[`.toEqual() expect("banana").toEqual("apple") 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  \\"apple\\"
+  <green>\\"apple\\"</>
 Received:
-  \\"banana\\""
+  <red>\\"banana\\"</>"
 `;
 
 exports[`.toEqual() expect([1, 2, 3]).not.toEqual(ArrayContaining [2, 3]) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  ArrayContaining [2, 3]
+  <green>ArrayContaining [2, 3]</>
 Received:
-  [1, 2, 3]"
+  <red>[1, 2, 3]</>"
 `;
 
 exports[`.toEqual() expect([1, 3]).toEqual(ArrayContaining [1, 2]) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  ArrayContaining [1, 2]
+  <green>ArrayContaining [1, 2]</>
 Received:
-  [1, 3]
+  <red>[1, 3]</>
 
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
--ArrayContaining [
-+Array [
-   1,
--  2,
-+  3,
- ]"
+<green>-ArrayContaining [</>
+<red>+Array [</>
+<dim>   1,
+<green>-  2,</>
+<red>+  3,</>
+<dim> ]"
 `;
 
 exports[`.toEqual() expect([Function anonymous]).not.toEqual(Any<Function>) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  Any<Function>
+  <green>Any<Function></>
 Received:
-  [Function anonymous]"
+  <red>[Function anonymous]</>"
 `;
 
 exports[`.toEqual() expect({"a": 1, "b": [Function b], "c": true}).not.toEqual({"a": 1, "b": Any<Function>, "c": Anything}) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  {\\"a\\": 1, \\"b\\": Any<Function>, \\"c\\": Anything}
+  <green>{\\"a\\": 1, \\"b\\": Any<Function>, \\"c\\": Anything}</>
 Received:
-  {\\"a\\": 1, \\"b\\": [Function b], \\"c\\": true}"
+  <red>{\\"a\\": 1, \\"b\\": [Function b], \\"c\\": true}</>"
 `;
 
 exports[`.toEqual() expect({"a": 1, "b": 2}).not.toEqual(ObjectContaining {"a": 1}) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  ObjectContaining {\\"a\\": 1}
+  <green>ObjectContaining {\\"a\\": 1}</>
 Received:
-  {\\"a\\": 1, \\"b\\": 2}"
+  <red>{\\"a\\": 1, \\"b\\": 2}</>"
 `;
 
 exports[`.toEqual() expect({"a": 1, "b": 2}).toEqual(ObjectContaining {"a": 2}) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  ObjectContaining {\\"a\\": 2}
+  <green>ObjectContaining {\\"a\\": 2}</>
 Received:
-  {\\"a\\": 1, \\"b\\": 2}
+  <red>{\\"a\\": 1, \\"b\\": 2}</>
 
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
--ObjectContaining {
--  \\"a\\": 2,
-+Object {
-+  \\"a\\": 1,
-+  \\"b\\": 2,
- }"
+<green>-ObjectContaining {</>
+<green>-  \\"a\\": 2,</>
+<red>+Object {</>
+<red>+  \\"a\\": 1,</>
+<red>+  \\"b\\": 2,</>
+<dim> }"
 `;
 
 exports[`.toEqual() expect({"a": 5}).toEqual({"b": 6}) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  {\\"b\\": 6}
+  <green>{\\"b\\": 6}</>
 Received:
-  {\\"a\\": 5}
+  <red>{\\"a\\": 5}</>
 
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"b\\": 6,
-+  \\"a\\": 5,
- }"
+<dim> Object {
+<green>-  \\"b\\": 6,</>
+<red>+  \\"a\\": 5,</>
+<dim> }"
 `;
 
 exports[`.toEqual() expect({"a": 99}).not.toEqual({"a": 99}) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  {\\"a\\": 99}
+  <green>{\\"a\\": 99}</>
 Received:
-  {\\"a\\": 99}"
+  <red>{\\"a\\": 99}</>"
 `;
 
 exports[`.toEqual() expect(0).toEqual(-0) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  -0
+  <green>-0</>
 Received:
-  0
+  <red>0</>
 
 Difference:
 
-Compared values have no visual difference."
+<dim>Compared values have no visual difference."
 `;
 
 exports[`.toEqual() expect(1).not.toEqual(1) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  1
+  <green>1</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toEqual() expect(1).toEqual(2) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  2
+  <green>2</>
 Received:
-  1"
+  <red>1</>"
 `;
 
 exports[`.toEqual() expect(1).toEqual(ArrayContaining [1, 2]) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  ArrayContaining [1, 2]
+  <green>ArrayContaining [1, 2]</>
 Received:
-  1
+  <red>1</>
 
 Difference:
 
-  Comparing two different types of values. Expected array but received number."
+  Comparing two different types of values. Expected <green>array</> but received <red>number</>."
 `;
 
 exports[`.toEqual() expect(Set {1, 2}).not.toEqual(Set {1, 2}) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  Set {1, 2}
+  <green>Set {1, 2}</>
 Received:
-  Set {1, 2}"
+  <red>Set {1, 2}</>"
 `;
 
 exports[`.toEqual() expect(Set {1, 2}).toEqual(Set {2, 1}) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  Set {2, 1}
+  <green>Set {2, 1}</>
 Received:
-  Set {1, 2}
+  <red>Set {1, 2}</>
 
 Difference:
 
-Compared values have no visual difference."
+<dim>Compared values have no visual difference."
 `;
 
 exports[`.toEqual() expect(false).toEqual(ObjectContaining {"a": 2}) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  ObjectContaining {\\"a\\": 2}
+  <green>ObjectContaining {\\"a\\": 2}</>
 Received:
-  false
+  <red>false</>
 
 Difference:
 
-  Comparing two different types of values. Expected object but received boolean."
+  Comparing two different types of values. Expected <green>object</> but received <red>boolean</>."
 `;
 
 exports[`.toEqual() expect(null).toEqual(undefined) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  undefined
+  <green>undefined</>
 Received:
-  null
+  <red>null</>
 
 Difference:
 
-  Comparing two different types of values. Expected undefined but received null."
+  Comparing two different types of values. Expected <green>undefined</> but received <red>null</>."
 `;
 
 exports[`.toEqual() expect(true).not.toEqual(Anything) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  Anything
+  <green>Anything</>
 Received:
-  true"
+  <red>true</>"
 `;
 
 exports[`.toEqual() expect(true).not.toEqual(true) 1`] = `
-"expect(received).not.toEqual(expected)
+"<dim>expect(<red>received</><dim>).not.toEqual(<green>expected</><dim>)
 
 Expected value to not equal:
-  true
+  <green>true</>
 Received:
-  true"
+  <red>true</>"
 `;
 
 exports[`.toEqual() expect(true).toEqual(false) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  false
+  <green>false</>
 Received:
-  true"
+  <red>true</>"
 `;
 
 exports[`.toEqual() expect(undefined).toEqual(Any<Function>) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  Any<Function>
+  <green>Any<Function></>
 Received:
-  undefined
+  <red>undefined</>
 
 Difference:
 
-  Comparing two different types of values. Expected function but received undefined."
+  Comparing two different types of values. Expected <green>function</> but received <red>undefined</>."
 `;
 
 exports[`.toEqual() expect(undefined).toEqual(Anything) 1`] = `
-"expect(received).toEqual(expected)
+"<dim>expect(<red>received</><dim>).toEqual(<green>expected</><dim>)
 
 Expected value to equal:
-  Anything
+  <green>Anything</>
 Received:
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toHaveLength error cases 1`] = `
-"expect(received)[.not].toHaveLength(length)
+"<dim>expect(<red>received</><dim>)[.not].toHaveLength(<green>length</><dim>)
 
 Expected value to have a 'length' property that is a number. Received:
-  {\\"a\\": 9}
+  <red>{\\"a\\": 9}</>
 received.length:
-  undefined"
+  <red>undefined</>"
 `;
 
 exports[`.toHaveLength error cases 2`] = `
-"expect(received)[.not].toHaveLength(length)
+"<dim>expect(<red>received</><dim>)[.not].toHaveLength(<green>length</><dim>)
 
 Expected value to have a 'length' property that is a number. Received:
-  0
+  <red>0</>
 "
 `;
 
 exports[`.toHaveLength error cases 3`] = `
-"expect(received)[.not].toHaveLength(length)
+"<dim>expect(<red>received</><dim>)[.not].toHaveLength(<green>length</><dim>)
 
 Expected value to have a 'length' property that is a number. Received:
-  undefined
+  <red>undefined</>
 "
 `;
 
 exports[`.toHaveLength expect("").toHaveLength(0) 1`] = `
-"expect(received).not.toHaveLength(length)
+"<dim>expect(<red>received</><dim>).not.toHaveLength(<green>length</><dim>)
 
 Expected value to not have length:
-  0
+  <green>0</>
 Received:
-  \\"\\"
+  <red>\\"\\"</>
 received.length:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toHaveLength expect("").toHaveLength(1) 1`] = `
-"expect(received).toHaveLength(length)
+"<dim>expect(<red>received</><dim>).toHaveLength(<green>length</><dim>)
 
 Expected value to have length:
-  1
+  <green>1</>
 Received:
-  \\"\\"
+  <red>\\"\\"</>
 received.length:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toHaveLength expect("abc").toHaveLength(3) 1`] = `
-"expect(received).not.toHaveLength(length)
+"<dim>expect(<red>received</><dim>).not.toHaveLength(<green>length</><dim>)
 
 Expected value to not have length:
-  3
+  <green>3</>
 Received:
-  \\"abc\\"
+  <red>\\"abc\\"</>
 received.length:
-  3"
+  <red>3</>"
 `;
 
 exports[`.toHaveLength expect("abc").toHaveLength(66) 1`] = `
-"expect(received).toHaveLength(length)
+"<dim>expect(<red>received</><dim>).toHaveLength(<green>length</><dim>)
 
 Expected value to have length:
-  66
+  <green>66</>
 Received:
-  \\"abc\\"
+  <red>\\"abc\\"</>
 received.length:
-  3"
+  <red>3</>"
 `;
 
 exports[`.toHaveLength expect(["a", "b"]).toHaveLength(2) 1`] = `
-"expect(received).not.toHaveLength(length)
+"<dim>expect(<red>received</><dim>).not.toHaveLength(<green>length</><dim>)
 
 Expected value to not have length:
-  2
+  <green>2</>
 Received:
-  [\\"a\\", \\"b\\"]
+  <red>[\\"a\\", \\"b\\"]</>
 received.length:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toHaveLength expect(["a", "b"]).toHaveLength(99) 1`] = `
-"expect(received).toHaveLength(length)
+"<dim>expect(<red>received</><dim>).toHaveLength(<green>length</><dim>)
 
 Expected value to have length:
-  99
+  <green>99</>
 Received:
-  [\\"a\\", \\"b\\"]
+  <red>[\\"a\\", \\"b\\"]</>
 received.length:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toHaveLength expect([1, 2]).toHaveLength(2) 1`] = `
-"expect(received).not.toHaveLength(length)
+"<dim>expect(<red>received</><dim>).not.toHaveLength(<green>length</><dim>)
 
 Expected value to not have length:
-  2
+  <green>2</>
 Received:
-  [1, 2]
+  <red>[1, 2]</>
 received.length:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toHaveLength expect([1, 2]).toHaveLength(3) 1`] = `
-"expect(received).toHaveLength(length)
+"<dim>expect(<red>received</><dim>).toHaveLength(<green>length</><dim>)
 
 Expected value to have length:
-  3
+  <green>3</>
 Received:
-  [1, 2]
+  <red>[1, 2]</>
 received.length:
-  2"
+  <red>2</>"
 `;
 
 exports[`.toHaveLength expect(Array []).toHaveLength(0) 1`] = `
-"expect(received).not.toHaveLength(length)
+"<dim>expect(<red>received</><dim>).not.toHaveLength(<green>length</><dim>)
 
 Expected value to not have length:
-  0
+  <green>0</>
 Received:
-  Array []
+  <red>Array []</>
 received.length:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toHaveLength expect(Array []).toHaveLength(1) 1`] = `
-"expect(received).toHaveLength(length)
+"<dim>expect(<red>received</><dim>).toHaveLength(<green>length</><dim>)
 
 Expected value to have length:
-  1
+  <green>1</>
 Received:
-  Array []
+  <red>Array []</>
 received.length:
-  0"
+  <red>0</>"
 `;
 
 exports[`.toHaveProperty() {error} expect({"a": {"b": {}}}).toHaveProperty('1') 1`] = `
-"expect(object)[.not].toHaveProperty(path)
+"<dim>expect(<red>object</><dim>)[.not].toHaveProperty(<green>path</><dim>)
 
-Expected path to be a string. Received:
-  number: 1"
+Expected <green>path</> to be a string. Received:
+  number: <red>1</>"
 `;
 
 exports[`.toHaveProperty() {error} expect({"a": {"b": {}}}).toHaveProperty('null') 1`] = `
-"expect(object)[.not].toHaveProperty(path)
+"<dim>expect(<red>object</><dim>)[.not].toHaveProperty(<green>path</><dim>)
 
-Expected path to be a string. Received:
-  null: null"
+Expected <green>path</> to be a string. Received:
+  null: <red>null</>"
 `;
 
 exports[`.toHaveProperty() {error} expect({"a": {"b": {}}}).toHaveProperty('undefined') 1`] = `
-"expect(object)[.not].toHaveProperty(path)
+"<dim>expect(<red>object</><dim>)[.not].toHaveProperty(<green>path</><dim>)
 
-Expected path to be a string. Received:
-  undefined: undefined"
+Expected <green>path</> to be a string. Received:
+  undefined: <red>undefined</>"
 `;
 
 exports[`.toHaveProperty() {error} expect(null).toHaveProperty('a.b') 1`] = `
-"expect(object)[.not].toHaveProperty(path)
+"<dim>expect(<red>object</><dim>)[.not].toHaveProperty(<green>path</><dim>)
 
-Expected object to be an object. Received:
-  null: null"
+Expected <red>object</> to be an object. Received:
+  null: <red>null</>"
 `;
 
 exports[`.toHaveProperty() {error} expect(undefined).toHaveProperty('a') 1`] = `
-"expect(object)[.not].toHaveProperty(path)
+"<dim>expect(<red>object</><dim>)[.not].toHaveProperty(<green>path</><dim>)
 
-Expected object to be an object. Received:
-  undefined: undefined"
+Expected <red>object</> to be an object. Received:
+  undefined: <red>undefined</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect("abc").toHaveProperty('a.b.c') 1`] = `
-"expect(object).toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  \\"abc\\"
+  <red>\\"abc\\"</>
 To have a nested property:
-  \\"a.b.c\\"
+  <green>\\"a.b.c\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: false} expect("abc").toHaveProperty('a.b.c', {"a": 5}) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  \\"abc\\"
+  <red>\\"abc\\"</>
 To have a nested property:
-  \\"a.b.c\\"
+  <green>\\"a.b.c\\"</>
 With a value of:
-  {\\"a\\": 5}
+  <green>{\\"a\\": 5}</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": {"b": {"c": {"d": 1}}}}).toHaveProperty('a.b.c.d', 2) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}</>
 To have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 With a value of:
-  2
+  <green>2</>
 Received:
-  object.a.b.c: {\\"d\\": 1}"
+  <red>object</>.a.b.c: <red>{\\"d\\": 1}</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": {"b": {"c": {"d": 1}}}}).toHaveProperty('a.b.ttt.d', 1) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}</>
 To have a nested property:
-  \\"a.b.ttt.d\\"
+  <green>\\"a.b.ttt.d\\"</>
 With a value of:
-  1
+  <green>1</>
 Received:
-  object.a.b: {\\"c\\": {\\"d\\": 1}}"
+  <red>object</>.a.b: <red>{\\"c\\": {\\"d\\": 1}}</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": {"b": {"c": {}}}}).toHaveProperty('a.b.c.d') 1`] = `
-"expect(object).toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": {}}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": {}}}}</>
 To have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 Received:
-  object.a.b.c: {}"
+  <red>object</>.a.b.c: <red>{}</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": {"b": {"c": {}}}}).toHaveProperty('a.b.c.d', 1) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": {}}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": {}}}}</>
 To have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 With a value of:
-  1
+  <green>1</>
 Received:
-  object.a.b.c: {}"
+  <red>object</>.a.b.c: <red>{}</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": {"b": {"c": 5}}}).toHaveProperty('a.b', {"c": 4}) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": 5}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": 5}}}</>
 To have a nested property:
-  \\"a.b\\"
+  <green>\\"a.b\\"</>
 With a value of:
-  {\\"c\\": 4}
+  <green>{\\"c\\": 4}</>
 Received:
-  object.a: {\\"b\\": {\\"c\\": 5}}
+  <red>object</>.a: <red>{\\"b\\": {\\"c\\": 5}}</>
 Difference:
 
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"c\\": 4,
-+  \\"c\\": 5,
- }"
+<dim> Object {
+<green>-  \\"c\\": 4,</>
+<red>+  \\"c\\": 5,</>
+<dim> }"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": {"b": 3}}).toHaveProperty('a.b', undefined) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": 3}}
+  <red>{\\"a\\": {\\"b\\": 3}}</>
 To have a nested property:
-  \\"a.b\\"
+  <green>\\"a.b\\"</>
 With a value of:
-  undefined
+  <green>undefined</>
 Received:
-  object.a: {\\"b\\": 3}
+  <red>object</>.a: <red>{\\"b\\": 3}</>
 Difference:
 
-  Comparing two different types of values. Expected undefined but received number."
+  Comparing two different types of values. Expected <green>undefined</> but received <red>number</>."
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": 1}).toHaveProperty('a.b.c.d') 1`] = `
-"expect(object).toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  {\\"a\\": 1}
+  <red>{\\"a\\": 1}</>
 To have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 Received:
-  object.a: 1"
+  <red>object</>.a: <red>1</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({"a": 1}).toHaveProperty('a.b.c.d', 5) 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": 1}
+  <red>{\\"a\\": 1}</>
 To have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 With a value of:
-  5
+  <green>5</>
 Received:
-  object.a: 1"
+  <red>object</>.a: <red>1</>"
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({}).toHaveProperty('a') 1`] = `
-"expect(object).toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  {}
+  <red>{}</>
 To have a nested property:
-  \\"a\\"
+  <green>\\"a\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: false} expect({}).toHaveProperty('a', "test") 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {}
+  <red>{}</>
 To have a nested property:
-  \\"a\\"
+  <green>\\"a\\"</>
 With a value of:
-  \\"test\\"
+  <green>\\"test\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: false} expect(1).toHaveProperty('a.b.c') 1`] = `
-"expect(object).toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  1
+  <red>1</>
 To have a nested property:
-  \\"a.b.c\\"
+  <green>\\"a.b.c\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: false} expect(1).toHaveProperty('a.b.c', "test") 1`] = `
-"expect(object).toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  1
+  <red>1</>
 To have a nested property:
-  \\"a.b.c\\"
+  <green>\\"a.b.c\\"</>
 With a value of:
-  \\"test\\"
+  <green>\\"test\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": {"b": {"c": {"d": 1}}}}).toHaveProperty('a.b.c.d')' 1`] = `
-"expect(object).not.toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}</>
 Not to have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": {"b": {"c": {"d": 1}}}}).toHaveProperty('a.b.c.d', 1) 1`] = `
-"expect(object).not.toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": {\\"d\\": 1}}}}</>
 Not to have a nested property:
-  \\"a.b.c.d\\"
+  <green>\\"a.b.c.d\\"</>
 With a value of:
-  1
+  <green>1</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": {"b": {"c": 5}}}).toHaveProperty('a.b', {"c": 5}) 1`] = `
-"expect(object).not.toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": {\\"c\\": 5}}}
+  <red>{\\"a\\": {\\"b\\": {\\"c\\": 5}}}</>
 Not to have a nested property:
-  \\"a.b\\"
+  <green>\\"a.b\\"</>
 With a value of:
-  {\\"c\\": 5}
+  <green>{\\"c\\": 5}</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": {"b": undefined}}).toHaveProperty('a.b')' 1`] = `
-"expect(object).not.toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": undefined}}
+  <red>{\\"a\\": {\\"b\\": undefined}}</>
 Not to have a nested property:
-  \\"a.b\\"
+  <green>\\"a.b\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": {"b": undefined}}).toHaveProperty('a.b', undefined) 1`] = `
-"expect(object).not.toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": {\\"b\\": undefined}}
+  <red>{\\"a\\": {\\"b\\": undefined}}</>
 Not to have a nested property:
-  \\"a.b\\"
+  <green>\\"a.b\\"</>
 With a value of:
-  undefined
+  <green>undefined</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": 0}).toHaveProperty('a')' 1`] = `
-"expect(object).not.toHaveProperty(path)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</><dim>)
 
 Expected the object:
-  {\\"a\\": 0}
+  <red>{\\"a\\": 0}</>
 Not to have a nested property:
-  \\"a\\"
+  <green>\\"a\\"</>
 "
 `;
 
 exports[`.toHaveProperty() {pass: true} expect({"a": 0}).toHaveProperty('a', 0) 1`] = `
-"expect(object).not.toHaveProperty(path, value)
+"<dim>expect(<red>object</><dim>).not.toHaveProperty(<green>path</>, <green>value</><dim>)
 
 Expected the object:
-  {\\"a\\": 0}
+  <red>{\\"a\\": 0}</>
 Not to have a nested property:
-  \\"a\\"
+  <green>\\"a\\"</>
 With a value of:
-  0
+  <green>0</>
 "
 `;
 
 exports[`.toMatch() passes: [Foo bar, /^foo/i] 1`] = `
-"expect(received).not.toMatch(expected)
+"<dim>expect(<red>received</><dim>).not.toMatch(<green>expected</><dim>)
 
 Expected value not to match:
-  /^foo/i
+  <green>/^foo/i</>
 Received:
-  \\"Foo bar\\""
+  <red>\\"Foo bar\\"</>"
 `;
 
 exports[`.toMatch() passes: [foo, foo] 1`] = `
-"expect(received).not.toMatch(expected)
+"<dim>expect(<red>received</><dim>).not.toMatch(<green>expected</><dim>)
 
 Expected value not to match:
-  \\"foo\\"
+  <green>\\"foo\\"</>
 Received:
-  \\"foo\\""
+  <red>\\"foo\\"</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [/foo/i, "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
+<red>string</> value must be a string.
 Received:
-  regexp: /foo/i"
+  regexp: <red>/foo/i</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [[Function anonymous], "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
+<red>string</> value must be a string.
 Received:
-  function: [Function anonymous]"
+  function: <red>[Function anonymous]</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [{}, "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
+<red>string</> value must be a string.
 Received:
-  object: {}"
+  object: <red>{}</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [1, "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
+<red>string</> value must be a string.
 Received:
-  number: 1"
+  number: <red>1</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [Array [], "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
+<red>string</> value must be a string.
 Received:
-  array: Array []"
+  array: <red>Array []</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [true, "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
+<red>string</> value must be a string.
 Received:
-  boolean: true"
+  boolean: <red>true</>"
 `;
 
 exports[`.toMatch() throws if non String actual value passed: [undefined, "foo"] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-string value must be a string.
-Received: undefined"
+<red>string</> value must be a string.
+Received: <red>undefined</>"
 `;
 
 exports[`.toMatch() throws if non String/RegExp expected value passed: ["foo", [Function anonymous]] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-expected value must be a string or a regular expression.
+<green>expected</> value must be a string or a regular expression.
 Expected:
-  function: [Function anonymous]"
+  function: <green>[Function anonymous]</>"
 `;
 
 exports[`.toMatch() throws if non String/RegExp expected value passed: ["foo", {}] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-expected value must be a string or a regular expression.
+<green>expected</> value must be a string or a regular expression.
 Expected:
-  object: {}"
+  object: <green>{}</>"
 `;
 
 exports[`.toMatch() throws if non String/RegExp expected value passed: ["foo", 1] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-expected value must be a string or a regular expression.
+<green>expected</> value must be a string or a regular expression.
 Expected:
-  number: 1"
+  number: <green>1</>"
 `;
 
 exports[`.toMatch() throws if non String/RegExp expected value passed: ["foo", Array []] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-expected value must be a string or a regular expression.
+<green>expected</> value must be a string or a regular expression.
 Expected:
-  array: Array []"
+  array: <green>Array []</>"
 `;
 
 exports[`.toMatch() throws if non String/RegExp expected value passed: ["foo", true] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-expected value must be a string or a regular expression.
+<green>expected</> value must be a string or a regular expression.
 Expected:
-  boolean: true"
+  boolean: <green>true</>"
 `;
 
 exports[`.toMatch() throws if non String/RegExp expected value passed: ["foo", undefined] 1`] = `
-"expect(string)[.not].toMatch(expected)
+"<dim>expect(<red>string</><dim>)[.not].toMatch(<green>expected</><dim>)
 
-expected value must be a string or a regular expression.
-Expected: undefined"
+<green>expected</> value must be a string or a regular expression.
+Expected: <green>undefined</>"
 `;
 
 exports[`.toMatch() throws: [bar, /foo/] 1`] = `
-"expect(received).toMatch(expected)
+"<dim>expect(<red>received</><dim>).toMatch(<green>expected</><dim>)
 
 Expected value to match:
-  /foo/
+  <green>/foo/</>
 Received:
-  \\"bar\\""
+  <red>\\"bar\\"</>"
 `;
 
 exports[`.toMatch() throws: [bar, foo] 1`] = `
-"expect(received).toMatch(expected)
+"<dim>expect(<red>received</><dim>).toMatch(<green>expected</><dim>)
 
 Expected value to match:
-  \\"foo\\"
+  <green>\\"foo\\"</>
 Received:
-  \\"bar\\""
+  <red>\\"bar\\"</>"
 `;
 
 exports[`toMatchObject() {pass: false} expect([0]).toMatchObject([-0]) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  [-0]
+  <green>[-0]</>
 Received:
-  [0]
+  <red>[0]</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Array [
--  -0,
-+  0,
- ]"
+<dim> Array [
+<green>-  -0,</>
+<red>+  0,</>
+<dim> ]"
 `;
 
 exports[`toMatchObject() {pass: false} expect([1, 2, 3]).toMatchObject([1, 2, 2]) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  [1, 2, 2]
+  <green>[1, 2, 2]</>
 Received:
-  [1, 2, 3]
+  <red>[1, 2, 3]</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Array [
-   1,
-   2,
--  2,
-+  3,
- ]"
+<dim> Array [
+<dim>   1,
+<dim>   2,
+<green>-  2,</>
+<red>+  3,</>
+<dim> ]"
 `;
 
 exports[`toMatchObject() {pass: false} expect([1, 2, 3]).toMatchObject([2, 3, 1]) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  [2, 3, 1]
+  <green>[2, 3, 1]</>
 Received:
-  [1, 2, 3]
+  <red>[1, 2, 3]</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Array [
-+  1,
-   2,
-   3,
--  1,
- ]"
+<dim> Array [
+<red>+  1,</>
+<dim>   2,
+<dim>   3,
+<green>-  1,</>
+<dim> ]"
 `;
 
 exports[`toMatchObject() {pass: false} expect([1, 2]).toMatchObject([1, 3]) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  [1, 3]
+  <green>[1, 3]</>
 Received:
-  [1, 2]
+  <red>[1, 2]</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Array [
-   1,
--  3,
-+  2,
- ]"
+<dim> Array [
+<dim>   1,
+<green>-  3,</>
+<red>+  2,</>
+<dim> ]"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": "a", "c": "d"}).toMatchObject({"a": Any<Number>}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": Any<Number>}
+  <green>{\\"a\\": Any<Number>}</>
 Received:
-  {\\"a\\": \\"a\\", \\"c\\": \\"d\\"}
+  <red>{\\"a\\": \\"a\\", \\"c\\": \\"d\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": Any<Number>,
-+  \\"a\\": \\"a\\",
- }"
+<dim> Object {
+<green>-  \\"a\\": Any<Number>,</>
+<red>+  \\"a\\": \\"a\\",</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": "b", "c": "d"}).toMatchObject({"a": "b!", "c": "d"}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": \\"b!\\", \\"c\\": \\"d\\"}
+  <green>{\\"a\\": \\"b!\\", \\"c\\": \\"d\\"}</>
 Received:
-  {\\"a\\": \\"b\\", \\"c\\": \\"d\\"}
+  <red>{\\"a\\": \\"b\\", \\"c\\": \\"d\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": \\"b!\\",
-+  \\"a\\": \\"b\\",
-   \\"c\\": \\"d\\",
- }"
+<dim> Object {
+<green>-  \\"a\\": \\"b!\\",</>
+<red>+  \\"a\\": \\"b\\",</>
+<dim>   \\"c\\": \\"d\\",
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": "b", "c": "d"}).toMatchObject({"e": "b"}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"e\\": \\"b\\"}
+  <green>{\\"e\\": \\"b\\"}</>
 Received:
-  {\\"a\\": \\"b\\", \\"c\\": \\"d\\"}
+  <red>{\\"a\\": \\"b\\", \\"c\\": \\"d\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"e\\": \\"b\\",
-+  \\"a\\": \\"b\\",
-+  \\"c\\": \\"d\\",
- }"
+<dim> Object {
+<green>-  \\"e\\": \\"b\\",</>
+<red>+  \\"a\\": \\"b\\",</>
+<red>+  \\"c\\": \\"d\\",</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": "b", "t": {"x": {"r": "r"}, "z": "z"}}).toMatchObject({"a": "b", "t": {"z": [3]}}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": \\"b\\", \\"t\\": {\\"z\\": [3]}}
+  <green>{\\"a\\": \\"b\\", \\"t\\": {\\"z\\": [3]}}</>
 Received:
-  {\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}
+  <red>{\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"a\\": \\"b\\",
-   \\"t\\": Object {
--    \\"z\\": Array [
--      3,
--    ],
-+    \\"z\\": \\"z\\",
-   },
- }"
+<dim> Object {
+<dim>   \\"a\\": \\"b\\",
+<dim>   \\"t\\": Object {
+<green>-    \\"z\\": Array [</>
+<green>-      3,</>
+<green>-    ],</>
+<red>+    \\"z\\": \\"z\\",</>
+<dim>   },
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": "b", "t": {"x": {"r": "r"}, "z": "z"}}).toMatchObject({"t": {"l": {"r": "r"}}}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"t\\": {\\"l\\": {\\"r\\": \\"r\\"}}}
+  <green>{\\"t\\": {\\"l\\": {\\"r\\": \\"r\\"}}}</>
 Received:
-  {\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}
+  <red>{\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"t\\": Object {
--    \\"l\\": Object {
-+    \\"x\\": Object {
-       \\"r\\": \\"r\\",
-     },
-+    \\"z\\": \\"z\\",
-   },
- }"
+<dim> Object {
+<dim>   \\"t\\": Object {
+<green>-    \\"l\\": Object {</>
+<red>+    \\"x\\": Object {</>
+<dim>       \\"r\\": \\"r\\",
+<dim>     },
+<red>+    \\"z\\": \\"z\\",</>
+<dim>   },
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": [{"a": "a", "b": "b"}]}).toMatchObject({"a": [{"a": "c"}]}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": [{\\"a\\": \\"c\\"}]}
+  <green>{\\"a\\": [{\\"a\\": \\"c\\"}]}</>
 Received:
-  {\\"a\\": [{\\"a\\": \\"a\\", \\"b\\": \\"b\\"}]}
+  <red>{\\"a\\": [{\\"a\\": \\"a\\", \\"b\\": \\"b\\"}]}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"a\\": Array [
-     Object {
--      \\"a\\": \\"c\\",
-+      \\"a\\": \\"a\\",
-     },
-   ],
- }"
+<dim> Object {
+<dim>   \\"a\\": Array [
+<dim>     Object {
+<green>-      \\"a\\": \\"c\\",</>
+<red>+      \\"a\\": \\"a\\",</>
+<dim>     },
+<dim>   ],
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": [3, 4, "v"], "b": "b"}).toMatchObject({"a": ["v"]}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": [\\"v\\"]}
+  <green>{\\"a\\": [\\"v\\"]}</>
 Received:
-  {\\"a\\": [3, 4, \\"v\\"], \\"b\\": \\"b\\"}
+  <red>{\\"a\\": [3, 4, \\"v\\"], \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"a\\": Array [
-+    3,
-+    4,
-     \\"v\\",
-   ],
- }"
+<dim> Object {
+<dim>   \\"a\\": Array [
+<red>+    3,</>
+<red>+    4,</>
+<dim>     \\"v\\",
+<dim>   ],
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": [3, 4, 5], "b": "b"}).toMatchObject({"a": [3, 4, 5, 6]}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": [3, 4, 5, 6]}
+  <green>{\\"a\\": [3, 4, 5, 6]}</>
 Received:
-  {\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}
+  <red>{\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"a\\": Array [
-     3,
-     4,
-     5,
--    6,
-   ],
- }"
+<dim> Object {
+<dim>   \\"a\\": Array [
+<dim>     3,
+<dim>     4,
+<dim>     5,
+<green>-    6,</>
+<dim>   ],
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": [3, 4, 5], "b": "b"}).toMatchObject({"a": [3, 4]}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": [3, 4]}
+  <green>{\\"a\\": [3, 4]}</>
 Received:
-  {\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}
+  <red>{\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"a\\": Array [
-     3,
-     4,
-+    5,
-   ],
- }"
+<dim> Object {
+<dim>   \\"a\\": Array [
+<dim>     3,
+<dim>     4,
+<red>+    5,</>
+<dim>   ],
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": [3, 4, 5], "b": "b"}).toMatchObject({"a": {"b": 4}}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": {\\"b\\": 4}}
+  <green>{\\"a\\": {\\"b\\": 4}}</>
 Received:
-  {\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}
+  <red>{\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": Object {
--    \\"b\\": 4,
--  },
-+  \\"a\\": Array [
-+    3,
-+    4,
-+    5,
-+  ],
- }"
+<dim> Object {
+<green>-  \\"a\\": Object {</>
+<green>-    \\"b\\": 4,</>
+<green>-  },</>
+<red>+  \\"a\\": Array [</>
+<red>+    3,</>
+<red>+    4,</>
+<red>+    5,</>
+<red>+  ],</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": [3, 4, 5], "b": "b"}).toMatchObject({"a": {"b": Any<String>}}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": {\\"b\\": Any<String>}}
+  <green>{\\"a\\": {\\"b\\": Any<String>}}</>
 Received:
-  {\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}
+  <red>{\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": Object {
--    \\"b\\": Any<String>,
--  },
-+  \\"a\\": Array [
-+    3,
-+    4,
-+    5,
-+  ],
- }"
+<dim> Object {
+<green>-  \\"a\\": Object {</>
+<green>-    \\"b\\": Any<String>,</>
+<green>-  },</>
+<red>+  \\"a\\": Array [</>
+<red>+    3,</>
+<red>+    4,</>
+<red>+    5,</>
+<red>+  ],</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": 1, "b": 1, "c": 1, "d": {"e": {"f": 555}}}).toMatchObject({"d": {"e": {"f": 222}}}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"d\\": {\\"e\\": {\\"f\\": 222}}}
+  <green>{\\"d\\": {\\"e\\": {\\"f\\": 222}}}</>
 Received:
-  {\\"a\\": 1, \\"b\\": 1, \\"c\\": 1, \\"d\\": {\\"e\\": {\\"f\\": 555}}}
+  <red>{\\"a\\": 1, \\"b\\": 1, \\"c\\": 1, \\"d\\": {\\"e\\": {\\"f\\": 555}}}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
-   \\"d\\": Object {
-     \\"e\\": Object {
--      \\"f\\": 222,
-+      \\"f\\": 555,
-     },
-   },
- }"
+<dim> Object {
+<dim>   \\"d\\": Object {
+<dim>     \\"e\\": Object {
+<green>-      \\"f\\": 222,</>
+<red>+      \\"f\\": 555,</>
+<dim>     },
+<dim>   },
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": 2015-11-30T00:00:00.000Z, "b": "b"}).toMatchObject({"a": 2015-10-10T00:00:00.000Z}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": 2015-10-10T00:00:00.000Z}
+  <green>{\\"a\\": 2015-10-10T00:00:00.000Z}</>
 Received:
-  {\\"a\\": 2015-11-30T00:00:00.000Z, \\"b\\": \\"b\\"}
+  <red>{\\"a\\": 2015-11-30T00:00:00.000Z, \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": 2015-10-10T00:00:00.000Z,
-+  \\"a\\": 2015-11-30T00:00:00.000Z,
- }"
+<dim> Object {
+<green>-  \\"a\\": 2015-10-10T00:00:00.000Z,</>
+<red>+  \\"a\\": 2015-11-30T00:00:00.000Z,</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": null, "b": "b"}).toMatchObject({"a": "4"}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": \\"4\\"}
+  <green>{\\"a\\": \\"4\\"}</>
 Received:
-  {\\"a\\": null, \\"b\\": \\"b\\"}
+  <red>{\\"a\\": null, \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": \\"4\\",
-+  \\"a\\": null,
- }"
+<dim> Object {
+<green>-  \\"a\\": \\"4\\",</>
+<red>+  \\"a\\": null,</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": null, "b": "b"}).toMatchObject({"a": undefined}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": undefined}
+  <green>{\\"a\\": undefined}</>
 Received:
-  {\\"a\\": null, \\"b\\": \\"b\\"}
+  <red>{\\"a\\": null, \\"b\\": \\"b\\"}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": undefined,
-+  \\"a\\": null,
- }"
+<dim> Object {
+<green>-  \\"a\\": undefined,</>
+<red>+  \\"a\\": null,</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({"a": undefined}).toMatchObject({"a": null}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": null}
+  <green>{\\"a\\": null}</>
 Received:
-  {\\"a\\": undefined}
+  <red>{\\"a\\": undefined}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
- Object {
--  \\"a\\": null,
-+  \\"a\\": undefined,
- }"
+<dim> Object {
+<green>-  \\"a\\": null,</>
+<red>+  \\"a\\": undefined,</>
+<dim> }"
 `;
 
 exports[`toMatchObject() {pass: false} expect({}).toMatchObject({"a": undefined}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  {\\"a\\": undefined}
+  <green>{\\"a\\": undefined}</>
 Received:
-  {}
+  <red>{}</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
--Object {
--  \\"a\\": undefined,
--}
-+Object {}"
+<green>-Object {</>
+<green>-  \\"a\\": undefined,</>
+<green>-}</>
+<red>+Object {}</>"
 `;
 
 exports[`toMatchObject() {pass: false} expect(2015-11-30T00:00:00.000Z).toMatchObject(2015-10-10T00:00:00.000Z) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  2015-10-10T00:00:00.000Z
+  <green>2015-10-10T00:00:00.000Z</>
 Received:
-  2015-11-30T00:00:00.000Z
+  <red>2015-11-30T00:00:00.000Z</>
 Difference:
-- Expected
-+ Received
+<green>- Expected</>
+<red>+ Received</>
 
--2015-10-10T00:00:00.000Z
-+2015-11-30T00:00:00.000Z"
+<green>-2015-10-10T00:00:00.000Z</>
+<red>+2015-11-30T00:00:00.000Z</>"
 `;
 
 exports[`toMatchObject() {pass: false} expect(Set {1, 2}).toMatchObject(Set {2, 1}) 1`] = `
-"expect(received).toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).toMatchObject(<green>expected</><dim>)
 
 Expected value to match object:
-  Set {2, 1}
+  <green>Set {2, 1}</>
 Received:
-  Set {1, 2}
+  <red>Set {1, 2}</>
 Difference:
-Compared values have no visual difference."
+<dim>Compared values have no visual difference."
 `;
 
 exports[`toMatchObject() {pass: true} expect([1, 2]).toMatchObject([1, 2]) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  [1, 2]
+  <green>[1, 2]</>
 Received:
-  [1, 2]"
+  <red>[1, 2]</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": "b", "c": "d"}).toMatchObject({"a": "b", "c": "d"}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": \\"b\\", \\"c\\": \\"d\\"}
+  <green>{\\"a\\": \\"b\\", \\"c\\": \\"d\\"}</>
 Received:
-  {\\"a\\": \\"b\\", \\"c\\": \\"d\\"}"
+  <red>{\\"a\\": \\"b\\", \\"c\\": \\"d\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": "b", "c": "d"}).toMatchObject({"a": "b"}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": \\"b\\"}
+  <green>{\\"a\\": \\"b\\"}</>
 Received:
-  {\\"a\\": \\"b\\", \\"c\\": \\"d\\"}"
+  <red>{\\"a\\": \\"b\\", \\"c\\": \\"d\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": "b", "t": {"x": {"r": "r"}, "z": "z"}}).toMatchObject({"a": "b", "t": {"z": "z"}}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": \\"b\\", \\"t\\": {\\"z\\": \\"z\\"}}
+  <green>{\\"a\\": \\"b\\", \\"t\\": {\\"z\\": \\"z\\"}}</>
 Received:
-  {\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}"
+  <red>{\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": "b", "t": {"x": {"r": "r"}, "z": "z"}}).toMatchObject({"t": {"x": {"r": "r"}}}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}}}
+  <green>{\\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}}}</>
 Received:
-  {\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}"
+  <red>{\\"a\\": \\"b\\", \\"t\\": {\\"x\\": {\\"r\\": \\"r\\"}, \\"z\\": \\"z\\"}}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": [{"a": "a", "b": "b"}]}).toMatchObject({"a": [{"a": "a"}]}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": [{\\"a\\": \\"a\\"}]}
+  <green>{\\"a\\": [{\\"a\\": \\"a\\"}]}</>
 Received:
-  {\\"a\\": [{\\"a\\": \\"a\\", \\"b\\": \\"b\\"}]}"
+  <red>{\\"a\\": [{\\"a\\": \\"a\\", \\"b\\": \\"b\\"}]}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": [3, 4, 5, "v"], "b": "b"}).toMatchObject({"a": [3, 4, 5, "v"]}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": [3, 4, 5, \\"v\\"]}
+  <green>{\\"a\\": [3, 4, 5, \\"v\\"]}</>
 Received:
-  {\\"a\\": [3, 4, 5, \\"v\\"], \\"b\\": \\"b\\"}"
+  <red>{\\"a\\": [3, 4, 5, \\"v\\"], \\"b\\": \\"b\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": [3, 4, 5], "b": "b"}).toMatchObject({"a": [3, 4, 5]}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": [3, 4, 5]}
+  <green>{\\"a\\": [3, 4, 5]}</>
 Received:
-  {\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}"
+  <red>{\\"a\\": [3, 4, 5], \\"b\\": \\"b\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": {"x": "x", "y": "y"}}).toMatchObject({"a": {"x": Any<String>}}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": {\\"x\\": Any<String>}}
+  <green>{\\"a\\": {\\"x\\": Any<String>}}</>
 Received:
-  {\\"a\\": {\\"x\\": \\"x\\", \\"y\\": \\"y\\"}}"
+  <red>{\\"a\\": {\\"x\\": \\"x\\", \\"y\\": \\"y\\"}}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": 1, "c": 2}).toMatchObject({"a": Any<Number>}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": Any<Number>}
+  <green>{\\"a\\": Any<Number>}</>
 Received:
-  {\\"a\\": 1, \\"c\\": 2}"
+  <red>{\\"a\\": 1, \\"c\\": 2}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": 2015-11-30T00:00:00.000Z, "b": "b"}).toMatchObject({"a": 2015-11-30T00:00:00.000Z}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": 2015-11-30T00:00:00.000Z}
+  <green>{\\"a\\": 2015-11-30T00:00:00.000Z}</>
 Received:
-  {\\"a\\": 2015-11-30T00:00:00.000Z, \\"b\\": \\"b\\"}"
+  <red>{\\"a\\": 2015-11-30T00:00:00.000Z, \\"b\\": \\"b\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": null, "b": "b"}).toMatchObject({"a": null}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": null}
+  <green>{\\"a\\": null}</>
 Received:
-  {\\"a\\": null, \\"b\\": \\"b\\"}"
+  <red>{\\"a\\": null, \\"b\\": \\"b\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": undefined, "b": "b"}).toMatchObject({"a": undefined}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": undefined}
+  <green>{\\"a\\": undefined}</>
 Received:
-  {\\"a\\": undefined, \\"b\\": \\"b\\"}"
+  <red>{\\"a\\": undefined, \\"b\\": \\"b\\"}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect({"a": undefined}).toMatchObject({"a": undefined}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  {\\"a\\": undefined}
+  <green>{\\"a\\": undefined}</>
 Received:
-  {\\"a\\": undefined}"
+  <red>{\\"a\\": undefined}</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect(2015-11-30T00:00:00.000Z).toMatchObject(2015-11-30T00:00:00.000Z) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  2015-11-30T00:00:00.000Z
+  <green>2015-11-30T00:00:00.000Z</>
 Received:
-  2015-11-30T00:00:00.000Z"
+  <red>2015-11-30T00:00:00.000Z</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect(Array []).toMatchObject(Array []) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  Array []
+  <green>Array []</>
 Received:
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`toMatchObject() {pass: true} expect(Set {1, 2}).toMatchObject(Set {1, 2}) 1`] = `
-"expect(received).not.toMatchObject(expected)
+"<dim>expect(<red>received</><dim>).not.toMatchObject(<green>expected</><dim>)
 
 Expected value not to match object:
-  Set {1, 2}
+  <green>Set {1, 2}</>
 Received:
-  Set {1, 2}"
+  <red>Set {1, 2}</>"
 `;
 
 exports[`toMatchObject() throws expect("44").toMatchObject({}) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-received value must be an object.
+<red>received</> value must be an object.
 Received:
-  string: \\"44\\""
+  string: <red>\\"44\\"</>"
 `;
 
 exports[`toMatchObject() throws expect({}).toMatchObject("some string") 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-expected value must be an object.
+<green>expected</> value must be an object.
 Expected:
-  string: \\"some string\\""
+  string: <green>\\"some string\\"</>"
 `;
 
 exports[`toMatchObject() throws expect({}).toMatchObject(4) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-expected value must be an object.
+<green>expected</> value must be an object.
 Expected:
-  number: 4"
+  number: <green>4</>"
 `;
 
 exports[`toMatchObject() throws expect({}).toMatchObject(null) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-expected value must be an object.
-Expected: null"
+<green>expected</> value must be an object.
+Expected: <green>null</>"
 `;
 
 exports[`toMatchObject() throws expect({}).toMatchObject(true) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-expected value must be an object.
+<green>expected</> value must be an object.
 Expected:
-  boolean: true"
+  boolean: <green>true</>"
 `;
 
 exports[`toMatchObject() throws expect({}).toMatchObject(undefined) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-expected value must be an object.
-Expected: undefined"
+<green>expected</> value must be an object.
+Expected: <green>undefined</>"
 `;
 
 exports[`toMatchObject() throws expect(4).toMatchObject({}) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-received value must be an object.
+<red>received</> value must be an object.
 Received:
-  number: 4"
+  number: <red>4</>"
 `;
 
 exports[`toMatchObject() throws expect(null).toMatchObject({}) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-received value must be an object.
-Received: null"
+<red>received</> value must be an object.
+Received: <red>null</>"
 `;
 
 exports[`toMatchObject() throws expect(true).toMatchObject({}) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-received value must be an object.
+<red>received</> value must be an object.
 Received:
-  boolean: true"
+  boolean: <red>true</>"
 `;
 
 exports[`toMatchObject() throws expect(undefined).toMatchObject({}) 1`] = `
-"expect(object)[.not].toMatchObject(expected)
+"<dim>expect(<red>object</><dim>)[.not].toMatchObject(<green>expected</><dim>)
 
-received value must be an object.
-Received: undefined"
+<red>received</> value must be an object.
+Received: <red>undefined</>"
 `;
diff --git a/packages/jest-matchers/src/__tests__/__snapshots__/spyMatchers-test.js.snap b/packages/jest-matchers/src/__tests__/__snapshots__/spyMatchers-test.js.snap
index 6475dd88a6a6..4a246ee70a63 100644
--- a/packages/jest-matchers/src/__tests__/__snapshots__/spyMatchers-test.js.snap
+++ b/packages/jest-matchers/src/__tests__/__snapshots__/spyMatchers-test.js.snap
@@ -1,450 +1,450 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`lastCalledWith works only on spies or jest.fn 1`] = `
-"expect(jest.fn())[.not].lastCalledWith()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].lastCalledWith(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`lastCalledWith works with jest.fn and arguments that don't match 1`] = `
-"expect(jest.fn()).lastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).lastCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been last called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was last called with:
-  [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`lastCalledWith works with jest.fn and arguments that match 1`] = `
-"expect(jest.fn()).not.lastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.lastCalledWith(<green>expected</><dim>)
 
 Expected mock function to not have been last called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`lastCalledWith works with jest.fn and many arguments 1`] = `
-"expect(jest.fn()).not.lastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.lastCalledWith(<green>expected</><dim>)
 
 Expected mock function to not have been last called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`lastCalledWith works with jest.fn and many arguments that don't match 1`] = `
-"expect(jest.fn()).lastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).lastCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been last called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was last called with:
-  [\\"foo\\", \\"bar3\\"]
-and two more calls."
+  <red>[\\"foo\\", \\"bar3\\"]</>
+and <red>two more calls</>."
 `;
 
 exports[`lastCalledWith works with jest.fn when not called 1`] = `
-"expect(jest.fn()).lastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).lastCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been last called with:
-  [\\"foo\\", \\"bar\\"]
-But it was not called."
+  <green>[\\"foo\\", \\"bar\\"]</>
+But it was <red>not called</>."
 `;
 
 exports[`toBeCalled works only on spies or jest.fn 1`] = `
-"expect(jest.fn())[.not].toBeCalled()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].toBeCalled(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`toBeCalled works with jasmine.createSpy 1`] = `
-"expect(spy).toBeCalled()
+"<dim>expect(<red>spy</><dim>).toBeCalled(<dim>)
 
 Expected spy to have been called."
 `;
 
 exports[`toBeCalled works with jasmine.createSpy 2`] = `
-"expect(spy).not.toBeCalled()
+"<dim>expect(<red>spy</><dim>).not.toBeCalled(<dim>)
 
 Expected spy not to be called but it was called with:
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`toBeCalled works with jasmine.createSpy 3`] = `
-"expect(received)[.not].toBeCalled()
+"<dim>expect(<red>received</><dim>)[.not].toBeCalled(<dim>)
 
 Matcher does not accept any arguments.
 Got:
-  number: 555"
+  number: <green>555</>"
 `;
 
 exports[`toBeCalled works with jest.fn 1`] = `
-"expect(jest.fn()).toBeCalled()
+"<dim>expect(<red>jest.fn()</><dim>).toBeCalled(<dim>)
 
 Expected mock function to have been called."
 `;
 
 exports[`toBeCalled works with jest.fn 2`] = `
-"expect(jest.fn()).not.toBeCalled()
+"<dim>expect(<red>jest.fn()</><dim>).not.toBeCalled(<dim>)
 
 Expected mock function not to be called but it was called with:
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`toBeCalled works with jest.fn 3`] = `
-"expect(received)[.not].toBeCalled()
+"<dim>expect(<red>received</><dim>)[.not].toBeCalled(<dim>)
 
 Matcher does not accept any arguments.
 Got:
-  number: 555"
+  number: <green>555</>"
 `;
 
 exports[`toBeCalledWith works only on spies or jest.fn 1`] = `
-"expect(jest.fn())[.not].toBeCalledWith()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].toBeCalledWith(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`toBeCalledWith works with jest.fn and arguments that don't match 1`] = `
-"expect(jest.fn()).toBeCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toBeCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was called with:
-  [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toBeCalledWith works with jest.fn and arguments that match 1`] = `
-"expect(jest.fn()).not.toBeCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.toBeCalledWith(<green>expected</><dim>)
 
 Expected mock function not to have been called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toBeCalledWith works with jest.fn and many arguments 1`] = `
-"expect(jest.fn()).not.toBeCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.toBeCalledWith(<green>expected</><dim>)
 
 Expected mock function not to have been called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toBeCalledWith works with jest.fn and many arguments that don't match 1`] = `
-"expect(jest.fn()).toBeCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toBeCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was called with:
-  [\\"foo\\", \\"bar3\\"], [\\"foo\\", \\"bar2\\"], [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar3\\"]</>, <red>[\\"foo\\", \\"bar2\\"]</>, <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toBeCalledWith works with jest.fn when not called 1`] = `
-"expect(jest.fn()).toBeCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toBeCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been called with:
-  [\\"foo\\", \\"bar\\"]
-But it was not called."
+  <green>[\\"foo\\", \\"bar\\"]</>
+But it was <red>not called</>."
 `;
 
 exports[`toHaveBeenCalled works only on spies or jest.fn 1`] = `
-"expect(jest.fn())[.not].toHaveBeenCalled()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].toHaveBeenCalled(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`toHaveBeenCalled works with jasmine.createSpy 1`] = `
-"expect(spy).toHaveBeenCalled()
+"<dim>expect(<red>spy</><dim>).toHaveBeenCalled(<dim>)
 
 Expected spy to have been called."
 `;
 
 exports[`toHaveBeenCalled works with jasmine.createSpy 2`] = `
-"expect(spy).not.toHaveBeenCalled()
+"<dim>expect(<red>spy</><dim>).not.toHaveBeenCalled(<dim>)
 
 Expected spy not to be called but it was called with:
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`toHaveBeenCalled works with jasmine.createSpy 3`] = `
-"expect(received)[.not].toHaveBeenCalled()
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalled(<dim>)
 
 Matcher does not accept any arguments.
 Got:
-  number: 555"
+  number: <green>555</>"
 `;
 
 exports[`toHaveBeenCalled works with jest.fn 1`] = `
-"expect(jest.fn()).toHaveBeenCalled()
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenCalled(<dim>)
 
 Expected mock function to have been called."
 `;
 
 exports[`toHaveBeenCalled works with jest.fn 2`] = `
-"expect(jest.fn()).not.toHaveBeenCalled()
+"<dim>expect(<red>jest.fn()</><dim>).not.toHaveBeenCalled(<dim>)
 
 Expected mock function not to be called but it was called with:
-  Array []"
+  <red>Array []</>"
 `;
 
 exports[`toHaveBeenCalled works with jest.fn 3`] = `
-"expect(received)[.not].toHaveBeenCalled()
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalled(<dim>)
 
 Matcher does not accept any arguments.
 Got:
-  number: 555"
+  number: <green>555</>"
 `;
 
 exports[`toHaveBeenCalledTimes accepts only numbers 1`] = `
-"expect(received)[.not].toHaveBeenCalledTimes(expected)
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalledTimes(<green>expected</><dim>)
 
 Expected value must be a number.
 Got:
-  object: {}"
+  object: <green>{}</>"
 `;
 
 exports[`toHaveBeenCalledTimes accepts only numbers 2`] = `
-"expect(received)[.not].toHaveBeenCalledTimes(expected)
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalledTimes(<green>expected</><dim>)
 
 Expected value must be a number.
 Got:
-  array: Array []"
+  array: <green>Array []</>"
 `;
 
 exports[`toHaveBeenCalledTimes accepts only numbers 3`] = `
-"expect(received)[.not].toHaveBeenCalledTimes(expected)
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalledTimes(<green>expected</><dim>)
 
 Expected value must be a number.
 Got:
-  boolean: true"
+  boolean: <green>true</>"
 `;
 
 exports[`toHaveBeenCalledTimes accepts only numbers 4`] = `
-"expect(received)[.not].toHaveBeenCalledTimes(expected)
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalledTimes(<green>expected</><dim>)
 
 Expected value must be a number.
 Got:
-  string: \\"a\\""
+  string: <green>\\"a\\"</>"
 `;
 
 exports[`toHaveBeenCalledTimes accepts only numbers 5`] = `
-"expect(received)[.not].toHaveBeenCalledTimes(expected)
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalledTimes(<green>expected</><dim>)
 
 Expected value must be a number.
 Got:
-  map: Map {}"
+  map: <green>Map {}</>"
 `;
 
 exports[`toHaveBeenCalledTimes accepts only numbers 6`] = `
-"expect(received)[.not].toHaveBeenCalledTimes(expected)
+"<dim>expect(<red>received</><dim>)[.not].toHaveBeenCalledTimes(<green>expected</><dim>)
 
 Expected value must be a number.
 Got:
-  function: [Function anonymous]"
+  function: <green>[Function anonymous]</>"
 `;
 
 exports[`toHaveBeenCalledTimes fails if function called less than expected times 1`] = `
-"expect(spy).toHaveBeenCalledTimes(2)
+"<dim>expect(<red>spy</><dim>).toHaveBeenCalledTimes(<green>2</><dim>)
 
-Expected spy to have been called two times, but it was called one time."
+Expected spy to have been called <green>two times</>, but it was called <red>one time</>."
 `;
 
 exports[`toHaveBeenCalledTimes fails if function called more than expected times 1`] = `
-"expect(spy).toHaveBeenCalledTimes(2)
+"<dim>expect(<red>spy</><dim>).toHaveBeenCalledTimes(<green>2</><dim>)
 
-Expected spy to have been called two times, but it was called three times."
+Expected spy to have been called <green>two times</>, but it was called <red>three times</>."
 `;
 
 exports[`toHaveBeenCalledTimes passes if function called equal to expected times 1`] = `
-"expect(spy).not.toHaveBeenCalledTimes(2)
+"<dim>expect(<red>spy</><dim>).not.toHaveBeenCalledTimes(<green>2</><dim>)
 
-Expected spy not to be called two times, but it was called exactly two times."
+Expected spy not to be called <green>two times</>, but it was called exactly <red>two times</>."
 `;
 
 exports[`toHaveBeenCalledTimes verifies that actual is a Spy 1`] = `
-"expect(jest.fn())[.not].toHaveBeenCalledTimes()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].toHaveBeenCalledTimes(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`toHaveBeenCalledWith works only on spies or jest.fn 1`] = `
-"expect(jest.fn())[.not].toHaveBeenCalledWith()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].toHaveBeenCalledWith(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jasmine.createSpy and arguments that don't match 1`] = `
-"expect(spy).toHaveBeenCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected spy to have been called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was called with:
-  [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jasmine.createSpy and arguments that match 1`] = `
-"expect(spy).not.toHaveBeenCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).not.toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected spy not to have been called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jasmine.createSpy and many arguments 1`] = `
-"expect(spy).not.toHaveBeenCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).not.toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected spy not to have been called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jasmine.createSpy and many arguments that don't match 1`] = `
-"expect(spy).toHaveBeenCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected spy to have been called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was called with:
-  [\\"foo\\", \\"bar3\\"], [\\"foo\\", \\"bar2\\"], [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar3\\"]</>, <red>[\\"foo\\", \\"bar2\\"]</>, <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jasmine.createSpy when not called 1`] = `
-"expect(spy).toHaveBeenCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected spy to have been called with:
-  [\\"foo\\", \\"bar\\"]
-But it was not called."
+  <green>[\\"foo\\", \\"bar\\"]</>
+But it was <red>not called</>."
 `;
 
 exports[`toHaveBeenCalledWith works with jest.fn and arguments that don't match 1`] = `
-"expect(jest.fn()).toHaveBeenCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was called with:
-  [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jest.fn and arguments that match 1`] = `
-"expect(jest.fn()).not.toHaveBeenCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected mock function not to have been called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jest.fn and many arguments 1`] = `
-"expect(jest.fn()).not.toHaveBeenCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected mock function not to have been called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jest.fn and many arguments that don't match 1`] = `
-"expect(jest.fn()).toHaveBeenCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was called with:
-  [\\"foo\\", \\"bar3\\"], [\\"foo\\", \\"bar2\\"], [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar3\\"]</>, <red>[\\"foo\\", \\"bar2\\"]</>, <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toHaveBeenCalledWith works with jest.fn when not called 1`] = `
-"expect(jest.fn()).toHaveBeenCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been called with:
-  [\\"foo\\", \\"bar\\"]
-But it was not called."
+  <green>[\\"foo\\", \\"bar\\"]</>
+But it was <red>not called</>."
 `;
 
 exports[`toHaveBeenLastCalledWith works only on spies or jest.fn 1`] = `
-"expect(jest.fn())[.not].toHaveBeenLastCalledWith()
+"<dim>expect(<red>jest.fn()</><dim>)[.not].toHaveBeenLastCalledWith(<dim>)
 
-jest.fn() value must be a mock function or spy.
+<red>jest.fn()</> value must be a mock function or spy.
 Received:
-  function: [Function fn]"
+  function: <red>[Function fn]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jasmine.createSpy and arguments that don't match 1`] = `
-"expect(spy).toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected spy to have been last called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was last called with:
-  [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jasmine.createSpy and arguments that match 1`] = `
-"expect(spy).not.toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).not.toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected spy to not have been last called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jasmine.createSpy and many arguments 1`] = `
-"expect(spy).not.toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).not.toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected spy to not have been last called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jasmine.createSpy and many arguments that don't match 1`] = `
-"expect(spy).toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected spy to have been last called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was last called with:
-  [\\"foo\\", \\"bar3\\"]
-and two more calls."
+  <red>[\\"foo\\", \\"bar3\\"]</>
+and <red>two more calls</>."
 `;
 
 exports[`toHaveBeenLastCalledWith works with jasmine.createSpy when not called 1`] = `
-"expect(spy).toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>spy</><dim>).toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected spy to have been last called with:
-  [\\"foo\\", \\"bar\\"]
-But it was not called."
+  <green>[\\"foo\\", \\"bar\\"]</>
+But it was <red>not called</>."
 `;
 
 exports[`toHaveBeenLastCalledWith works with jest.fn and arguments that don't match 1`] = `
-"expect(jest.fn()).toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been last called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was last called with:
-  [\\"foo\\", \\"bar1\\"]"
+  <red>[\\"foo\\", \\"bar1\\"]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jest.fn and arguments that match 1`] = `
-"expect(jest.fn()).not.toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected mock function to not have been last called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jest.fn and many arguments 1`] = `
-"expect(jest.fn()).not.toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).not.toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected mock function to not have been last called with:
-  [\\"foo\\", \\"bar\\"]"
+  <green>[\\"foo\\", \\"bar\\"]</>"
 `;
 
 exports[`toHaveBeenLastCalledWith works with jest.fn and many arguments that don't match 1`] = `
-"expect(jest.fn()).toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been last called with:
-  [\\"foo\\", \\"bar\\"]
+  <green>[\\"foo\\", \\"bar\\"]</>
 But it was last called with:
-  [\\"foo\\", \\"bar3\\"]
-and two more calls."
+  <red>[\\"foo\\", \\"bar3\\"]</>
+and <red>two more calls</>."
 `;
 
 exports[`toHaveBeenLastCalledWith works with jest.fn when not called 1`] = `
-"expect(jest.fn()).toHaveBeenLastCalledWith(expected)
+"<dim>expect(<red>jest.fn()</><dim>).toHaveBeenLastCalledWith(<green>expected</><dim>)
 
 Expected mock function to have been last called with:
-  [\\"foo\\", \\"bar\\"]
-But it was not called."
+  <green>[\\"foo\\", \\"bar\\"]</>
+But it was <red>not called</>."
 `;
diff --git a/packages/jest-matchers/src/__tests__/__snapshots__/toThrowMatchers-test.js.snap b/packages/jest-matchers/src/__tests__/__snapshots__/toThrowMatchers-test.js.snap
index 3983a568f6c8..cbd85675d904 100644
--- a/packages/jest-matchers/src/__tests__/__snapshots__/toThrowMatchers-test.js.snap
+++ b/packages/jest-matchers/src/__tests__/__snapshots__/toThrowMatchers-test.js.snap
@@ -1,199 +1,199 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`.toThrow() error class did not throw at all 1`] = `
-"expect(function).toThrow(type)
+"<dim>expect(<red>function</><dim>).toThrow(<green>type</><dim>)
 
 Expected the function to throw an error of type:
-  \\"Err\\"
+  <green>\\"Err\\"</>
 But it didn't throw anything."
 `;
 
 exports[`.toThrow() error class threw, but class did not match 1`] = `
-"expect(function).toThrow(type)
+"<dim>expect(<red>function</><dim>).toThrow(<green>type</><dim>)
 
 Expected the function to throw an error of type:
-  \\"Err2\\"
+  <green>\\"Err2\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrow() error class threw, but should not have 1`] = `
-"expect(function).not.toThrow(type)
+"<dim>expect(<red>function</><dim>).not.toThrow(<green>type</><dim>)
 
 Expected the function not to throw an error of type:
-  \\"Err\\"
+  <green>\\"Err\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrow() invalid actual 1`] = `
-"expect(function).toThrow(undefined)
+"<dim>expect(<red>function</><dim>).toThrow(<green>undefined</><dim>)
 
 Received value must be a function, but instead \\"string\\" was found"
 `;
 
 exports[`.toThrow() invalid arguments 1`] = `
-"expect(function).not.toThrow(number)
+"<dim>expect(<red>function</><dim>).not.toThrow(<green>number</><dim>)
 
 Unexpected argument passed.
-Expected: \\"string\\", \\"Error (type)\\" or \\"regexp\\".
+Expected: <green>\\"string\\"</>, <green>\\"Error (type)\\"</> or <green>\\"regexp\\"</>.
 Got:
-  string: \\"111\\""
+  string: <green>\\"111\\"</>"
 `;
 
 exports[`.toThrow() regexp did not throw at all 1`] = `
-"expect(function).toThrow(regexp)
+"<dim>expect(<red>function</><dim>).toThrow(<green>regexp</><dim>)
 
 Expected the function to throw an error matching:
-  /apple/
+  <green>/apple/</>
 But it didn't throw anything."
 `;
 
 exports[`.toThrow() regexp threw, but message did not match 1`] = `
-"expect(function).toThrow(regexp)
+"<dim>expect(<red>function</><dim>).toThrow(<green>regexp</><dim>)
 
 Expected the function to throw an error matching:
-  /banana/
+  <green>/banana/</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrow() regexp threw, but should not have 1`] = `
-"expect(function).not.toThrow(regexp)
+"<dim>expect(<red>function</><dim>).not.toThrow(<green>regexp</><dim>)
 
 Expected the function not to throw an error matching:
-  /apple/
+  <green>/apple/</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrow() strings did not throw at all 1`] = `
-"expect(function).toThrow(string)
+"<dim>expect(<red>function</><dim>).toThrow(<green>string</><dim>)
 
 Expected the function to throw an error matching:
-  \\"apple\\"
+  <green>\\"apple\\"</>
 But it didn't throw anything."
 `;
 
 exports[`.toThrow() strings threw, but message did not match 1`] = `
-"expect(function).toThrow(string)
+"<dim>expect(<red>function</><dim>).toThrow(<green>string</><dim>)
 
 Expected the function to throw an error matching:
-  \\"banana\\"
+  <green>\\"banana\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrow() strings threw, but should not have 1`] = `
-"expect(function).not.toThrow(string)
+"<dim>expect(<red>function</><dim>).not.toThrow(<green>string</><dim>)
 
 Expected the function not to throw an error matching:
-  \\"apple\\"
+  <green>\\"apple\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrowError() error class did not throw at all 1`] = `
-"expect(function).toThrowError(type)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>type</><dim>)
 
 Expected the function to throw an error of type:
-  \\"Err\\"
+  <green>\\"Err\\"</>
 But it didn't throw anything."
 `;
 
 exports[`.toThrowError() error class threw, but class did not match 1`] = `
-"expect(function).toThrowError(type)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>type</><dim>)
 
 Expected the function to throw an error of type:
-  \\"Err2\\"
+  <green>\\"Err2\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrowError() error class threw, but should not have 1`] = `
-"expect(function).not.toThrowError(type)
+"<dim>expect(<red>function</><dim>).not.toThrowError(<green>type</><dim>)
 
 Expected the function not to throw an error of type:
-  \\"Err\\"
+  <green>\\"Err\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrowError() invalid actual 1`] = `
-"expect(function).toThrowError(undefined)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>undefined</><dim>)
 
 Received value must be a function, but instead \\"string\\" was found"
 `;
 
 exports[`.toThrowError() invalid arguments 1`] = `
-"expect(function).not.toThrowError(number)
+"<dim>expect(<red>function</><dim>).not.toThrowError(<green>number</><dim>)
 
 Unexpected argument passed.
-Expected: \\"string\\", \\"Error (type)\\" or \\"regexp\\".
+Expected: <green>\\"string\\"</>, <green>\\"Error (type)\\"</> or <green>\\"regexp\\"</>.
 Got:
-  string: \\"111\\""
+  string: <green>\\"111\\"</>"
 `;
 
 exports[`.toThrowError() regexp did not throw at all 1`] = `
-"expect(function).toThrowError(regexp)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>regexp</><dim>)
 
 Expected the function to throw an error matching:
-  /apple/
+  <green>/apple/</>
 But it didn't throw anything."
 `;
 
 exports[`.toThrowError() regexp threw, but message did not match 1`] = `
-"expect(function).toThrowError(regexp)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>regexp</><dim>)
 
 Expected the function to throw an error matching:
-  /banana/
+  <green>/banana/</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrowError() regexp threw, but should not have 1`] = `
-"expect(function).not.toThrowError(regexp)
+"<dim>expect(<red>function</><dim>).not.toThrowError(<green>regexp</><dim>)
 
 Expected the function not to throw an error matching:
-  /apple/
+  <green>/apple/</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrowError() strings did not throw at all 1`] = `
-"expect(function).toThrowError(string)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>string</><dim>)
 
 Expected the function to throw an error matching:
-  \\"apple\\"
+  <green>\\"apple\\"</>
 But it didn't throw anything."
 `;
 
 exports[`.toThrowError() strings threw, but message did not match 1`] = `
-"expect(function).toThrowError(string)
+"<dim>expect(<red>function</><dim>).toThrowError(<green>string</><dim>)
 
 Expected the function to throw an error matching:
-  \\"banana\\"
+  <green>\\"banana\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
 
 exports[`.toThrowError() strings threw, but should not have 1`] = `
-"expect(function).not.toThrowError(string)
+"<dim>expect(<red>function</><dim>).not.toThrowError(<green>string</><dim>)
 
 Expected the function not to throw an error matching:
-  \\"apple\\"
+  <green>\\"apple\\"</>
 Instead, it threw:
-  Error      
-      at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js:24:74)"
+<red>  Error      
+      <dim>at jestExpect (packages/jest-matchers/src/__tests__/toThrowMatchers-test.js<dim>:24:74)</>"
 `;
diff --git a/packages/jest-message-util/src/__tests__/__snapshots__/messages-test.js.snap b/packages/jest-message-util/src/__tests__/__snapshots__/messages-test.js.snap
index 4b52c8f96e50..38dd178ac343 100644
--- a/packages/jest-message-util/src/__tests__/__snapshots__/messages-test.js.snap
+++ b/packages/jest-message-util/src/__tests__/__snapshots__/messages-test.js.snap
@@ -1,11 +1,11 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`should exclude jasmine from stack trace for windows paths 1`] = `
-"  ● windows test
+"<bold><red>  <bold>● <bold>windows test</>
 
       at stack (..\\\\jest-jasmine2\\\\vendor\\\\jasmine-2.4.1.js:1580:17)
-      
-      at Object.addResult (..\\\\jest-jasmine2\\\\vendor\\\\jasmine-2.4.1.js:1550:14)
-      at Object.it (build\\\\__tests__\\\\messages-test.js:45:41)
+<dim>      
+      <dim>at Object.addResult (<dim>..\\\\jest-jasmine2\\\\vendor\\\\jasmine-2.4.1.js<dim>:1550:14)<dim>
+      <dim>at Object.it (<dim>build\\\\__tests__\\\\messages-test.js<dim>:45:41)<dim>
 "
 `;
diff --git a/packages/jest-util/src/__tests__/__snapshots__/validateCLIOptions-test.js.snap b/packages/jest-util/src/__tests__/__snapshots__/validateCLIOptions-test.js.snap
index fc92881b4bc8..330d911592c5 100644
--- a/packages/jest-util/src/__tests__/__snapshots__/validateCLIOptions-test.js.snap
+++ b/packages/jest-util/src/__tests__/__snapshots__/validateCLIOptions-test.js.snap
@@ -1,22 +1,22 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`fails for multiple unknown options 1`] = `
-"● Unrecognized CLI Parameters:
+"<red><bold><bold>●<bold> Unrecognized CLI Parameters:
 
   Following options were not recognized:
-  [\\"jest\\", \\"test\\"]
+  <bold>[\\"jest\\", \\"test\\"]
 
-  CLI Options Documentation:
+  <bold>CLI Options Documentation:
   http://facebook.github.io/jest/docs/cli.html
-"
+</>"
 `;
 
 exports[`fails for unknown option 1`] = `
-"● Unrecognized CLI Parameter:
+"<red><bold><bold>●<bold> Unrecognized CLI Parameter:
 
-  Unrecognized option \\"unknown\\".
+  Unrecognized option <bold>\\"unknown\\".
 
-  CLI Options Documentation:
+  <bold>CLI Options Documentation:
   http://facebook.github.io/jest/docs/cli.html
-"
+</>"
 `;
diff --git a/packages/jest-validate/src/__tests__/__snapshots__/validate-test.js.snap b/packages/jest-validate/src/__tests__/__snapshots__/validate-test.js.snap
index 21bc4c709443..bbc81ae2e598 100644
--- a/packages/jest-validate/src/__tests__/__snapshots__/validate-test.js.snap
+++ b/packages/jest-validate/src/__tests__/__snapshots__/validate-test.js.snap
@@ -1,138 +1,138 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`displays warning for deprecated config options 1`] = `
-"● Deprecation Warning:
+"<bold><bold>●<bold> Deprecation Warning:
 
-  Option scriptPreprocessor was replaced by transform, which support multiple preprocessors.
+  Option <bold>scriptPreprocessor was replaced by <bold>transform, which support multiple preprocessors.
 
   Jest now treats your current configuration as:
   {
-    \\"transform\\": {\\".*\\": \\"test\\"}
+    <bold>\\"transform\\": <bold>{\\".*\\": \\"test\\"}
   }
 
   Please update your configuration.
-"
+</>"
 `;
 
 exports[`displays warning for unknown config options 1`] = `
-"● Validation Warning:
+"<bold><bold>●<bold> Validation Warning:
 
-  Unknown option \\"unkwon\\" with value {} was found. Did you mean \\"unknown\\"?
+  Unknown option <bold>\\"unkwon\\" with value <bold>{} was found. Did you mean <bold>\\"unknown\\"?
   This is probably a typing mistake. Fixing it will remove this message.
-"
+</>"
 `;
 
 exports[`pretty prints valid config for Array 1`] = `
-"● Validation Error:
+"<red><bold><bold>●<bold> Validation Error:
 
-  Option \\"coverageReporters\\" must be of type:
-    array
+  Option <bold>\\"coverageReporters\\" must be of type:
+    <bold><green>array<red>
   but instead received:
-    object
+    <bold><red>object<red>
 
   Example:
   {
-    \\"coverageReporters\\": [\\"json\\", \\"text\\", \\"lcov\\", \\"clover\\"]
+    <bold>\\"coverageReporters\\": <bold>[\\"json\\", \\"text\\", \\"lcov\\", \\"clover\\"]
   }
-"
+</>"
 `;
 
 exports[`pretty prints valid config for Boolean 1`] = `
-"● Validation Error:
+"<red><bold><bold>●<bold> Validation Error:
 
-  Option \\"automock\\" must be of type:
-    boolean
+  Option <bold>\\"automock\\" must be of type:
+    <bold><green>boolean<red>
   but instead received:
-    array
+    <bold><red>array<red>
 
   Example:
   {
-    \\"automock\\": false
+    <bold>\\"automock\\": <bold>false
   }
-"
+</>"
 `;
 
 exports[`pretty prints valid config for Function 1`] = `
-"● Validation Error:
+"<red><bold><bold>●<bold> Validation Error:
 
-  Option \\"fn\\" must be of type:
-    function
+  Option <bold>\\"fn\\" must be of type:
+    <bold><green>function<red>
   but instead received:
-    string
+    <bold><red>string<red>
 
   Example:
   {
-    \\"fn\\": (config, option, deprecatedOptions) => true
+    <bold>\\"fn\\": <bold>(config, option, deprecatedOptions) => true
   }
-"
+</>"
 `;
 
 exports[`pretty prints valid config for Object 1`] = `
-"● Validation Error:
+"<red><bold><bold>●<bold> Validation Error:
 
-  Option \\"haste\\" must be of type:
-    object
+  Option <bold>\\"haste\\" must be of type:
+    <bold><green>object<red>
   but instead received:
-    number
+    <bold><red>number<red>
 
   Example:
   {
-    \\"haste\\": {\\"providesModuleNodeModules\\": [\\"react\\", \\"react-native\\"]}
+    <bold>\\"haste\\": <bold>{\\"providesModuleNodeModules\\": [\\"react\\", \\"react-native\\"]}
   }
-"
+</>"
 `;
 
 exports[`pretty prints valid config for String 1`] = `
-"● Validation Error:
+"<red><bold><bold>●<bold> Validation Error:
 
-  Option \\"preset\\" must be of type:
-    string
+  Option <bold>\\"preset\\" must be of type:
+    <bold><green>string<red>
   but instead received:
-    number
+    <bold><red>number<red>
 
   Example:
   {
-    \\"preset\\": \\"react-native\\"
+    <bold>\\"preset\\": <bold>\\"react-native\\"
   }
-"
+</>"
 `;
 
 exports[`works with custom deprecations 1`] = `
-"My Custom Deprecation Warning:
+"<bold>My Custom Deprecation Warning:
 
-  Option scriptPreprocessor was replaced by transform, which support multiple preprocessors.
+  Option <bold>scriptPreprocessor was replaced by <bold>transform, which support multiple preprocessors.
 
   Jest now treats your current configuration as:
   {
-    \\"transform\\": {\\".*\\": \\"test\\"}
+    <bold>\\"transform\\": <bold>{\\".*\\": \\"test\\"}
   }
 
   Please update your configuration.
 
-My custom comment"
+My custom comment</>"
 `;
 
 exports[`works with custom errors 1`] = `
-"My Custom Error:
+"<red><bold>My Custom Error:
 
-  Option \\"test\\" must be of type:
-    array
+  Option <bold>\\"test\\" must be of type:
+    <bold><green>array<red>
   but instead received:
-    string
+    <bold><red>string<red>
 
   Example:
   {
-    \\"test\\": [1, 2]
+    <bold>\\"test\\": <bold>[1, 2]
   }
 
-My custom comment"
+My custom comment</>"
 `;
 
 exports[`works with custom warnings 1`] = `
-"My Custom Warning:
+"<bold>My Custom Warning:
 
-  Unknown option \\"unknown\\" with value \\"string\\" was found.
+  Unknown option <bold>\\"unknown\\" with value <bold>\\"string\\" was found.
   This is probably a typing mistake. Fixing it will remove this message.
 
-My custom comment"
+My custom comment</>"
 `;
diff --git a/packages/pretty-format/src/__tests__/__snapshots__/pretty-format-test.js.snap b/packages/pretty-format/src/__tests__/__snapshots__/pretty-format-test.js.snap
index c932066b843e..7eb2508229e5 100644
--- a/packages/pretty-format/src/__tests__/__snapshots__/pretty-format-test.js.snap
+++ b/packages/pretty-format/src/__tests__/__snapshots__/pretty-format-test.js.snap
@@ -1,43 +1,43 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
 exports[`prettyFormat() ReactTestComponent and ReactElement plugins ReactElement plugin highlights syntax 1`] = `
-"<Mouse
-  prop={
-    <div>
-      mouse
-      <span>
-        rat
-      </span>
-    </div>
-  }
-/>"
+"<Mouse</>
+  prop</>=<green>{
+    <div</>></>
+      </>mouse</>
+      <span</>></>
+        </>rat</>
+      </span></>
+    </div></>
+  }</>
+/></>"
 `;
 
 exports[`prettyFormat() ReactTestComponent and ReactElement plugins ReactElement plugin highlights syntax with color from theme option 1`] = `
-"<Mouse
-  style=\\"color:red\\"
->
-  Hello, Mouse!
-</Mouse>"
+"<Mouse</>
+  style</>=<red>\\"color:red\\"</>
+></>
+  </>Hello, Mouse!</>
+</Mouse></>"
 `;
 
 exports[`prettyFormat() ReactTestComponent and ReactElement plugins ReactTestComponent plugin highlights syntax 1`] = `
-"<Mouse
-  prop={
-    <div>
-      mouse
-      <span>
-        rat
-      </span>
-    </div>
-  }
-/>"
+"<Mouse</>
+  prop</>=<green>{
+    <div</>></>
+      </>mouse</>
+      <span</>></>
+        </>rat</>
+      </span></>
+    </div></>
+  }</>
+/></>"
 `;
 
 exports[`prettyFormat() ReactTestComponent and ReactElement plugins ReactTestComponent plugin highlights syntax with color from theme option 1`] = `
-"<Mouse
-  style=\\"color:red\\"
->
-  Hello, Mouse!
-</Mouse>"
+"<Mouse</>
+  style</>=<red>\\"color:red\\"</>
+></>
+  </>Hello, Mouse!</>
+</Mouse></>"
 `;
diff --git a/packages/pretty-format/src/plugins/ConvertAnsi.js b/packages/pretty-format/src/plugins/ConvertAnsi.js
new file mode 100644
index 000000000000..ab7cc144e3f5
--- /dev/null
+++ b/packages/pretty-format/src/plugins/ConvertAnsi.js
@@ -0,0 +1,51 @@
+/**
+ * Copyright (c) 2014-present, Facebook, Inc. All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @flow
+ */
+
+'use strict';
+
+import type {Colors, Indent, Options, Print, Plugin} from '../types.js';
+
+const ansiRegex = require('ansi-regex');
+
+const toHumanReadableAnsi = text => {
+  const style = require('ansi-styles');
+  return text.replace(ansiRegex(), (match, offset, string) => {
+    switch (match) {
+      case style.red.close:
+      case style.green.close:
+      case style.reset.open:
+      case style.reset.close:
+        return '</>';
+      case style.red.open:
+        return '<red>';
+      case style.green.open:
+        return '<green>';
+      case style.dim.open:
+        return '<dim>';
+      case style.bold.open:
+        return '<bold>';
+      default:
+        return '';
+    }
+  });
+};
+
+const test = (value: any) =>
+  typeof value === 'string' && value.match(ansiRegex());
+
+const print = (
+  val: any,
+  print: Print,
+  indent: Indent,
+  opts: Options,
+  colors: Colors,
+) => print(toHumanReadableAnsi(val));
+
+module.exports = ({print, test}: Plugin);