Safe postcss values parser

Author: romainmenke

.tape.js

@@ -1,9 +1,11 @@
 module.exports = {
 	'basic': {
-		message: 'supports basic usage'
+		message: 'supports basic usage',
+		warnings: 1,
 	},
 	'basic:preserve-true': {
 		message: 'supports { preserve: true } usage',
+		warnings: 1,
 		options: {
 			preserve: true
 		}

src/onCSSDeclaration.js

@@ -3,11 +3,24 @@ import onCSSFunction from './onCSSFunction'
 import options from './options'
 
 /** @type {(decl: CSSDeclaration) => void} Transform lab() and lch() functions in CSS Declarations. */
-const onCSSDeclaration = decl => {
+const onCSSDeclaration = (decl, { result }) => {
 	const { value: originalValue } = decl
 
 	if (hasAnyColorFunction(originalValue)) {
-		const valueAST = parse(originalValue)
+		let valueAST
+
+		try {
+			valueAST = parse(originalValue, { ignoreUnknownWords: true })
+		} catch (error) {
+			decl.warn(
+				result,
+				`Failed to parse value '${originalValue}' as a lab or hcl function. Leaving the original value intact.`
+			)
+		}
+
+		if (typeof valueAST === 'undefined') {
+			return
+		}
 
 		valueAST.walkType('func', onCSSFunction)
 

test/basic.css

@@ -15,3 +15,7 @@
 	color: lch(40% 68.8 34.5 / 50%);
 	color: lch(100% 50 0);
 }
+
+.test-unparseable-lab-function {
+	background-image: lab(; );
+}

test/basic.expect.css

@@ -15,3 +15,7 @@
 	color: rgba(178, 34, 34, 0.5);
 	color: rgb(255, 216, 255);
 }
+
+.test-unparseable-lab-function {
+	background-image: lab(; );
+}

test/basic.preserve-true.expect.css

@@ -27,3 +27,7 @@
 	color: rgb(255, 216, 255);
 	color: lch(100% 50 0);
 }
+
+.test-unparseable-lab-function {
+	background-image: lab(; );
+}