[css-cascade] [css-scoping] [cssom] What should getComputedStyle return for an element which isn't in the flat tree?

[emilio]

I believe implementations now just make it inherit from the default style, but that's not intuitive either, and in any case it's not specced, but should be.

[emilio]

I guess this affects a few more specs.

CSS Cascade says in https://drafts.csswg.org/css-cascade/#inheriting:

Inheritance propagates property values from parent elements to their children. The inherited value of a property on an element is the computed value of the property on the element’s parent element. For the root element, which has no parent element, the inherited value is the initial value of the property.

But there's no mention to the flattened tree anywhere in that spec.

CSS Scoping says in https://drafts.csswg.org/css-scoping/#shadow-gloss:

However, the shadow tree, when it exists, is used in the construction of the flattened element tree, which CSS uses for all purposes after Selectors (including inheritance and box construction).

[FremyCompany]

Merging with #1548

[emilio]

@FremyCompany I think this is not a dupe of that. A detached subree is not the same as an element which is not on the flat tree.

An element which is part of a document tree but not of the flat tree would be an unassigned child of a shadow host.

Could you reopen, o clarify in #1548 that this is also going to be addressed in there? (I don't have the permission).

Thanks!

[FremyCompany]

Cross-posting from 1548:

An element assigned to a slot doesn't inherit from the shadow host, but from the assigned slot. There's no spec that defines that in case it's not assigned to any slot it should inherit from the host, afaict.

Ah, that should probably be added then; more than likely it's just an oversight. Using their parent's style is the closest approximation of the behavior that would happen whenever it gets slotted, so that looks reasonable to me.

[AmeliaBR]

A comparison could be made to SVG <symbol> and <defs> children, which are never rendered directly. When the element is cloned into a use-element shadow tree, the clone inherits from that context. But the original DOM elements can still have matched & inherited styles (based on its DOM tree parents), even if they are never used because the element isn't rendered. I think all browsers now calculate styles in that case -- although Firefox used to be (maybe still is) buggy, treating them as detached elements.