[LayoutNG] Block-size % resolution inside columns for OOF elements

In CL:2412728, percentage block-size was updated to resolve against
the computed content-box block-size of the multicol container (not
the columns).

This change makes the same change for the OOF fragmented descendants.
Because the multi-col isn't the container of the OOF, updating this
doesn't have an affect on OOF percentage resolution.

Rather, the containing block for the OOF element will be used for
percentage resolution. This, however, was also broken because we were
using the block size of a single containing block fragment rather than
the total block size of the containing block.

To fix this, we now use the LayoutBox of the containing block to
calculate the total consumed block size in order to get the correct
percentage resolution size for OOF elements.

Bug: 1079031
Change-Id: If584de09a7611ad8b8d4afc5c8205adf159ee7fb
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2422705Reviewed-by: Benjamin Beaudry <benjamin.beaudry@microsoft.com>
Reviewed-by: Morten Stenshorne <mstensho@chromium.org>
Commit-Queue: Morten Stenshorne <mstensho@chromium.org>
Cr-Commit-Position: refs/heads/master@{#811616}

third_party/blink/renderer/core/layout/ng/layout_box_utils.cc

@@ -13,6 +13,7 @@
 #include "third_party/blink/renderer/core/layout/ng/ng_box_fragment_builder.h"
 #include "third_party/blink/renderer/core/layout/ng/ng_constraint_space_builder.h"
 #include "third_party/blink/renderer/core/layout/ng/ng_length_utils.h"
+#include "third_party/blink/renderer/core/layout/ng/ng_physical_box_fragment.h"
 #include "third_party/blink/renderer/core/paint/paint_layer.h"
 
 namespace blink {
@@ -170,4 +171,33 @@ bool LayoutBoxUtils::SkipContainingBlockForPercentHeightCalculation(
   return LayoutBox::SkipContainingBlockForPercentHeightCalculation(cb);
 }
 
+LayoutUnit LayoutBoxUtils::TotalBlockSize(const LayoutBox& box) {
+  wtf_size_t num_fragments = box.PhysicalFragmentCount();
+  DCHECK_GT(num_fragments, 0u);
+
+  // Calculate the total block size by looking at the last two block fragments
+  // with a non-zero block-size.
+  LayoutUnit total_block_size;
+  while (num_fragments > 0) {
+    LayoutUnit block_size =
+        box.GetPhysicalFragment(num_fragments - 1)
+            ->Size()
+            .ConvertToLogical(box.StyleRef().GetWritingMode())
+            .block_size;
+    if (block_size > LayoutUnit()) {
+      total_block_size += block_size;
+      break;
+    }
+    num_fragments--;
+  }
+
+  if (num_fragments > 1) {
+    total_block_size +=
+        To<NGBlockBreakToken>(
+            box.GetPhysicalFragment(num_fragments - 2)->BreakToken())
+            ->ConsumedBlockSize();
+  }
+  return total_block_size;
+}
+
 }  // namespace blink

third_party/blink/renderer/core/layout/ng/layout_box_utils.h

@@ -38,6 +38,9 @@ class LayoutBoxUtils {
 
   static bool SkipContainingBlockForPercentHeightCalculation(
       const LayoutBlock* cb);
+
+  // The total block size of all fragments.
+  static LayoutUnit TotalBlockSize(const LayoutBox& box);
 };
 
 }  // namespace blink

third_party/blink/renderer/core/layout/ng/ng_container_fragment_builder.cc

@@ -87,8 +87,8 @@ void NGContainerFragmentBuilder::PropagateChildData(
             descendant.static_position.ConvertToLogical(empty_outer_size);
         oof_positioned_fragmentainer_descendants_.emplace_back(
             descendant.node, static_position, descendant.inline_container,
-            /* needs_block_offset_adjustment */ false,
-            containing_block_offset, containing_block_fragment);
+            /* needs_block_offset_adjustment */ false, containing_block_offset,
+            containing_block_fragment);
       }
     }
   }

third_party/blink/renderer/core/layout/ng/ng_out_of_flow_layout_part.cc

@@ -310,6 +310,9 @@ NGOutOfFlowLayoutPart::GetContainingBlockInfo(
     const ComputedStyle& style = containing_block->StyleRef();
     LogicalSize size = containing_block_fragment->Size().ConvertToLogical(
         style.GetWritingMode());
+    size.block_size =
+        LayoutBoxUtils::TotalBlockSize(*ToLayoutBox(containing_block));
+
     const NGPhysicalBoxFragment* fragment =
         To<NGPhysicalBoxFragment>(containing_block_fragment);
 
@@ -1185,8 +1188,9 @@ const NGConstraintSpace& NGOutOfFlowLayoutPart::GetFragmentainerConstraintSpace(
     column_size.block_size = column_size.block_size.ClampNegativeToZero();
   }
 
-  // TODO(layout-dev): Calculate correct percentage resolution size.
-  LogicalSize percentage_resolution_size = column_size;
+  LogicalSize percentage_resolution_size =
+      LogicalSize(column_size.inline_size,
+                  container_builder_->ChildAvailableSize().block_size);
 
   // TODO(bebeaudr): Need to handle different fragmentation types. It won't
   // always be multi-column.

third_party/blink/renderer/core/layout/ng/ng_out_of_flow_layout_part_test.cc

@@ -1138,5 +1138,114 @@ TEST_F(NGOutOfFlowLayoutPartTest, AbsposFragWithSpannerAndNewEmptyColumns) {
   EXPECT_EQ(expectation, dump);
 }
 
+// Fragmented OOF element with block-size percentage resolution.
+TEST_F(NGOutOfFlowLayoutPartTest, AbsposFragmentationPctResolution) {
+  SetBodyInnerHTML(
+      R"HTML(
+      <style>
+        #multicol {
+          column-count:2; column-fill:auto; column-gap:16px; height:40px;
+        }
+        .rel {
+          position: relative; width:30px;
+        }
+        .abs {
+          position:absolute; top:30px; width:5px; height:100%;
+        }
+        .spanner {
+          column-span:all; height:25%;
+        }
+      </style>
+      <div id="container">
+        <div id="multicol">
+          <div class="rel">
+            <div class="abs"></div>
+            <div style="width: 10px; height:30px;"></div>
+          </div>
+          <div class="spanner"></div>
+        </div>
+      </div>
+      )HTML");
+  String dump = DumpFragmentTree(GetElementById("container"));
+
+  String expectation = R"DUMP(.:: LayoutNG Physical Fragment Tree ::.
+  offset:unplaced size:1000x40
+    offset:0,0 size:1000x40
+      offset:0,0 size:492x15
+        offset:0,0 size:30x15
+          offset:0,0 size:10x15
+      offset:508,0 size:492x15
+        offset:0,0 size:30x15
+          offset:0,0 size:10x15
+      offset:0,15 size:1000x10
+      offset:0,25 size:492x15
+        offset:0,0 size:5x15
+      offset:508,25 size:492x15
+        offset:0,0 size:5x15
+)DUMP";
+  EXPECT_EQ(expectation, dump);
+}
+
+// Fragmented OOF element with block-size percentage resolution and overflow.
+TEST_F(NGOutOfFlowLayoutPartTest,
+       AbsposFragmentationPctResolutionWithOverflow) {
+  SetBodyInnerHTML(
+      R"HTML(
+      <style>
+        #multicol {
+          columns:5; column-fill:auto; column-gap:0px; height:100px;
+        }
+        .rel {
+          position: relative; width:55px;
+        }
+        .abs {
+          position:absolute; top:0px; width:5px; height:100%;
+        }
+      </style>
+      <div id="container">
+        <div id="multicol">
+          <div style="height:30px;"></div>
+          <div class="rel">
+            <div class="abs"></div>
+            <div style="width:44px; height:200px;">
+              <div style="width:33px; height:400px;"></div>
+            </div>
+          </div>
+        </div>
+      </div>
+      )HTML");
+  String dump = DumpFragmentTree(GetElementById("container"));
+
+  String expectation = R"DUMP(.:: LayoutNG Physical Fragment Tree ::.
+  offset:unplaced size:1000x100
+    offset:0,0 size:1000x100
+      offset:0,0 size:200x100
+        offset:0,0 size:200x30
+        offset:0,30 size:55x70
+          offset:0,0 size:44x70
+            offset:0,0 size:33x70
+        offset:0,30 size:5x70
+      offset:200,0 size:200x100
+        offset:0,0 size:55x100
+          offset:0,0 size:44x100
+            offset:0,0 size:33x100
+        offset:0,0 size:5x100
+      offset:400,0 size:200x100
+        offset:0,0 size:55x30
+          offset:0,0 size:44x30
+            offset:0,0 size:33x100
+        offset:0,0 size:5x30
+      offset:600,0 size:200x100
+        offset:0,0 size:55x0
+          offset:0,0 size:44x0
+            offset:0,0 size:33x100
+      offset:800,0 size:200x100
+        offset:0,0 size:55x0
+          offset:0,0 size:44x0
+            offset:0,0 size:33x30
+)DUMP";
+  EXPECT_EQ(expectation, dump);
+}
+
 }  // namespace
 }  // namespace blink