location-pseudo-classes-in-has.html (946B)
1 <!DOCTYPE html> 2 <meta charset="utf-8" /> 3 <title>CSS Selectors Invalidation: location pseudo classes in :has() argument</title> 4 <link rel="author" title="Byungwoo Lee" href="blee@igalia.com"> 5 <link rel="help" href="https://drafts.csswg.org/selectors/#relational"> 6 <script src="/resources/testharness.js"></script> 7 <script src="/resources/testharnessreport.js"></script> 8 <style> 9 #parent1:has(:link) { color: green } 10 #parent1:has(:visited) { color: yellowgreen } 11 </style> 12 <div id=parent1> 13 <div>parent color must be blue with 14 <a id=link1 href="#unvisited">visited link</a> 15 </div> 16 </div> 17 <script> 18 test(() => { 19 history.replaceState({}, "", "#visited"); 20 21 assert_equals(getComputedStyle(parent1).color, "rgb(0, 128, 0)", 22 "parent should be green"); 23 24 link1.href = "#visited"; 25 26 assert_equals(getComputedStyle(parent1).color, "rgb(0, 128, 0)", 27 "parent should be still green"); 28 }); 29 </script>