attr-null-namespace.xhtml (3228B)
1 <?xml version="1.0" encoding="UTF-8"?> 2 <html xmlns="http://www.w3.org/1999/xhtml" 3 xmlns:nsfoo="http://nsfoo.org" 4 xmlns:nsbar="http://nsbar.org"> 5 <head> 6 <title>CSS Values: attr() substitution with implicit null namespace</title> 7 <link rel="help" href="https://drafts.csswg.org/css-values-5/#attr-notation"/> 8 <script src="/resources/testharness.js"></script> 9 <script src="/resources/testharnessreport.js"></script> 10 </head> 11 <body> 12 <div id="target" 13 nsfoo:data-x="value1" 14 nsbar:data-x="value2" 15 data-x="value3" 16 17 nsfoo:data-y="value4" 18 nsbar:data-y="value5"> 19 Test 20 </div> 21 <style> 22 #target { 23 --x: attr(data-x type(*), fallback); 24 --y: attr(data-y type(*), fallback); 25 --z: attr(data-z type(*), fallback); 26 --w: attr(data-w type(*), fallback); 27 } 28 </style> 29 <script> 30 test(() => { 31 let e = document.getElementById("target"); 32 assert_equals("value1", e.getAttributeNS("http://nsfoo.org", "data-x")); 33 assert_equals("value2", e.getAttributeNS("http://nsbar.org", "data-x")); 34 assert_equals("value3", e.getAttributeNS(null, "data-x")); 35 36 assert_equals("value4", e.getAttributeNS("http://nsfoo.org", "data-y")); 37 assert_equals("value5", e.getAttributeNS("http://nsbar.org", "data-y")); 38 assert_equals(null, e.getAttributeNS(null, "data-y")); 39 }, "Sanity check"); 40 41 test(() => { 42 let e = document.getElementById("target"); 43 assert_equals(getComputedStyle(e).getPropertyValue("--x"), "value3"); 44 }, "Attribute in null-namespace is substituted"); 45 46 test(() => { 47 let e = document.getElementById("target"); 48 assert_equals(getComputedStyle(e).getPropertyValue("--y"), "fallback"); 49 }, "Fallback is taken when attribute does not exist in null-namespace"); 50 51 test((t) => { 52 let e = document.getElementById("target"); 53 t.add_cleanup(() => { 54 e.removeAttributeNS("http://nsfoo.org", "data-z"); 55 e.removeAttributeNS("http://nsbar.org", "data-z"); 56 e.removeAttributeNS(null, "data-z"); 57 }); 58 e.setAttributeNS("http://nsfoo.org", "data-z", "value6"); 59 e.setAttributeNS("http://nsbar.org", "data-z", "value7"); 60 e.setAttributeNS(null, "data-z", "value8"); 61 assert_equals(getComputedStyle(e).getPropertyValue("--z"), "value8"); 62 }, "Attribute in null-namespace is substituted (JS)"); 63 64 test((t) => { 65 let e = document.getElementById("target"); 66 t.add_cleanup(() => { 67 e.removeAttributeNS("http://nsfoo.org", "data-w"); 68 e.removeAttributeNS("http://nsbar.org", "data-w"); 69 }); 70 e.setAttributeNS("http://nsfoo.org", "data-w", "value9"); 71 e.setAttributeNS("http://nsbar.org", "data-w", "value10"); 72 assert_equals(getComputedStyle(e).getPropertyValue("--w"), "fallback"); 73 }, "Fallback is taken when attribute does not does exist in null-namespace (JS)"); 74 </script> 75 </body> 76 </html>