WebKit handles text layout inconsistently depending on list-style-type

alanbaradlay · alanbaradlay · commit 2062ed738886 · 2025-12-26T08:21:06.000-08:00
https://bugs.webkit.org/show_bug.cgi?id=302099 <rdar://problem/164650313> Reviewed by Antti Koivisto. Outside list markers should not contribute to the min/max width (they are not even supposed to be here in IFC.) Test: fast/lists/list-marker-outside-inside-flex-item.html * LayoutTests/fast/lists/list-marker-outside-inside-flex-item-expected.html: Added. * LayoutTests/fast/lists/list-marker-outside-inside-flex-item.html: Added. * Source/WebCore/layout/formattingContexts/inline/IntrinsicWidthHandler.cpp: (WebCore::Layout::IntrinsicWidthHandler::computedIntrinsicWidthForConstraint): Canonical link: https://commits.webkit.org/304947@main
diff --git a/LayoutTests/fast/lists/list-marker-outside-inside-flex-item-expected.html b/LayoutTests/fast/lists/list-marker-outside-inside-flex-item-expected.html
@@ -0,0 +1,19 @@
+<style>
+.flexBox {
+  font-family: Ahem;
+  font-size: 20px;
+  outline: 1px solid green;
+  width: 20px;
+}
+</style>
+<ul>
+  <li>
+    <div class=flexBox>X</div>
+  </li>
+</ul>
+
+<ul>
+  <li>
+    <div class=flexBox style="margin-left: 8px">X</div>
+  </li>
+</ul>
diff --git a/LayoutTests/fast/lists/list-marker-outside-inside-flex-item.html b/LayoutTests/fast/lists/list-marker-outside-inside-flex-item.html
@@ -0,0 +1,23 @@
+<style>
+.flexBox {
+  display: flex;
+  justify-content: center;
+
+  font-family: Ahem;
+  font-size: 20px;
+  outline: 1px solid green;
+  width: 20px;
+}
+</style>
+<!-- PASS if black box is enclosed by green outline -->
+<ul>
+  <li>
+    <div class=flexBox>X</div>
+  </li>
+</ul>
+
+<ul>
+  <li>
+    <div class=flexBox style="margin-left: 8px">X</div>
+  </li>
+</ul>
diff --git a/Source/WebCore/layout/formattingContexts/inline/IntrinsicWidthHandler.cpp b/Source/WebCore/layout/formattingContexts/inline/IntrinsicWidthHandler.cpp
@@ -202,7 +202,15 @@ InlineLayoutUnit IntrinsicWidthHandler::computedIntrinsicWidthForConstraint(Intr
             return InlineLayoutUnit { leftWidth + rightWidth };
         };
 
-        auto lineContentLogicalWidth = lineLayoutResult.lineGeometry.logicalTopLeft.x() + lineLayoutResult.contentGeometry.logicalWidth + floatContentWidth();
+        auto lineContentLogicalWidth = [&] {
+            auto contentWidth = lineLayoutResult.lineGeometry.logicalTopLeft.x() + lineLayoutResult.contentGeometry.logicalWidth + floatContentWidth();
+            if (lineLayoutResult.runs.isEmpty())
+                return contentWidth;
+            auto& leadingRun = lineLayoutResult.runs.first();
+            if (leadingRun.isListMarkerOutside())
+                contentWidth -= leadingRun.logicalRight();
+            return contentWidth;
+        }();
         maximumContentWidth = std::max(maximumContentWidth, lineContentLogicalWidth);
         contentWidthBetweenLineBreaks.current += (lineContentLogicalWidth + lineLayoutResult.hangingContent.logicalWidth);
         if (lineLayoutResult.endsWithLineBreak())
