When copying styles for layered capture, it's unclear what should happen with the overflow property and specifically with scrollbars. Should they be copied as content, or apply to the pseudo-element, or be ignored?

For clipping and visible, the model is pretty clear:

• If the overflow is clip, either explicitly or implicitly due to paint-containment, the pseudo-element should also clip and copy the overflow-clip-margin.
• If the overflow is visible, the pseudo-element should also have overflow: visible

The problem with scroll, is that the scroll position would change because the content of the group has a different layout size from the captured element, which only includes the scrollport.
An additional problem with auto, is that the scrollbar would disappear for the duration of the view transition and then re-appear.

Options:

1. Capture the scrollbar as part of the snapshot, and use overflow: clip. This is relatively simple, however will produce broken looking results when the element has either border-radius (which would now clip the scrollbar) or nested elements (which would now appear on top of the scrollbar).
2. Hide the scrollbar altogether, always use overflow: clip | visible. This is perhaps the simplest to understand, and developers who still want to capture the scrollbar can put the view-transition-name on the scrolling element's parent.
3. Don't paint the scrollbar, and pass the overflow as is. This might create a different visual when the animation starts because of changed scroll position, but arguably a changed scroll position is not a jarring visual change, and something that happens a lot anyway.
4. Same as 3, but resolve auto to either hidden or scroll: in that case the existence of the scrollbar would be preserved, but the position might change during the view transition.

I'm currently leaning towards (3) being that it's the most consistent with how other CSS properties work in layered capture mode.

Thoughts? @khushalsagar @fantasai @vmpstr @bramus @flackr