[CSS] Accept 8 (#RRGGBBAA) and 4 (#RGBA) value hex colors

third_party/WebKit/LayoutTests/fast/css/parsing-color-quirk.html

 <script src="../../resources/testharness.js"></script>
 <script src="../../resources/testharnessreport.js"></script>
 <style>
 #t1 { color: 008000 }
 #t2 { background-color: 008000 }
 #t3 { border-color: 008000  }
 #t4 { border-bottom-color: 008000  }
 #t5 { border-left-color: 008000  }
 #t6 { border-right-color: 008000  }
 #t7 { border-top-color: 008000  }
@@ skipping 25 matching lines @@
 #t27 { border-right: ff0000 }
 #t28 { border-bottom: ff0000 }
 #t29 { border: ff0000 }
 
 #t30 { background-color: 1.1 }
 #t31 { background-color: +1.1 }
 #t32 { background-color: 1e1 }
 #t33 { background-color: 1e+1 }
 #t34 { background-color: 1e-1 }
 #t35 { background-color: 2222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222222f }
+
+#t36 { border-color: 1010 }
+#t37 { border-color: 00101010 }
+#t38 { border-color: ff10 }
+#t39 { border-color: ff101010 }
 </style>
 <script>
 var sheet = document.styleSheets[0];
 
 test(function(){ assert_true(!!sheet); }, "StyleSheet present");
-test(function(){ assert_equals(sheet.cssRules.length, 35); }, "All rules parsed");
+test(function(){ assert_equals(sheet.cssRules.length, 39); }, "All rules parsed");
 
 test(function(){
     assert_equals(sheet.cssRules[0].style.color, "rgb(0, 128, 0)");
 }, "Hashless color quirk for color property");
 
 test(function(){
     assert_equals(sheet.cssRules[1].style.backgroundColor, "rgb(0, 128, 0)");
 }, "Hashless color quirk for background-color property");
 
 test(function(){
@@ skipping 121 matching lines @@
 }, "No hashless color quirk for background-color property with invalid hashless value");
 
 test(function(){
     assert_equals(sheet.cssRules[33].style.backgroundColor, "");
 }, "No hashless color quirk for background-color property with invalid hashless value");
 
 test(function(){
     assert_equals(sheet.cssRules[34].style.backgroundColor, "");
 }, "No hashless color quirk for background-color property with invalid hashless value");
 
+test(function(){
+    assert_equals(sheet.cssRules[35].style.borderColor, "rgb(0, 16, 16)");
+}, "4 digits: 1010 is a valid <quirky-color>");
+
+test(function(){
+    assert_equals(sheet.cssRules[36].style.borderColor, "rgb(16, 16, 16)");
+}, "8 digits: 00101010 is a valid <quirky-color>");
+
+test(function(){
+    assert_equals(sheet.cssRules[37].style.borderColor, "");
+}, "No hashless color quirk for border-color property with 4 digit hex value");
+
+test(function(){
+    assert_equals(sheet.cssRules[38].style.borderColor, "");
+}, "No hashless color quirk for border-color property with 8 digit hex value");
 </script>

[Timothy Loh, 2016/05/12 06:56:08]

Test for fast path? e.g. make a div and execute div.style.color = "FF10", which
shouldn't set the color.