parse-is-where.html (2630B)
1 <!doctype html> 2 <title>CSS Selectors: :is() and :where() parsing</title> 3 <link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io"> 4 <link rel="help" href="https://drafts.csswg.org/selectors-4/#matches"> 5 <link rel="help" href="https://drafts.csswg.org/selectors-4/#zero-matches"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <script src="/css/support/parsing-testcommon.js"></script> 9 <script> 10 function assert_valid(valid, pattern, expected_pattern, description) { 11 for (let pseudo of ["is", "where"]) { 12 let selector = pattern.replace("{}", ":" + pseudo); 13 let expected_selector = selector; 14 if (expected_pattern != null) 15 expected_selector = expected_pattern.replace("{}", ":" + pseudo); 16 if (valid) { 17 test_valid_selector(selector, expected_selector); 18 } else { 19 test_valid_forgiving_selector(selector); 20 } 21 } 22 } 23 24 assert_valid(true, "{}(div )", "{}(div)", "Trailing whitespace"); 25 assert_valid(true, "{}(div + bar, div ~ .baz)", null, "Multiple selectors with combinators"); 26 27 assert_valid(true, "{}(:is(div))", null, "Nested :is"); 28 assert_valid(true, "{}(:where(div))", null, "Nested :where"); 29 30 assert_valid(true, ":host({}(div))", null, "Nested inside :host, without combinators"); 31 assert_valid(true, ":host({}(div ))", ":host({}(div))", "Nested inside :host, with trailing whitespace"); 32 // See https://github.com/w3c/csswg-drafts/issues/5093 33 assert_valid(false, ":host({}(div .foo))", null, "Nested inside :host, with combinators"); 34 35 assert_valid(true, "{}(:hover, :active)", null, "Pseudo-classes inside"); 36 assert_valid(true, "{}(div):hover", null, "Pseudo-classes after"); 37 assert_valid(true, "{}(div)::before", null, "Pseudo-elements after"); 38 assert_valid(false, "{}(::before)", null, "Pseudo-elements inside"); 39 40 assert_valid(true, "{}(div) + bar", null, "Combinators after"); 41 assert_valid(true, "::part(foo){}(:hover)", null, "After part with simple pseudo-class"); 42 assert_valid(false, "::part(foo){}([attr='value'])", null, "After part with invalid selector after"); 43 44 assert_valid(true, ":not({}(div))", null, "Nested inside :not, without combinators"); 45 assert_valid(true, ":not({}(div .foo))", null, "Nested inside :not, with combinators"); 46 // This should be invalid even with the forgiving behavior because 47 // `<any-value>` doesn't allow bad tokens: 48 // https://drafts.csswg.org/css-syntax-3/#typedef-declaration-value 49 test_invalid_selector(`:is(# C4єанйтж╕/┘ГЁжЮХєа▓┐ЁЭБМєаСеЁЭЖА%=[ямм0)`); 50 </script>