From a129166a1c7012ed2c8aad3630451136557ee911 Mon Sep 17 00:00:00 2001
From: Joy Reynolds <joyously@users.noreply.github.com>
Date: Mon, 11 Dec 2017 22:34:14 -0600
Subject: [PATCH] Fix fallback parsing

Split variable handling into two functions so one could be recursive.
Fixed fallback whitespace and nested variable handling.
Parsing now handles more cases with parentheses.
Addresses most of #6132
---
 plugins/prefixfree.vars.js | 41 ++++++++++++++++++++++++++------------
 1 file changed, 28 insertions(+), 13 deletions(-)

diff --git a/plugins/prefixfree.vars.js b/plugins/prefixfree.vars.js
index f7383db..b155cc5 100644
--- a/plugins/prefixfree.vars.js
+++ b/plugins/prefixfree.vars.js
@@ -23,21 +23,36 @@ if (dummy.background) { // Unprefixed support
 
 var vars = {};
 
-StyleFix.register(function(css) {
-	// We need to handle get and set at the same time, to allow overwriting of the same variable later on
-	return css.replace(/(?:^|\{|\s|;)--(?:[\w-]+)\s*:\s*[^;}]+|(\s|:|,)var\s*\(\s*--([\w-]+)(?:\s*|,\s*)?([\w-]+)?\)/gi, function($0, before, id, fallback) {
-		var declaration = $0.match(/(^|\{|\s|;)--([\w-]+)\s*:\s*([^;}]+)/i);
-		
-		if (declaration) {
-			vars[declaration[2]] = declaration[3];
-		}
-		else {
-			// Usage
-			fallback = fallback ? fallback.replace('--','') : null;
-			return before + (vars[id] || vars[fallback] || fallback || 'initial');
+function varUsage($0, id, fallback) {
+	var extra = '',
+		found,left,right;
+	if (fallback) {
+		fallback = fallback.replace(/var\(\s*--([\w-]+)\s*(?:,(.*))?\)/gi, varUsage); // recursive
+		right = fallback.indexOf(')');
+		left = fallback.indexOf('(');
+		if ( right > -1 && ((right < left) || left == -1) ) {
+			found = fallback.match( /([^)]*)\)(.*)/ );
+			if ( found ) {
+				fallback = found[1];
+				extra = found[2] + ')';
+			}
 		}
+	}
+	else fallback = 'initial';
+	return (vars[id] || fallback) + extra;
+}	
+	
+StyleFix.register(function(css) {
+	// handle variable definitions
+	return css.replace(/(?:^|\{|\s|;)--([\w-]+)\s*:([^;}]+)/gi, function($0, before, id, value) {
+		vars[id] = value;
+		return $0;  // this keeps the original intact
 	});
-});
+}, 1); 	 // use a low index to get values before other changes
 
+StyleFix.register(function(css) {
+	// handle variable usage
+	return css.replace(/var\(\s*--([\w-]+)\s*(?:,(.*))?\)/gi, varUsage);
+}, 10);
 
 })();