Bug 1142194 - fix quoteString to correctly quote. r=pbrosset

browser/devtools/styleinspector/css-parsing-utils.js

@@ -15,14 +15,26 @@ function quoteString(string) {
   let hasDoubleQuotes = string.contains('"');
   let hasSingleQuotes = string.contains("'");
 
+  let quote = '"';
   if (hasDoubleQuotes && !hasSingleQuotes) {
-    // In this case, no escaping required, just enclose in single-quotes
-    return "'" + string + "'";
+    quote = "'";
   }
 
-  // In all other cases, enclose in double-quotes, and escape any double-quote
-  // that may be in the string
-  return '"' + string.replace(/"/g, '\"') + '"';
+  // Quote special characters as specified by the CSS grammar.
+  // See http://www.w3.org/TR/CSS2/syndata.html#tokenization
+  // and http://www.w3.org/TR/CSS2/syndata.html#strings
+  return quote +
+    string.replace(/[\\"]/g, match => {
+      switch (match) {
+      case '\\':
+        return '\\\\';
+      case '"':
+        if (quote == '"')
+          return '\\"';
+        return match;
+      }
+    }) +
+    quote;
 }
 
 /**

browser/devtools/styleinspector/test/unit/test_parseDeclarations.js

@@ -155,7 +155,7 @@ const TEST_DATA = [
   {input: 'content: "this is a \\"string\\""', expected: [{name: "content", value: '\'this is a "string"\'', priority: ""}]},
   {input: "content: 'this is a \"string\"'", expected: [{name: "content", value: '\'this is a "string"\'', priority: ""}]},
   {input: "content: 'this is a \\'string\\'", expected: [{name: "content", value: '"this is a \'string\'"', priority: ""}]},
-  {input: "content: 'this \\' is a \" really strange string'", expected: [{name: "content", value: '"this \' is a \" really strange string"', priority: ""}]},
+  {input: "content: 'this \\' is a \" really strange string'", expected: [{name: "content", value: '"this \' is a \\\" really strange string"', priority: ""}]},
   {
     input: "content: \"a not s\\\
           o very long title\"",

browser/devtools/styleinspector/test/unit/test_parseSingleValue.js

@@ -47,6 +47,13 @@ const TEST_DATA = [
       value: "\"content!important\"",
       priority: ""
     }
+  },
+  {
+    input: "\"all the \\\"'\\\\ special characters\"",
+    expected: {
+      value: "\"all the \\\"'\\\\ special characters\"",
+      priority: ""
+    }
   }
 ];