wpt / svg / extensibility / foreignObject / scroll-transform-nested-stacked-children.html

Status: FAIL | Duration: 9ms | Subtests: 0/1 | Open test on wpt.live | Open ref on wpt.live | wpt.fyi

/svg/extensibility/foreignObject/scroll-transform-nested-stacked-children.html

<!DOCTYPE html>
<title>foreignObject under scroll and transform, with nested stacked children</title>
<link rel="help" href="https://w3c.github.io/svgwg/svg2-draft/single-page.html#render-EstablishingStackingContex">
<link rel="match" href="scroll-transform-nested-stacked-children-ref.html">
<div style="height: 200px; overflow: scroll; background: white">
  <svg width="300" height="300">
    <g transform="translate(50, 50)">
      <foreignObject width="100" height="100">
        <div style="background: red; width: 100px; height: 100px; position: relative">
          <div style="background: green; width: 100px; height: 100px; position: relative"></div>
        </div>
      </foreignObject>
    </g>
  </svg>
</div>

/svg/extensibility/foreignObject/scroll-transform-nested-stacked-children-ref.html

<!DOCTYPE html>
<div style="height: 200px; overflow: scroll; background: white">
  <div style="display: inline-block; width: 300px; height: 300px">
    <div style="background: green; width: 100px; height: 100px; position: relative; top: 50px; left: 50px"></div>
  </div>
</div>