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  }

#t8 { background: ff0000 }
#t9 { text-shadow: 1px 1px ff0000 }
#t10 { box-shadow: 1px 1px ff0000 }
#t11 { background-image: linear-gradient(ff0000, blue); }

#t12 { -webkit-border-start-color: ff0000 }
#t13 { -webkit-border-end-color: ff0000 }
#t14 { -webkit-border-before-color: ff0000 }
#t15 { -webkit-border-after-color: ff0000 }

#t16 { -webkit-column-rule-color: ff0000 }

#t17 { -webkit-text-emphasis-color: ff0000 }
#t18 { -webkit-text-fill-color: ff0000 }
#t19 { -webkit-text-stroke-color: ff0000 }

#t20 { fill: ff0000 }
#t21 { stroke: ff0000 }
#t22 { stop-color: ff0000 }
#t23 { flood-color: ff0000 }
#t24 { lighting-color: ff0000 }

#t25 { border-top: ff0000 }
#t26 { border-left: ff0000 }
#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>
<div></div>
<script>
function testElementWithColorStyle(colorString) {
    var element = document.querySelector('div');
    element.style.color = null; /* Reset any existing color style first. */
    element.style.color = colorString;
    return element;
}

var sheet = document.styleSheets[0];

test(function(){ assert_true(!!sheet); }, "StyleSheet present");
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(){
    assert_equals(sheet.cssRules[2].style.borderColor, "rgb(0, 128, 0)");
}, "Hashless color quirk for border-color short-hand");

test(function(){
    assert_equals(sheet.cssRules[3].style.borderBottomColor, "rgb(0, 128, 0)");
}, "Hashless color quirk for border-bottom-color property");

test(function(){
    assert_equals(sheet.cssRules[4].style.borderLeftColor, "rgb(0, 128, 0)");
}, "Hashless color quirk for border-left-color property");

test(function(){
    assert_equals(sheet.cssRules[5].style.borderRightColor, "rgb(0, 128, 0)");
}, "Hashless color quirk for border-right-color property");

test(function(){
    assert_equals(sheet.cssRules[6].style.borderTopColor, "rgb(0, 128, 0)");
}, "Hashless color quirk for border-top-color property");

test(function(){
    assert_equals(sheet.cssRules[7].style.backgroundColor, "");
}, "No hashless color quirk for background short-hand");

test(function(){
    assert_equals(sheet.cssRules[8].style.textShadow, "");
}, "No hashless color quirk for text-shadow color");

test(function(){
    assert_equals(sheet.cssRules[9].style.boxShadow, "");
}, "No hashless color quirk for box-shadow color");

test(function(){
    assert_equals(sheet.cssRules[10].style.backgroundImage, "");
}, "No hashless color quirk for linear-gradient colors");

test(function(){
    assert_equals(sheet.cssRules[11].style.WebkitBorderStartColor, "");
}, "No hashless color quirk for -webkit-border-start-color property");

test(function(){
    assert_equals(sheet.cssRules[12].style.WebkitBorderEndColor, "");
}, "No hashless color quirk for -webkit-border-end-color property");

test(function(){
    assert_equals(sheet.cssRules[13].style.WebkitBorderBeforeColor, "");
}, "No hashless color quirk for -webkit-border-before-property");

test(function(){
    assert_equals(sheet.cssRules[14].style.WebkitBorderAfterColor, "");
}, "No hashless color quirk for -webkit-border-after-color property");

test(function(){
    assert_equals(sheet.cssRules[15].style.WebkitColumnRuleColor, "");
}, "No hashless color quirk for -webkit-column-rule-color property");

test(function(){
    assert_equals(sheet.cssRules[16].style.WebkitTextEmphasisColor, "");
}, "No hashless color quirk for -webkit-text-emphasis-color property");

test(function(){
    assert_equals(sheet.cssRules[17].style.WebkitTextFillColor, "");
}, "No hashless color quirk for -webkit-text-fill-color property");

test(function(){
    assert_equals(sheet.cssRules[18].style.WebkitTextStrokeColor, "");
}, "No hashless color quirk for -webkit-text-stroke-color property");

test(function(){
    assert_equals(sheet.cssRules[19].style.fill, "");
}, "No hashless color quirk for fill property");

test(function(){
    assert_equals(sheet.cssRules[20].style.stroke, "");
}, "No hashless color quirk for stroke property");

test(function(){
    assert_equals(sheet.cssRules[21].style.stopColor, "");
}, "No hashless color quirk for stop-color property");

test(function(){
    assert_equals(sheet.cssRules[22].style.floodColor, "");
}, "No hashless color quirk for flood-color property");

test(function(){
    assert_equals(sheet.cssRules[23].style.lightingColor, "");
}, "No hashless color quirk for lighting-color property");

test(function(){
    assert_equals(sheet.cssRules[24].style.borderTopColor, "");
}, "No hashless color quirk for border-top shorthand");

test(function(){
    assert_equals(sheet.cssRules[25].style.borderLeftColor, "");
}, "No hashless color quirk for border-left shorthand");

test(function(){
    assert_equals(sheet.cssRules[26].style.borderRightColor, "");
}, "No hashless color quirk for border-right shorthand");

test(function(){
    assert_equals(sheet.cssRules[27].style.borderBottomColor, "");
}, "No hashless color quirk for border-bottom shorthand");

test(function(){
    assert_equals(sheet.cssRules[28].style.borderTopColor, "");
}, "No hashless color quirk for border shorthand");

test(function(){
    assert_equals(sheet.cssRules[29].style.backgroundColor, "");
}, "No hashless color quirk for background-color property with invalid hashless value");

test(function(){
    assert_equals(sheet.cssRules[30].style.backgroundColor, "");
}, "No hashless color quirk for background-color property with invalid hashless value");

test(function(){
    assert_equals(sheet.cssRules[31].style.backgroundColor, "");
}, "No hashless color quirk for background-color property with invalid hashless value");

test(function(){
    assert_equals(sheet.cssRules[32].style.backgroundColor, "");
}, "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");

test(function(){
    var element = testElementWithColorStyle("f0f");
    assert_equals(element.style.color, "rgb(255, 0, 255)");
}, "3 digit hex: f0f should be accepted in quirks-mode");

test(function(){
    var element = testElementWithColorStyle("ff00ff");
    assert_equals(element.style.color, "rgb(255, 0, 255)");
}, "6 digit hex: ff00ff should be accepted in quirks-mode");

test(function(){
    var element = testElementWithColorStyle("F0F0");
    assert_equals(element.style.color, "");
}, "4 digit hex: F0F0 must be ignored in quirks-mode");

test(function(){
    var element = testElementWithColorStyle("FF00FF00");
    assert_equals(element.style.color, "");
}, "8 digit hex: FF00FF00 must be ignored in quirks-mode");
</script>