[css-contain-2] Specify that the first content-visibility: auto visibility check happens immediately

[vmpstr]

When a new content-visibility: auto element is added, the check to determine
its visibility needs to occur in the same frame to avoid a flash of blank content.

This PR adds a clarification to this effect.

[vmpstr]

/cc @tabatkins @chrishtr

[chrishtr]

What about nested content-visibility: auto ?

[vmpstr]

Hmm. I think this is a good question. I would say that the wording stands: if the nested auto is the first time we're evaluating visibility then it should happen in the same frame.

The problem here is that we want to avoid a flash of blank. It's different if this was off-screen and then enters the screen in which case there are other mechanisms to prevent the flash (margin)

WDYT?

[chrishtr]

Right now your implementation uses a loop in the update-the-rendering steps that is equivalent to a ResizeObserver, but stops after one loop. To implement the semantics you're suggesting we'd have to have a loop like this:

while (true) {
  updateStyleAndLayout();
  if (!thereAreNewlyDiscoveredContentVisibilityAutoElements())
    break;
  deliverIntersectionObservationsToNewlyDiscoveredContentVisibilityAutoElements();
}

As implemented above this will have at most as many while loops as there are nestings incontent-visibility: auto.

I think this is fine actually; the looping semantics and code structure are exactly the same as ResizeObserver, except the observer is a special sync-on-first-frame IntersectionObserver callback. (Note that ResizeObserver also has a don't-infinite-loop requirement that it goes deeper into the DOM on each while loop iteration, which is similar to the invariant above about nested content-visibility:auto.)

[vmpstr]

Yeah, that's pretty much the intent (and how it works in Chrome)

@tabatkins do you mind taking a quick look as well?

[tabatkins]

This seems fine to me from a spec perspective; the detail of implementation there is above me.

[tabatkins]

This seems fine to me from a spec perspective; the detail of implementation there is above me.

[frivoal]

resolution to accept this change recorded here: https://logs.csswg.org/irc.w3.org/css/2020-12-16/#e1381652