[line-clamp] Hide from paint non-fixed-height abspos after clamp

With the `continue: collapse` variant of `line-clamp`, absolutely positioned boxes that are after the clamp point in the layout tree should be hidden from paint. However, abspos with an indefinite block size were not always being hidden. The reason for this was that for such abspos, `OutOfFlowLayoutPart::CalculateOffset` performs an initial layout, which can end up becoming the final layout of the abspos, which does not happen for the fixed-height abspos that we had tested previously. As it turns out, that layout was not checking the `NodeInfo`'s `is_hidden_for_paint` field to determine whether to hide the fragment. This change fixes that. Bug: 40336192 Change-Id: I5876c762d0d9957ea5785660c73528b83de99eb9 Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/5923076 Reviewed-by: Ian Kilpatrick <ikilpatrick@chromium.org> Commit-Queue: Andreu Botella <abotella@igalia.com> Cr-Commit-Position: refs/heads/main@{#1367195}
web-platform-tests · Oct 10, 2024 · 0ca2856 · 0ca2856
1 parent 7e947c8
commit 0ca2856
Showing 1 changed file with 30 additions and 0 deletions.
diff --git a/css/css-overflow/line-clamp/line-clamp-with-abspos-014.tentative.html b/css/css-overflow/line-clamp/line-clamp-with-abspos-014.tentative.html
@@ -0,0 +1,30 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Overflow: abspos in line-clamp after clamp point</title>
+<link rel="author" title="Andreu Botella" href="mailto:abotella@igalia.com">
+<link rel="help" href="https://drafts.csswg.org/css-overflow-4/#line-clamp">
+<link rel="match" href="reference/webkit-line-clamp-005-ref.html">
+<meta name="assert" content="Absolute positioned boxes in an inline formatting context inside a line-clamp container are always hidden if they are in the box tree after the clamp point. This test specifically tests that this is the case even when they don't have a set height.">
+<style>
+.clamp {
+  line-clamp: 4;
+  font: 16px / 32px serif;
+  padding: 0 4px;
+  white-space: pre;
+  background-color: yellow;
+}
+.abspos {
+  position: absolute;
+  right: 0;
+  width: 100px;
+  /* No height! */
+  margin: 4px;
+  white-space: normal;
+  background-color: red;
+}
+</style>
+<div class="clamp">Line 1
+Line 2
+Line 3
+Line 4
+<div class="abspos">This abspos shouldn't be visible</div>Line 5</div>