| OLD | NEW |
| (Empty) | |
| 1 <!DOCTYPE html> |
| 2 <script src="../resources/testharness.js"></script> |
| 3 <script src="../resources/testharnessreport.js"></script> |
| 4 <script src="resources/shadow-dom.js"></script> |
| 5 |
| 6 <style> |
| 7 ::slotted(.red) { color: red; } |
| 8 div { color: green; } |
| 9 </style> |
| 10 |
| 11 <slot> |
| 12 <div id="red" class="red">Red Fallback Content</div> |
| 13 <div id="green">Other Fallback Content</div> |
| 14 </slot> |
| 15 |
| 16 <script> |
| 17 'use strict'; |
| 18 |
| 19 test(() => { |
| 20 const redDiv = document.querySelector('#red'); |
| 21 const otherDiv = document.querySelector('#green'); |
| 22 |
| 23 assert_equals(window.getComputedStyle(redDiv).color, 'rgb(255, 0, 0)', |
| 24 '::slotted() applies to fallback content.'); |
| 25 assert_equals(window.getComputedStyle(otherDiv).color, 'rgb(0, 128, 0)', |
| 26 'non-::slotted() selector should match fallback content.'); |
| 27 }, '::slotted() should apply to fallback content in document tree.'); |
| 28 </script> |
| OLD | NEW |