pseudo-classes-after-part.html (4394B)
1 <!DOCTYPE html> 2 <title>Pseudo-classes allowed after ::part()</title> 3 <link rel="help" href="https://drafts.csswg.org/css-shadow-parts/"> 4 <script src="/resources/testharness.js"></script> 5 <script src="/resources/testharnessreport.js"></script> 6 <script src="../support/parsing-testcommon.js"></script> 7 8 <script> 9 "use strict"; 10 11 // Test that non-structural pseudo-classes are allowed after ::part(). 12 test_valid_selector("::part(mypart):active"); 13 test_valid_selector("::part(mypart):active-view-transition"); 14 test_valid_selector("::part(mypart):active-view-transition-type(mytype)"); 15 test_valid_selector("::part(mypart):any-link"); 16 test_valid_selector("::part(mypart):autofill"); 17 test_valid_selector("::part(mypart):checked"); 18 test_valid_selector("::part(mypart):default"); 19 test_valid_selector("::part(mypart):defined"); 20 test_valid_selector("::part(mypart):dir(ltr)"); 21 test_valid_selector("::part(mypart):disabled"); 22 test_valid_selector("::part(mypart):enabled"); 23 test_valid_selector("::part(mypart):focus"); 24 test_valid_selector("::part(mypart):focus-visible"); 25 test_valid_selector("::part(mypart):focus-within"); 26 test_valid_selector("::part(mypart):fullscreen"); 27 test_valid_selector("::part(mypart):future"); 28 test_valid_selector("::part(mypart):hover"); 29 test_valid_selector("::part(mypart):indeterminate"); 30 test_valid_selector("::part(mypart):in-range"); 31 test_valid_selector("::part(mypart):invalid"); 32 test_valid_selector("::part(mypart):lang(en)"); 33 test_valid_selector("::part(mypart):link"); 34 test_valid_selector("::part(mypart):modal"); 35 test_valid_selector("::part(mypart):open"); 36 test_valid_selector("::part(mypart):optional"); 37 test_valid_selector("::part(mypart):out-of-range"); 38 test_valid_selector("::part(mypart):past"); 39 test_valid_selector("::part(mypart):paused"); 40 test_valid_selector("::part(mypart):picture-in-picture"); 41 test_valid_selector("::part(mypart):placeholder-shown"); 42 test_valid_selector("::part(mypart):playing"); 43 test_valid_selector("::part(mypart):popover-open"); 44 test_valid_selector("::part(mypart):read-only"); 45 test_valid_selector("::part(mypart):read-write"); 46 test_valid_selector("::part(mypart):required"); 47 test_valid_selector("::part(mypart):state(mystate)"); 48 test_valid_selector("::part(mypart):target"); 49 test_valid_selector("::part(mypart):user-invalid"); 50 test_valid_selector("::part(mypart):user-valid"); 51 test_valid_selector("::part(mypart):valid"); 52 test_valid_selector("::part(mypart):visited"); 53 test_valid_selector("::part(mypart):xr-overlay"); 54 55 // Test that the @page pseudo-classes are not supported after ::part(). 56 test_invalid_selector("::part(mypart):left"); 57 test_invalid_selector("::part(mypart):right"); 58 test_invalid_selector("::part(mypart):first"); 59 60 // Test that structural pseudo-classes are not allowed after ::part(). 61 test_invalid_selector("::part(mypart):empty"); 62 test_invalid_selector("::part(mypart):first-child"); 63 test_invalid_selector("::part(mypart):first-of-type"); 64 test_invalid_selector("::part(mypart):last-child"); 65 test_invalid_selector("::part(mypart):last-of-type"); 66 test_invalid_selector("::part(mypart):nth-child(1)"); 67 test_invalid_selector("::part(mypart):nth-last-child(1)"); 68 test_invalid_selector("::part(mypart):nth-last-of-type(1)"); 69 test_invalid_selector("::part(mypart):nth-of-type(1)"); 70 test_invalid_selector("::part(mypart):only-child"); 71 test_invalid_selector("::part(mypart):only-of-type"); 72 73 // Test that pseudo-classes that match based on tree information are not allowed after ::part. 74 test_invalid_selector("::part(mypart):host"); 75 test_invalid_selector("::part(mypart):host-context(:hover)"); 76 test_invalid_selector("::part(mypart):has(p)"); 77 test_invalid_selector("::part(mypart):has(:hover)"); 78 test_invalid_selector("::part(mypart):scope"); 79 80 // Test that :not() applies appropriate constraints for being after ::part(), 81 // but that :is() and :where() (which accept <forgiving-selector-list>) do 82 // not. 83 // Note that the serialization behavior of the last two is as-resolved in 84 // https://github.com/w3c/csswg-drafts/issues/8356 but it doesn't appear to be 85 // specified yet. 86 test_valid_selector("::part(mypart):not(:hover)") 87 test_valid_selector("::part(mypart):is(:hover)") 88 test_valid_selector("::part(mypart):where(:hover)") 89 test_invalid_selector("::part(mypart):not(:first-child)") 90 test_valid_forgiving_selector("::part(mypart):is(:first-child)") 91 test_valid_forgiving_selector("::part(mypart):where(:first-child)") 92 93 </script>