css-namespace-rule.html | Explore in Territory

<!DOCTYPE html>
<script src="../../resources/js-test.js"></script>
<style id="style1">
@namespace url(default);
@namespace my-namespace url(http://www.w3.org/1999/xhtml);
body {
	color:black;
}
my-namespace|body {
	color:red;
}
</style>
Here is some text!
<script>
description('Check the basic attribute support of CSSOM CSSNamespaceRule');

shouldBe('CSSRule.NAMESPACE_RULE','10');
var styleSheet = document.getElementById("style1").sheet;
var defaultNamespacerule = styleSheet.cssRules[0];
var namespacerule = styleSheet.cssRules[1];
shouldBe('namespacerule.type','10');
shouldBeEqualToString('namespacerule.namespaceURI','http://www.w3.org/1999/xhtml');
shouldBeEqualToString('namespacerule.prefix','my-namespace');
shouldBeEqualToString('defaultNamespacerule.cssText', '@namespace url("default");');
shouldBeEqualToString('namespacerule.cssText', '@namespace my-namespace url("http://www.w3.org/1999/xhtml");');
shouldBeEqualToString('getComputedStyle(document.body).color', 'rgb(255, 0, 0)');

debug("Deleting namespace rule when other rules are present should throw InvalidStateException.");
try {
	styleSheet.deleteRule(namespacerule);
} catch (e) {
	shouldBe(e.code, '11');
}

debug("Inserting new namespace rule when other rules are present should throw InvalidStateException.");
try {
	styleSheet.insertRule("@namespace new-namespace url('test-namespace');", styleSheet.cssRules.length);
} catch (e) {
	shouldBe(e.code, '11');
}

</script>
chromium/third_party/blink/web_tests/fast/css/css-namespace-rule.html
