Make frame location color dimmer

Author: victorandcode

package.json

@@ -42,6 +42,7 @@
     "@babel/runtime": "^7.10.3",
     "@types/aria-query": "^4.2.0",
     "aria-query": "^4.2.2",
+    "chalk": "^4.1.0",
     "dom-accessibility-api": "^0.5.0",
     "pretty-format": "^25.5.0"
   },

src/get-user-code-frame.js

@@ -1,12 +1,15 @@
 // We try to load node dependencies
+let chalk = null
 let readFileSync = null
 let codeFrameColumns = null
 
 try {
   const nodeRequire = module && module.require
+
   readFileSync = nodeRequire.call(module, 'fs').readFileSync
   codeFrameColumns = nodeRequire.call(module, '@babel/code-frame')
     .codeFrameColumns
+  chalk = nodeRequire.call(module, 'chalk')
 } catch {
   // We're in a browser environment
   /* istanbul ignore next */
@@ -46,7 +49,7 @@ function getCodeFrame(frame) {
       linesBelow: 0,
     },
   )
-  return `${frameLocation}\n${codeFrame}\n`
+  return `${chalk.dim(frameLocation)}\n${codeFrame}\n`
 }
 
 function getUserCodeFrame() {