140 lines
5.7 KiB
HTML
140 lines
5.7 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>CSS Test: CSSOM StyleSheet Initial Values</title>
|
|
<link rel="author" title="Bear Travis" href="mailto:betravis@adobe.com">
|
|
<link rel="help" href="https://www.w3.org/TR/cssom-1/#css-style-sheets">
|
|
<link rel="help" href="https://www.w3.org/TR/cssom-1/#the-cssimportrule-interface">
|
|
<link rel="help" href="https://www.w3.org/TR/cssom-1/#the-linkstyle-interface">
|
|
<meta name="flags" content="dom">
|
|
<meta name="assert" content="StyleSheet and CSSStyleSheet objects have the properties specified in their interfaces">
|
|
<script src="/resources/testharness.js" type="text/javascript"></script>
|
|
<script src="/resources/testharnessreport.js" type="text/javascript"></script>
|
|
<style id="styleElement" type="text/css" media="all" title="internal style sheet" disabled="disabled">
|
|
@import url('support/a-green.css');
|
|
* { margin: 0; padding: 0; }
|
|
</style>
|
|
<link id="linkElement" rel="stylesheet" href="support/b-green.css">
|
|
</head>
|
|
<body>
|
|
<noscript>Test not run - javascript required.</noscript>
|
|
<div id="log"></div>
|
|
<script type="text/javascript">
|
|
var styleElement = document.getElementById("styleElement");
|
|
var linkElement = document.getElementById("linkElement");
|
|
|
|
var styleSheet;
|
|
var linkSheet;
|
|
|
|
// styleElement.sheet exists and is a CSSStyleSheet
|
|
// linkElement.sheet exists and is a CSSStyleSheet
|
|
test(function() {
|
|
assert_idl_attribute(styleElement, "sheet");
|
|
assert_readonly(styleElement, "sheet");
|
|
styleSheet = styleElement.sheet;
|
|
assert_true(styleSheet instanceof CSSStyleSheet);
|
|
assert_idl_attribute(linkElement, "sheet");
|
|
linkSheet = linkElement.sheet;
|
|
assert_true(linkSheet instanceof CSSStyleSheet);
|
|
}, "sheet_property");
|
|
|
|
// The `disabled` IDL attribute setter has no effect before the underlying
|
|
// CSSStyleSheet is created.
|
|
test(function () {
|
|
const style = document.createElement("style");
|
|
style.disabled = true;
|
|
assert_false(style.disabled);
|
|
document.head.append(style);
|
|
const sheet1 = style.sheet;
|
|
assert_false(style.disabled);
|
|
assert_false(sheet1.disabled);
|
|
|
|
// The `disabled` attribute can be set after the sheet exists.
|
|
style.disabled = true;
|
|
assert_true(style.disabled);
|
|
assert_true(sheet1.disabled);
|
|
|
|
// Reset `disabled`.
|
|
style.disabled = false;
|
|
assert_false(style.disabled);
|
|
assert_false(style.disabled);
|
|
|
|
// Setting `disabled = true` on the CSSStyleSheet also carries over to the
|
|
// HTMLStyleElement.
|
|
sheet1.disabled = true;
|
|
assert_true(style.disabled);
|
|
assert_true(sheet1.disabled);
|
|
}, "disabled attribute getter/setter");
|
|
|
|
// The sheet property on LinkStyle should always return the current associated style sheet.
|
|
test(function () {
|
|
var style = document.createElement("style");
|
|
document.querySelector("head").appendChild(style);
|
|
var sheet1 = style.sheet;
|
|
assert_equals(sheet1.cssRules.length, 0);
|
|
style.appendChild(document.createTextNode("a { color: green; }"));
|
|
assert_equals(style.sheet.cssRules.length, 1);
|
|
}, "sheet_property_updates");
|
|
|
|
// ownerRule, cssRules, insertRule and deleteRule properties exist on CSSStyleSheet
|
|
// ownerRule, cssRules are read only
|
|
test(function() {
|
|
assert_idl_attribute(styleSheet, "ownerRule");
|
|
assert_idl_attribute(styleSheet, "cssRules");
|
|
assert_inherits(styleSheet, "insertRule");
|
|
assert_inherits(styleSheet, "deleteRule");
|
|
|
|
assert_readonly(styleSheet, "ownerRule");
|
|
assert_readonly(styleSheet, "cssRules");
|
|
}, "CSSStyleSheet_properties");
|
|
|
|
var importSheet;
|
|
// CSSStyleSheet initial property values are correct
|
|
test(function() {
|
|
assert_equals(styleSheet.ownerRule, null);
|
|
assert_true(styleSheet.cssRules.length > 0);
|
|
assert_true(styleSheet.cssRules.item(0) instanceof CSSImportRule);
|
|
importSheet = styleSheet.cssRules.item(0).styleSheet;
|
|
}, "CSSStyleSheet_property_values");
|
|
|
|
// type, disabled, ownerNode, parentStyleSheet, href, title, and media properties exist on StyleSheet
|
|
// type, ownerNode, parentStyleSheet, href, and title properties are read only
|
|
test(function() {
|
|
assert_idl_attribute(styleSheet, "type");
|
|
assert_idl_attribute(styleSheet, "disabled");
|
|
assert_idl_attribute(styleSheet, "ownerNode");
|
|
assert_idl_attribute(styleSheet, "parentStyleSheet");
|
|
assert_idl_attribute(styleSheet, "href");
|
|
assert_idl_attribute(styleSheet, "title");
|
|
assert_idl_attribute(styleSheet, "media");
|
|
|
|
assert_readonly(styleSheet, "type");
|
|
assert_readonly(styleSheet, "ownerNode");
|
|
assert_readonly(styleSheet, "parentStyleSheet");
|
|
assert_readonly(styleSheet, "href");
|
|
assert_readonly(styleSheet, "title");
|
|
}, "StyleSheet_properties");
|
|
|
|
// StyleSheet initial property values are correct
|
|
test(function() {
|
|
assert_equals(styleSheet.type, "text/css");
|
|
assert_equals(styleSheet.disabled, false);
|
|
|
|
assert_equals(styleSheet.ownerNode, styleElement);
|
|
assert_equals(linkSheet.ownerNode, linkElement);
|
|
assert_equals(importSheet.ownerNode, null);
|
|
|
|
assert_equals(styleSheet.href, null);
|
|
assert_regexp_match(linkSheet.href, /support\/b-green.css$/);
|
|
assert_regexp_match(importSheet.href, /support\/a-green.css$/);
|
|
|
|
assert_equals(styleSheet.parentStyleSheet, null);
|
|
assert_equals(linkSheet.parentStyleSheet, null);
|
|
assert_equals(importSheet.parentStyleSheet, styleSheet);
|
|
|
|
assert_equals(styleSheet.title, "internal style sheet");
|
|
assert_equals(styleSheet.media.item(0), "all");
|
|
}, "StyleSheet_property_values");
|
|
</script>
|
|
</body>
|
|
</html>
|