Node.js version
22.13.0
jsdom version
27.0.0
Minimal reproduction case
import { JSDOM } from 'jsdom'
const dom = new JSDOM(
`
<!DOCTYPE html>
<html lang="en">
<head>
</head>
<body>
<div id="shadow-root" style="visibility:hidden;"></div>
</body>
</html>
`
);
const window = dom.window;
const document = window.document;
document.addEventListener('load', async () => {
const shadowRoot = document.querySelector('#shadow-root').attachShadow({mode: 'open'});
shadowRoot.innerHTML =
`<div class="container">
<span class="shadow-element-with-inline-style" style="visibility:inherit;"></span>
</div>`
const innerEl = document.querySelector('#shadow-root').shadowRoot.querySelector('.shadow-element-with-inline-style');
console.log(window.getComputedStyle(innerEl).visibility); // visible
shadowRoot.innerHTML =
`<div class="container" style="visibility:hidden;">
<span class="shadow-element-with-inline-style" style="visibility:inherit;"></span>
</div>`
const innerEl2 = document.querySelector('#shadow-root').shadowRoot.querySelector('.shadow-element-with-inline-style');
console.log(window.getComputedStyle(innerEl2).visibility); // hidden
});How does similar code behave in browsers?
getComputedStyle API returns inherited value from all container ancestor types
What is the problem?
JSDom 26.1.0 returned directly set neutral style values (unset, inherit) and custom recursive implementation at least could make assumptions on inherited style values. Is it expected limitation that style dynamic retrieval should work correctly only in scope of document?
Node.js version
22.13.0
jsdom version
27.0.0
Minimal reproduction case
How does similar code behave in browsers?
getComputedStyleAPI returns inherited value from all container ancestor typesWhat is the problem?
JSDom 26.1.0 returned directly set neutral style values (unset, inherit) and custom recursive implementation at least could make assumptions on inherited style values. Is it expected limitation that style dynamic retrieval should work correctly only in scope of document?