[GridNG] Disable first tier OOF cache for grid

Grid allows for out-of-flow items to be placed in grid areas, which will impact their size and position. This doesn't work well with the first tier OOF cache, as any changes to the grid can will be out of sync with the first tier OOF cache. The fix here is to disable the first tier OOF cache for grid. Bug: 1247052 Change-Id: I6aa61df23c62de66849c87f7204e598804f99a50 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3150665 Commit-Queue: Kurt Catti-Schmidt <[email protected]> Reviewed-by: Ian Kilpatrick <[email protected]> Cr-Commit-Position: refs/heads/main@{#920037}
web-platform-tests · Sep 10, 2021 · d7554a0 · d7554a0
1 parent 5060914
commit d7554a0
Show file tree

Hide file tree

Showing 2 changed files with 54 additions and 0 deletions.
diff --git a/css/css-grid/abspos/grid-positioned-item-dynamic-change-006-ref.html b/css/css-grid/abspos/grid-positioned-item-dynamic-change-006-ref.html
@@ -0,0 +1,19 @@
+<!DOCTYPE html>
+<html lang=en>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Grid positioned item dynamic change.</title>
+<link rel="help" href="https://drafts.csswg.org/css-grid-2/#abspos">
+<style>
+.reference {
+  display: grid;
+  background: green;
+  width: 100px;
+  height: 100px;
+}
+</style>
+<body>
+<p>Test passes if it matches the reference.</p>
+<div class="reference">
+</div>
+</body>
+</html>
diff --git a/css/css-grid/abspos/grid-positioned-item-dynamic-change-006.html b/css/css-grid/abspos/grid-positioned-item-dynamic-change-006.html
@@ -0,0 +1,35 @@
+<!DOCTYPE html>
+<html lang=en>
+<meta charset="utf-8">
+<title>CSS Grid Layout Test: Grid positioned item dynamic change.</title>
+<link rel="help" href="https://drafts.csswg.org/css-grid-2/#abspos">
+<link rel="match" href="grid-positioned-item-dynamic-change-006-ref.html">
+<meta name="assert" content="This test checks that positioned items update upon dynamic changes.">
+<style>
+.absolute {
+  background: green;
+  position: absolute;
+  grid-row: 2 / 3;
+  grid-column: 1 / 2;
+  top: 0;
+  bottom: 0;
+  right: 0;
+  left: 0;
+}
+</style>
+<body>
+<p>Test passes if it matches the reference.</p>
+<div style="display: grid; position: relative; width: 100px;">
+  <div style="background: green;">
+    <div id="target"></div>
+  </div>
+  <div style="background: red; height: 25px;"></div>
+  <div class="absolute"></div>
+</div>
+<script>
+document.body.offsetTop;
+document.getElementById('target').style.height = '75px';
+document.documentElement.classList.remove('reftest-wait');
+</script>
+</body>
+</html>