grid-with-block-constraints-dependence.html

<!DOCTYPE html>
<script src="../resources/runner.js"></script>
<div id=c1 style="display: grid; grid-template: auto / 1fr;">
  <div id=c2 style="display: grid; grid-template: auto / 1fr;">
    <div id=c3 style="display: grid; grid-template: auto auto / 1fr;">
      <div id="target" style="display: grid; height: 100px;"></div>
      <div id=i1 style="display: grid;">
        <div id=i2 style="display: grid;">
          <div id=i3 style="width: 100%; height: 100%;">
            <canvas id=i4 width=50 height=50 style="width: 100%; height: 100%;"></canvas>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
<script>
PerfTestRunner.measureRunsPerSecond({
    description: 'Layout of nested grid with a replaced element dependant on block-constraints.',
    run: () => {
      document.getElementById('target').innerText = 'text';
      PerfTestRunner.forceLayout();
      document.getElementById('target').innerText = '';
      PerfTestRunner.forceLayout();
    },
});
</script>

chromium/third_party/blink/perf_tests/layout/grid-with-block-constraints-dependence.html