| <!DOCTYPE html> |
| <div id="v1host"><a href="#">Should be red</a></div> |
| <div id="v0host"></div> |
| <script> |
| const v1root = v1host.attachShadow({mode: 'open'}); |
| v1root.innerHTML = ` |
| <style> |
| ::slotted(*) { |
| background: red; |
| } |
| </style> |
| <slot></slot> |
| `; |
| |
| // Foce style recalc. |
| document.body.offsetTop; |
| |
| // The following DOM/Style modification has to be done after the style |
| // for v1host/v1root is resolved to reproduce the issue. |
| |
| // Turns Document.MayContainV0Shadow() flag on. |
| const v0root = v0host.createShadowRoot(); |
| // Force style recalc on the v1host/v1root. |
| const new_style = document.createElement('style'); |
| new_style.textContent = 'div { color: green; }'; |
| document.head.appendChild(new_style); |
| v0root.innerHTML = '<div>Should be green</div>'; |
| </script> |