blob: 800bfc41237730236784cf7b2c2536f8adfd83af [file] [log] [blame]
<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML//EN">
<html>
<head>
<script src="../../resources/js-test-pre.js"></script>
</head>
<body>
<p id="description"></p>
<div id="console"></div>
<script>
description("Test the parsing of the mix-blend-mode property.");
function jsWrapperClass(node)
{
if (!node)
return "[null]";
var string = Object.prototype.toString.apply(node);
return string.substr(8, string.length - 9);
}
function shouldBeType(expression, className)
{
shouldBe("jsWrapperClass(" + expression + ")", "'" + className + "'");
shouldBe("jsWrapperClass(" + expression + ".__proto__)", "'" + className + "'");
shouldBe("jsWrapperClass(" + expression + ".constructor)", "'Function'");
}
// These have to be global for the test helpers to see them.
var stylesheet, cssRule, declaration, blendModeRule, subRule;
var styleElement = document.createElement("style");
document.head.appendChild(styleElement);
stylesheet = styleElement.sheet;
function testBlendModeRule(description, rule, expectedLength, expectedValue, expectedTypes, expectedTexts)
{
debug("");
debug(description + " : " + rule);
stylesheet.insertRule("body { mix-blend-mode: " + rule + "; }", 0);
cssRule = stylesheet.cssRules.item(0);
shouldBe("cssRule.type", "1");
declaration = cssRule.style;
shouldBe("declaration.length", "1");
shouldBe("declaration.getPropertyValue('mix-blend-mode')", "'" + expectedValue + "'");
blendModeRule = declaration.getPropertyCSSValue('mix-blend-mode');
shouldBeType("blendModeRule", "CSSPrimitiveValue");
}
var blendmodes = ["normal", "multiply", "screen", "overlay", "darken", "lighten", "color-dodge", "color-burn", "hard-light", "soft-light", "difference", "exclusion", "plus-darker", "plus-lighter"];
for(x in blendmodes)
testBlendModeRule("Basic reference", blendmodes[x], 1, blendmodes[x]);
successfullyParsed = true;
</script>
<script src="../../resources/js-test-post.js"></script>
</body>
</html>