mirror of
https://github.com/LadybirdBrowser/ladybird
synced 2026-05-01 20:17:13 +02:00
928a5247ff
Avoid broad document invalidation when adding or removing ordinary document-owned or shadow-owned stylesheets. Reuse the targeted StyleSheetInvalidation path for style rules, including shadow-host escapes, pseudo-element-only selectors, and trailing-universal cases. Keep the broad path for sheet contents whose effects are not captured by selector invalidation alone, including @property, @font-face, @font-feature-values, @keyframes, imported sheets, and top-level @layer blocks. Broad-path shadow-root sheets still reach host-side consumers through their active-scope effects.
25 lines
881 B
HTML
25 lines
881 B
HTML
<!DOCTYPE html>
|
|
<script src="../include.js"></script>
|
|
<div id="host"><span id="child">child</span></div>
|
|
<script>
|
|
test(() => {
|
|
const host = document.getElementById("host");
|
|
const child = document.getElementById("child");
|
|
const shadowRoot = host.attachShadow({ mode: "open" });
|
|
const sheet = new CSSStyleSheet();
|
|
|
|
shadowRoot.adoptedStyleSheets = [sheet];
|
|
|
|
println(`before replaceSync: ${getComputedStyle(child).color}`);
|
|
|
|
sheet.replaceSync(":host { color: rgb(255, 0, 0); }");
|
|
println(`after red replaceSync: ${getComputedStyle(child).color}`);
|
|
|
|
sheet.replaceSync(":host { color: rgb(0, 0, 255); }");
|
|
println(`after blue replaceSync: ${getComputedStyle(child).color}`);
|
|
|
|
sheet.replaceSync("");
|
|
println(`after empty replaceSync: ${getComputedStyle(child).color}`);
|
|
});
|
|
</script>
|