Properly parse CSS strings with escape sequences.

The CSS escape syntax is not the same as JavaScript escapes -- and
besides, using `eval` is evil.  Write a proper parser (and serializer)
for CSS strings with escape sequences.

Regular expressions in this patch based on those found in
https://www.w3.org/TR/CSS21/grammar.html#scanner

Author: cscott

src/css/PropertyValuePart.js

@@ -142,9 +142,12 @@ function PropertyValuePart(text, line, col){
         this.type   = "function";
         this.name   = RegExp.$1;
         this.value  = text;
-    } else if (/^["'][^"']*["']/.test(text)){    //string
+    } else if (/^"([^\n\r\f\\"]|\\\r\n|\\[^\r0-9a-f]|\\[0-9a-f]{1,6}(\r\n|[ \n\r\t\f])?)*"/i.test(text)){    //double-quoted string
         this.type   = "string";
-        this.value  = eval(text);
+        this.value  = PropertyValuePart.parseString(text);
+    } else if (/^'([^\n\r\f\\']|\\\r\n|\\[^\r0-9a-f]|\\[0-9a-f]{1,6}(\r\n|[ \n\r\t\f])?)*'/i.test(text)){    //single-quoted string
+        this.type   = "string";
+        this.value  = PropertyValuePart.parseString(text);
     } else if (Colors[text.toLowerCase()]){  //named color
         this.type   = "color";
         temp        = Colors[text.toLowerCase()].substring(1);
@@ -164,6 +167,46 @@ function PropertyValuePart(text, line, col){
 PropertyValuePart.prototype = new SyntaxUnit();
 PropertyValuePart.prototype.constructor = PropertyValuePart;
 
+/**
+ * Helper method to parse a CSS string.
+ */
+PropertyValuePart.parseString = function(str) {
+    str = str.slice(1, -1); // Strip surrounding single/double quotes
+    var replacer = function(match, esc) {
+        if (/^(\n|\r\n|\r|\f)$/.test(esc)) { return ''; }
+        var m = /^[0-9a-f]{1,6}/i.exec(esc);
+        if (m) {
+            var codePoint = parseInt(m[0], 16);
+            if (String.fromCodePoint) {
+                return String.fromCodePoint(codePoint);
+            } else {
+                // XXX No support for surrogates on old JavaScript engines.
+                return String.fromCharCode(codePoint);
+            }
+        }
+        return esc;
+    };
+    return str.replace(/\\(\r\n|[^\r0-9a-f]|[0-9a-f]{1,6}(\r\n|[ \n\r\t\f])?)/ig,
+                       replacer);
+};
+
+/**
+ * Helper method to serialize a CSS string.
+ */
+PropertyValuePart.serializeString = function(value) {
+    var replacer = function(match, c) {
+        if (c === '"') {
+            return "\\" + c;
+        }
+        var cp = String.codePointAt ? String.codePointAt(0) :
+            // We only escape non-surrogate chars, so using charCodeAt
+            // is harmless here.
+            String.charCodeAt(0);
+        return "\\" + cp.toString(16) + " ";
+    };
+    return '"' + value.replace(/["\r\n\f]/g, replacer) + '"';
+};
+
 /**
  * Create a new syntax unit based solely on the given token.
  * Convenience method for creating a new syntax unit when

src/css/TokenStream.js

@@ -696,26 +696,46 @@ TokenStream.prototype = mix(new TokenStreamBase(), {
         var delim   = first,
             string  = first,
             reader  = this._reader,
-            prev    = first,
             tt      = Tokens.STRING,
-            c       = reader.read();
+            c       = reader.read(),
+            i;
 
         while(c){
             string += c;
 
-            //if the delimiter is found with an escapement, we're done.
-            if (c === delim && prev !== "\\"){
-                break;
-            }
-
-            //if there's a newline without an escapement, it's an invalid string
-            if (isNewLine(reader.peek()) && c !== "\\"){
+            if (c === "\\") {
+                c = reader.read();
+                if (c === null) {
+                    break; // premature EOF after backslash
+                } else if (/[^\r\n\f0-9a-f]/i.test(c)) {
+                    // single-character escape
+                    string += c;
+                } else {
+                    // read up to six hex digits
+                    for (i=0; isHexDigit(c) && i<6; i++) {
+                        string += c;
+                        c = reader.read();
+                    }
+                    // swallow trailing newline or space
+                    if (c === "\r" && reader.peek() === "\n") {
+                        string += c;
+                        c = reader.read();
+                    }
+                    if (isWhitespace(c)) {
+                        string += c;
+                    } else {
+                        // This character is null or not part of the escape;
+                        // jump back to the top to process it.
+                        continue;
+                    }
+                }
+            } else if (c === delim) {
+                break; // delimiter found.
+            } else if (isNewLine(reader.peek())) {
+                // newline without an escapement: it's an invalid string
                 tt = Tokens.INVALID;
                 break;
             }
-
-            //save previous and get next
-            prev = c;
             c = reader.read();
         }
 
@@ -857,38 +877,8 @@ TokenStream.prototype = mix(new TokenStreamBase(), {
         return number;
     },
     readString: function(){
-        var reader  = this._reader,
-            delim   = reader.read(),
-            string  = delim,
-            prev    = delim,
-            c       = reader.peek();
-
-        while(c){
-            c = reader.read();
-            string += c;
-
-            //if the delimiter is found with an escapement, we're done.
-            if (c === delim && prev !== "\\"){
-                break;
-            }
-
-            //if there's a newline without an escapement, it's an invalid string
-            if (isNewLine(reader.peek()) && c !== "\\"){
-                string = "";
-                break;
-            }
-
-            //save previous and get next
-            prev = c;
-            c = reader.peek();
-        }
-
-        //if c is null, that means we're out of input and the string was never closed
-        if (c === null){
-            string = "";
-        }
-
-        return string;
+        var token = this.stringToken(this._reader.read(), 0, 0);
+        return token.type === Tokens.INVALID ? "" : token.value;
     },
     readURI: function(first){
         var reader  = this._reader,

tests/css/Parser.js

@@ -1235,6 +1235,26 @@
             Assert.areEqual("Hello world!", result.parts[0].value);
         },
 
+        testStringValue3: function(){
+            var parser = new Parser();
+            var result = parser.parsePropertyValue("\"Chapter\\A \\0a\t\\00A\r\\000a\n\\0000A\f\\00000a\r\n\\00000AFour\\\"\'\\\n\\\r\n\\\r\\\f\\41\"");
+
+            Assert.isInstanceOf(parserlib.css.PropertyValue, result);
+            Assert.areEqual(1, result.parts.length);
+            Assert.areEqual("string", result.parts[0].type);
+            Assert.areEqual("Chapter\n\n\n\n\n\n\nFour\"\'A", result.parts[0].value);
+        },
+
+        testStringValue4: function(){
+            var parser = new Parser();
+            var result = parser.parsePropertyValue("\'Chapter\\A \\0a\t\\00A\r\\000a\n\\0000A\f\\00000a\r\n\\00000AFour\"\\\'\\\n\\\r\n\\\r\\\f\\41\'");
+
+            Assert.isInstanceOf(parserlib.css.PropertyValue, result);
+            Assert.areEqual(1, result.parts.length);
+            Assert.areEqual("string", result.parts[0].type);
+            Assert.areEqual("Chapter\n\n\n\n\n\n\nFour\"\'A", result.parts[0].value);
+        },
+
         testValueWithOperators: function(){
             var parser = new Parser();
             var result = parser.parsePropertyValue("10px / 1em");