[css-display] Clarify element tree definition

[Loirooriol]

CSS Display says

CSS takes a source document, organized as a tree of elements and text nodes, and renders it onto a canvas

This is confusing because the source document is organized as a DOM tree of DOM nodes. Not just elements and text nodes.

As far as I know, the CSS element tree is derived from the DOM tree as follows:

• The root is the document element.
• All non-element and non-text nodes are removed.
• A ::before pseudo-element is inserted as the first child of each element node.
• An ::after pseudo-element is inserted as the last child of each element node.
• A ::marker pseudo-element is inserted at some places (to be exactly determined in [css-display][css-pseudo] Is ::marker created by display:list-item or does it always exist? #1793).

All of this should be properly defined in the spec.

[fantasai]

The existence and position of pseudo-elements in the tree is defined in Selectors L3 / CSS Pseudo-elements L4.

What aspects of the DOM are expected to be rendered is probably more a question for the DOM spec than for CSS: e.g. it should be their decision that child text nodes of elements should be rendered, but the contents of a comment node or processing instruction should not.

[fantasai]

CSS can in theory render all of it, but not being rendered is what makes a comment a comment--so that shouldn't be our decision.

[Loirooriol]

Well I don't mind if the decision of which CharacterData nodes should be rendered is deferred to the DOM spec. But I would like if all the algorithms for obtaining each tree from the previous one (DOM tree, flat tree, element tree, box tree, fragment tree) would be described in a single place. Possibly linking to some spec for details, like https://drafts.csswg.org/css-scoping/#flattening, which seems the only proper tree algorithm.

[css-meeting-bot]

The Working Group just discussed Clarify element tree definition, and agreed to the following:

• RESOLVED: Defer #1810 and #2365 to later

The full IRC log of that discussion

<dael> Topic: Clarify element tree definition
<dael> github: https://github.com//issues/1810
<dael> fantasai: Most information on how the DOM interaction is speced somewhere. It would be nice if we were more coherent and had an overview somewhere. But the interactions are defined so this is editorial issue
<dael> fantasai: I'm not sure what goes into display spec. We have to figure out how to fit all the parts together to make understandable.
<dael> fantasai: Proposal here is not to tackle that, but defer this and #2365 to later rather then block.
<dael> Rossen: Reasonable
<dael> Rossen: Other opinions?
<fantasai> s/I'm not sure what goes/I'm not even sure what parts go/
<dael> Rossen: Objections?
<dael> RESOLVED: Defer #1810 and #2365 to later