Gracefully handle color parsing failures (#1363)

Fixes #1362

Basically when we'd see `rgb(1rem)` and tried to parse it with Culori it
would throw an error instead of returning `undefined` as would normally
be the case. Pretty sure this isn't supposed to throw but 🤷‍♂️

Author: thecrypticace

packages/tailwindcss-language-service/src/util/color.ts

@@ -61,7 +61,7 @@ function getColorsInString(state: State, str: string): (culori.Color | KeywordCo
 
   function toColor(match: RegExpMatchArray) {
     let color = match[1].replace(/var\([^)]+\)/, '1')
-    return getKeywordColor(color) ?? culori.parse(color)
+    return getKeywordColor(color) ?? tryParseColor(color)
   }
 
   str = replaceCssVarsWithFallbacks(state, str)
@@ -275,8 +275,8 @@ export function getColorFromValue(value: unknown): culori.Color | KeywordColor |
   ) {
     return null
   }
-  const color = culori.parse(trimmedValue)
-  return color ?? null
+
+  return tryParseColor(trimmedValue)
 }
 
 let toRgb = culori.converter('rgb')
@@ -296,11 +296,21 @@ export function formatColor(color: culori.Color): string {
 
 const COLOR_MIX_REGEX = /color-mix\(in [^,]+,\s*(.*?)\s*(\d+|\.\d+|\d+\.\d+)%,\s*transparent\)/g
 
+function tryParseColor(color: string) {
+  try {
+    return culori.parse(color) ?? null
+  } catch (err) {
+    console.error('Error parsing color', color)
+    console.error(err)
+    return null
+  }
+}
+
 function removeColorMixWherePossible(str: string) {
   return str.replace(COLOR_MIX_REGEX, (match, color, percentage) => {
     if (color.startsWith('var(')) return match
 
-    let parsed = culori.parse(color)
+    let parsed = tryParseColor(color)
     if (!parsed) return match
 
     let alpha = Number(percentage) / 100

packages/vscode-tailwindcss/CHANGELOG.md

@@ -6,6 +6,7 @@
 - Ignore Python virtual env directories by default ([#1336](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1336))
 - Ignore Yarn v2+ metadata & cache directories by default ([#1336](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1336))
 - Ignore some build caches by default ([#1336](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1336))
+- Gracefully handle color parsing failures ([#1363](https://github.com/tailwindlabs/tailwindcss-intellisense/pull/1363))
 
 # 0.14.16