wpt / svg / geometry / svg-get-bounding-client-rect-in-non-rendered-elements.html

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

TestTest Source

/svg/geometry/svg-get-bounding-client-rect-in-non-rendered-elements.html

<!DOCTYPE html>
<title>Get Bounding Client Rect in Non-Rendered SVG elements</title>
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link rel="author" title="Divyansh Mangal" href="mailto:dmangal@microsoft.com">
<svg width="100" height="20">
  <g display="none">
    <rect id="rect1" width="10" height="10" />
  </g>
  <symbol id="symbol" width="10" height="10">
    <rect id="rect2" display="none" width="10" height="10" />
  </symbol>
  <g>
    <rect id="rect3" display="none" width="10" height="10" />
  </g>
  <defs>
    <rect id="rect4" width="10" height="10" />
  </defs>
  <pattern>
    <rect id="rect5" width="10" height="10" />
  </pattern>
  <g>
    <rect id="rect6" width="10" height="10" />
  </g>
  <g id="g1">
    <rect x="5" y="5" width="10" height="10"/>
    <g>
      <rect x="20" y="20" width="30" height="30" fill="none"/>
    </g>
  </g>
</svg>
<script>
  let rect1 = document.getElementById("rect1"),
    rect2 = document.getElementById("rect2"),
    rect3 = document.getElementById("rect3"),
    rect4 = document.getElementById("rect4");
    rect5 = document.getElementById("rect5"),
    rect6 = document.getElementById("rect6"),
    symbol = document.getElementById("symbol"),
    g1 = document.getElementById("g1");

  test(function () {
    assert_equals(rect1.getBoundingClientRect().width, 0, "rect1");
    assert_equals(rect2.getBoundingClientRect().width, 0, "rect2");
    assert_equals(rect3.getBoundingClientRect().width, 0, "rect3");
    assert_equals(rect4.getBoundingClientRect().width, 0, "rect4");
    assert_equals(rect5.getBoundingClientRect().width, 0, "rect5");
    assert_equals(rect6.getBoundingClientRect().width, 10, "rect6");
    assert_equals(symbol.getBoundingClientRect().width, 0, "symbol");
    assert_equals(g1.getBoundingClientRect().width, 45, "g1");

    assert_equals(rect1.getBoundingClientRect().height, 0, "rect1");
    assert_equals(rect2.getBoundingClientRect().height, 0, "rect2");
    assert_equals(rect3.getBoundingClientRect().height, 0, "rect3");
    assert_equals(rect4.getBoundingClientRect().height, 0, "rect4");
    assert_equals(rect5.getBoundingClientRect().height, 0, "rect5");
    assert_equals(rect6.getBoundingClientRect().height, 10, "rect6");
    assert_equals(symbol.getBoundingClientRect().height, 0, "symbol");
    assert_equals(g1.getBoundingClientRect().height, 45, "g1");
  }, "Get Bounding Client Rect");
</script>