summaryrefslogtreecommitdiffstats
path: root/testing/web-platform/tests/css/css-conditional/js/001.html
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 09:22:09 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 09:22:09 +0000
commit43a97878ce14b72f0981164f87f2e35e14151312 (patch)
tree620249daf56c0258faa40cbdcf9cfba06de2a846 /testing/web-platform/tests/css/css-conditional/js/001.html
parentInitial commit. (diff)
downloadfirefox-43a97878ce14b72f0981164f87f2e35e14151312.tar.xz
firefox-43a97878ce14b72f0981164f87f2e35e14151312.zip
Adding upstream version 110.0.1.upstream/110.0.1upstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'testing/web-platform/tests/css/css-conditional/js/001.html')
-rw-r--r--testing/web-platform/tests/css/css-conditional/js/001.html216
1 files changed, 216 insertions, 0 deletions
diff --git a/testing/web-platform/tests/css/css-conditional/js/001.html b/testing/web-platform/tests/css/css-conditional/js/001.html
new file mode 100644
index 0000000000..bafb840d31
--- /dev/null
+++ b/testing/web-platform/tests/css/css-conditional/js/001.html
@@ -0,0 +1,216 @@
+<!doctype html>
+<title>CSS Test (Conditional Rules): @supports rules OM support</title>
+<link rel="author" title="Florian Rivoal" href="http://florian.rivoal.net/">
+<link rel="author" href="http://opera.com" title="Opera Software ASA">
+<link rel="help" href="http://www.w3.org/TR/css3-conditional/#at-supports">
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<style>
+ @supports (padding: 0) {
+ dfn { width:0; }
+ @supports (width: 0) {
+ br { height:0; }
+ }
+ ol { display:none; }
+ }
+ @media all {
+ @supports (padding: 0) {
+ @keyframes foo {
+ 0% { top: 0; left: 0; }
+ 100% { top: 100px; left: 100px; }
+ }
+ }
+ }
+ @supports (border: black) and (padding: 0) and (width: 0) {
+ dfn { width:0; }
+ }
+ @supports (border: black) or (padding: 0) or (width: 0) {
+ dfn { width:0; }
+ }
+</style>
+<script>
+ /**
+ * Asserts tha the two strings are equal, after normalizing whitespace
+ *
+ * If the serialization of whitespace and identation ever becomes
+ * specified to a sufficient degree of presition, this should be
+ * replaced by a strict textual comparison with assert_equals.
+ */
+ function assert_equals_normalized(a, b) {
+ var normal_a = a.replace(/\s+/g, " ");
+ var normal_b = b.replace(/\s+/g, " ");
+ assert_equals(normal_a, normal_b);
+ }
+ test(function(){
+ var base_rule = document.styleSheets[0].cssRules[0];
+ var child_rule = base_rule.cssRules[1];
+ assert_equals_normalized(base_rule.cssText,
+ "@supports (padding: 0) {\n"
+ +" dfn { width: 0px; }\n"
+ +" @supports (width: 0) {\n"
+ +" br { height: 0px; }\n"
+ +" }\n"
+ +" ol { display: none; }\n"
+ +"}");
+ assert_equals_normalized(child_rule.cssText,
+ "@supports (width: 0) {\n"
+ +" br { height: 0px; }\n"
+ +"}");
+ }, "nested @supports serialize properly");
+
+ test(function(){
+ var base_rule = document.styleSheets[0].cssRules[1];
+ var child_rule = base_rule.cssRules[0];
+ var grand_child_rule = child_rule.cssRules[0];
+ assert_equals_normalized(base_rule.cssText,
+ "@media all {\n"
+ +" @supports (padding: 0) {\n"
+ +" @keyframes foo {\n"
+ +" 0% { top: 0px; left: 0px; }\n"
+ +" 100% { top: 100px; left: 100px; }\n"
+ +" }\n"
+ +" }\n"
+ +"}");
+ assert_equals_normalized(child_rule.cssText,
+ "@supports (padding: 0) {\n"
+ +" @keyframes foo {\n"
+ +" 0% { top: 0px; left: 0px; }\n"
+ +" 100% { top: 100px; left: 100px; }\n"
+ +" }\n"
+ +"}");
+ assert_equals_normalized(grand_child_rule.cssText,
+ "@keyframes foo {\n"
+ +" 0% { top: 0px; left: 0px; }\n"
+ +" 100% { top: 100px; left: 100px; }\n"
+ +"}");
+ }, "@keyframes nested in @supports serialize properly");
+
+ test(function(){
+ var rules = document.styleSheets[0].cssRules;
+ assert_equals(rules.length, 4);
+ assert_equals(rules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[1].type, CSSRule.MEDIA_RULE);
+ assert_equals(rules[0].cssRules.length, 3);
+ assert_equals(rules[0].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules[2].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[0].cssRules[1].cssRules.length, 1);
+ assert_equals(rules[0].cssRules[1].cssRules[0].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[1].cssRules.length, 1);
+ assert_equals(rules[1].cssRules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[1].cssRules[0].cssRules.length, 1);
+ assert_equals(rules[1].cssRules[0].cssRules[0].type, CSSRule.KEYFRAMES_RULE);
+
+ assert_equals(rules[2].cssRules.length, 1);
+ assert_equals(rules[2].cssRules[0].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[3].cssRules.length, 1);
+ assert_equals(rules[3].cssRules[0].type, CSSRule.STYLE_RULE);
+ }, "The style sheet structure is properly represented");
+
+ test(function(){
+ document.styleSheets[0].deleteRule(1);
+
+ var rules = document.styleSheets[0].cssRules;
+ assert_equals(rules.length, 3);
+ assert_equals(rules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules.length, 3);
+ assert_equals(rules[0].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules[2].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[0].cssRules[1].cssRules.length, 1);
+ assert_equals(rules[0].cssRules[1].cssRules[0].type, CSSRule.STYLE_RULE);
+ }, "Deleting the top level of a nested structue works");
+
+ test(function(){
+ var rules = document.styleSheets[0].cssRules;
+
+ rules[0].cssRules[1].insertRule("img { visibility:hidden; }", 0);
+
+ assert_equals(rules.length, 3);
+ assert_equals(rules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules.length, 3);
+ assert_equals(rules[0].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules[2].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[0].cssRules[1].cssRules.length, 2);
+ assert_equals(rules[0].cssRules[1].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].cssRules[0].cssText, "img { visibility: hidden; }");
+ assert_equals(rules[0].cssRules[1].cssRules[1].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].cssRules[1].cssText, "br { height: 0px; }");
+ }, "Rule insertion works in nested @supports rules");
+
+ test(function(){
+ var rules = document.styleSheets[0].cssRules;
+
+ rules[0].insertRule("@supports (left: 42px) { #foo { color:green; } }", 1);
+
+ assert_equals(rules.length, 3);
+ assert_equals(rules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules.length, 4);
+ assert_equals(rules[0].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules[2].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules[3].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[0].cssRules[1].cssRules.length, 1);
+ assert_equals(rules[0].cssRules[1].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].cssRules[0].cssText, "#foo { color: green; }");
+
+ assert_equals(rules[0].cssRules[2].cssRules.length, 2);
+ assert_equals(rules[0].cssRules[2].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[2].cssRules[0].cssText, "img { visibility: hidden; }");
+ assert_equals(rules[0].cssRules[2].cssRules[1].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[2].cssRules[1].cssText, "br { height: 0px; }");
+ }, "Insertion @supports rules into another @supports rule works");
+
+ test(function(){
+ var rules = document.styleSheets[0].cssRules;
+
+ rules[0].deleteRule(2);
+
+ assert_equals(rules.length, 3);
+ assert_equals(rules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules.length, 3);
+ assert_equals(rules[0].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules[2].type, CSSRule.STYLE_RULE);
+
+ assert_equals(rules[0].cssRules[1].cssRules.length, 1);
+ assert_equals(rules[0].cssRules[1].cssRules[0].type, CSSRule.STYLE_RULE);
+ assert_equals(rules[0].cssRules[1].cssRules[0].cssText, "#foo { color: green; }");
+ }, "Deletion of a nested @supports rule works");
+
+ test(function(){
+ var rules = document.styleSheets[0].cssRules;
+
+ rules[0].insertRule("@font-face { font-familly: foo; src: url('http://www.example.com/foo'; }", 0);
+
+ assert_equals(rules.length, 3);
+ assert_equals(rules[0].type, CSSRule.SUPPORTS_RULE);
+ assert_equals(rules[0].cssRules.length, 4);
+ assert_equals(rules[0].cssRules[0].type, CSSRule.FONT_FACE_RULE);
+ }, "Inserting @font-face inside @supports works");
+
+ test(function(){
+ var rule = document.styleSheets[0].cssRules[1];
+ assert_equals_normalized(rule.cssText,
+ "@supports (border: black) and (padding: 0) and (width: 0) {\n"
+ +" dfn { width: 0px; }\n"
+ +"}");
+ }, "'and' arguments in @supports serialize in the correct order and with extra parentheses");
+ test(function(){
+ var rule = document.styleSheets[0].cssRules[2];
+ assert_equals_normalized(rule.cssText,
+ "@supports (border: black) or (padding: 0) or (width: 0) {\n"
+ +" dfn { width: 0px; }\n"
+ +"}");
+ }, "'or' arguments in @supports serialize in the correct order and with extra parentheses");
+</script>
+
+<div id=log></div>
+
generated by cgit v1.2.3 (git 2.39.1) at 2025-01-06 19:57:42 +0000