css/css-position/position-absolute-crash-chrome-005.html

<!DOCTYPE html>
<title>CSS Position Absolute: Chrome crash</title>
<link rel="author" href="mailto:atotic@chromium.org">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<link rel="help" href="https://bugs.chromium.org/p/chromium/issues/detail?id=949222">
<meta name="assert" content="Dynamic containing block change does not crash">
<style>
  .container {
    position: relative;
  }
  .abs {
    position: absolute;
    width: 50px;
    height: 50px;
    background: green;
  }
  @keyframes slidein {
    from { transform: scaleX(0); }
    to   { transform: scaleX(1); }
  }
  .animate {
    animation: slidein 0.1s linear;
  }
  .boundary {
    overflow: hidden;
    width: 100px;
    height: 100px;
  }
</style>
<!-- LayoutNG currently does not support display:flex.
  Propagation of descendants across flex boundaries is error prone -->
<div id="one" class="container" style="">
  <div class="boundary">
    <div class="boundary">
      <div class="boundary">
        <div id="intermediate">
          <div class="abs"></div>
        </div>
      </div>
    </div>
  </div>
</div>
<script>
let t = async_test("Test passes if it does not crash");
let el = document.querySelector("#intermediate");
el.addEventListener("animationend", _ => {
  t.step(function() {
    document.body.offsetTop;
    assert_true(true, "test did not crash");
    t.done();
  })
});
el.classList.add("animate");
</script>