blob: 733fa335e13c6ad760dacf5ad0fb1b7344badcb7 [file] [log] [blame]
<html>
<body>
<div id="t"></div>
<div id="console"></div>
<script>
function print(message, color)
{
var paragraph = document.createElement("div");
paragraph.appendChild(document.createTextNode(message));
paragraph.style.fontFamily = "monospace";
if (color)
paragraph.style.color = color;
document.getElementById("console").appendChild(paragraph);
}
function run(a)
{
print(a);
try {
eval(a);
} catch(e) {
print(e);
}
}
function shouldBe(a, b)
{
var evalA;
try {
evalA = eval(a);
} catch(e) {
evalA = e;
}
if (evalA == b)
print("PASS: " + a + " should be " + b + " and is.", "green");
else
print("FAIL: " + a + " should be " + b + " but instead is " + evalA + ".", "red");
}
if (window.testRunner)
testRunner.dumpAsText();
var t = document.getElementById('t');
run("t.style.backgroundPositionX = '5%';");
shouldBe("t.style.backgroundPosition", "");
shouldBe("t.style.backgroundPositionX", "5%");
shouldBe("t.style.backgroundPositionY", "");
shouldBe("t.style.cssText", "background-position-x: 5%;");
shouldBe("t.getAttribute('style')", "background-position-x: 5%;");
run("t.style.backgroundPositionY = '5%';");
shouldBe("t.style.backgroundPosition", "5% 5%");
shouldBe("t.style.backgroundPositionX", "5%");
shouldBe("t.style.backgroundPositionY", "5%");
shouldBe("t.style.cssText", "background-position: 5% 5%;");
shouldBe("t.getAttribute('style')", "background-position: 5% 5%;");
run("t.style.backgroundPosition = '10% 10%';");
shouldBe("t.style.backgroundPosition", "10% 10%");
shouldBe("t.style.backgroundPositionX", "10%");
shouldBe("t.style.backgroundPositionY", "10%");
shouldBe("t.style.cssText", "background-position: 10% 10%;");
shouldBe("t.getAttribute('style')", "background-position: 10% 10%;");
run("t.style.backgroundPositionX = '20%';");
shouldBe("t.style.backgroundPosition", "20% 10%");
shouldBe("t.style.backgroundPositionX", "20%");
shouldBe("t.style.backgroundPositionY", "10%");
shouldBe("t.style.cssText", "background-position: 20% 10%;");
shouldBe("t.getAttribute('style')", "background-position: 20% 10%;");
run("t.style.backgroundPositionY = '20%';");
shouldBe("t.style.backgroundPosition", "20% 20%");
shouldBe("t.style.backgroundPositionX", "20%");
shouldBe("t.style.backgroundPositionY", "20%");
shouldBe("t.style.cssText", "background-position: 20% 20%;");
shouldBe("t.getAttribute('style')", "background-position: 20% 20%;");
run("t.setAttribute('style', 'background-position: 30% 30%');");
shouldBe("t.style.backgroundPosition", "30% 30%");
shouldBe("t.style.backgroundPositionX", "30%");
shouldBe("t.style.backgroundPositionY", "30%");
shouldBe("t.style.cssText", "background-position: 30% 30%;");
shouldBe("t.getAttribute('style')", "background-position: 30% 30%");
run("t.style.backgroundPositionX = '20%';");
shouldBe("t.style.backgroundPosition", "20% 30%");
shouldBe("t.style.backgroundPositionX", "20%");
shouldBe("t.style.backgroundPositionY", "30%");
shouldBe("t.style.cssText", "background-position: 20% 30%;");
shouldBe("t.getAttribute('style')", "background-position: 20% 30%;");
run("t.style.backgroundPositionY = '20%';");
shouldBe("t.style.backgroundPosition", "20% 20%");
shouldBe("t.style.backgroundPositionX", "20%");
shouldBe("t.style.backgroundPositionY", "20%");
shouldBe("t.style.cssText", "background-position: 20% 20%;");
shouldBe("t.getAttribute('style')", "background-position: 20% 20%;");
run("t.setAttribute('style', 'background-position: 60% 60% !important;');");
shouldBe("t.style.backgroundPosition", "60% 60%");
shouldBe("t.style.backgroundPositionX", "60%");
shouldBe("t.style.backgroundPositionY", "60%");
shouldBe("t.style.cssText", "background-position: 60% 60% !important;");
run("t.setAttribute('style', 'background-position: 10px 15px, 20px 25px, 30px 35px');");
shouldBe("t.style.backgroundPosition", "10px 15px, 20px 25px, 30px 35px");
shouldBe("t.style.backgroundPositionX", "10px, 20px, 30px");
shouldBe("t.style.backgroundPositionY", "15px, 25px, 35px");
shouldBe("t.style.cssText", "background-position: 10px 15px, 20px 25px, 30px 35px;");
run("t.setAttribute('style', 'background-position: bottom 10px right 20px');");
shouldBe("t.style.backgroundPosition", "right 20px bottom 10px");
shouldBe("window.getComputedStyle(t).backgroundPosition", "right 20px bottom 10px");
run("t.setAttribute('style', 'background-position: top 10px right 20px');");
shouldBe("t.style.backgroundPosition", "right 20px top 10px");
shouldBe("window.getComputedStyle(t).backgroundPosition", "right 20px top 10px");
run("t.setAttribute('style', 'background-position: 50% left');"); // Invalid per spec.
shouldBe("t.style.backgroundPosition", "");
run("t.setAttribute('style', 'background-position-x: right 20px');"); // This does not parse, but perhaps it should.
shouldBe("window.getComputedStyle(t).backgroundPositionX", "0%");
run("t.setAttribute('style', 'background-position: right 20px bottom 10px');");
shouldBe("window.getComputedStyle(t).backgroundPosition", "right 20px bottom 10px");
shouldBe("window.getComputedStyle(t).backgroundPositionX", "20px"); // This is a bug. webkit.org/b/154551
run("t.setAttribute('style', 'background: url(about:blank) 80% 80%;');");
run("t.style.backgroundPositionY = '50px'");
print("style.cssText =");
print(t.style.cssText);
</script>