[css-overflow] Viewport's overflow isn't propagated "from the first such child" <body> #12644
Description
https://drafts.csswg.org/css-overflow-3/#overflow-propagation
UAs must apply the
overflow-*values set on the root element to the viewport when the root element’sdisplayvalue is notnone. However, when the root element is an [HTML]<html>element (including XML syntax for HTML) whoseoverflowvalue isvisible(in both axes), and that element has as a child a<body>element whosedisplayvalue is also notnone, user agents must instead apply theoverflow-*values of the first such child element to the viewport.
<!DOCTYPE html>
<html style="border: solid; height: 200vh; margin: 1em">
<body style="overflow: hidden">
<script>
document.body.after(document.body.cloneNode());
document.body.style.display = "none";
</script>This produces a DOM like
The spec implies that we should skip the first <body> (since it has display: none) and then propagate overflow: hidden from the 2nd <body>.
However, all Blink, WebKit and Gecko agree: the viewport gets scrollbars. Only the 1st <body> child is capable of propagating its overflow.