소스 검색

LibWeb: Flexbox: Catch zero flex-basis and use width instead

A flex-basis of zero doesn't actually mean that the preferred size of
the particular Box is 0. It means that the Box should take the least
amount of space possible while still accomodating the content inside.

We catch and circumvent this now right when the flex-basis property gets
read for the FlexFormattingContext.

This isn't mentioned anywhere in the seemingly relevant portions of the
spec, however thanks to this answer https://stackoverflow.com/a/47579078
(which is not entirely correct about width either) lead to the behavior
that is wanted and used by other Browsers.
Tobias Christiansen 3 년 전
부모
커밋
1496ad0605
1개의 변경된 파일6개의 추가작업 그리고 5개의 파일을 삭제
  1. 6 5
      Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp

+ 6 - 5
Userland/Libraries/LibWeb/Layout/FlexFormattingContext.cpp

@@ -365,7 +365,11 @@ void FlexFormattingContext::run(Box& box, LayoutMode)
         auto flex_basis = child_box.computed_values().flex_basis();
         auto flex_basis = child_box.computed_values().flex_basis();
         if (flex_basis.type == CSS::FlexBasis::Length) {
         if (flex_basis.type == CSS::FlexBasis::Length) {
             // A
             // A
-            flex_item.flex_base_size = get_pixel_size(child_box, flex_basis.length);
+            auto specified_base_size = get_pixel_size(child_box, flex_basis.length);
+            if (specified_base_size == 0)
+                flex_item.flex_base_size = calculated_main_size(flex_item.box);
+            else
+                flex_item.flex_base_size = specified_base_size;
         } else if (flex_basis.type == CSS::FlexBasis::Content
         } else if (flex_basis.type == CSS::FlexBasis::Content
             && has_definite_cross_size(child_box)
             && has_definite_cross_size(child_box)
             // FIXME: && has intrinsic aspect ratio.
             // FIXME: && has intrinsic aspect ratio.
@@ -504,12 +508,9 @@ void FlexFormattingContext::run(Box& box, LayoutMode)
         for (auto& flex_item : flex_line.items) {
         for (auto& flex_item : flex_line.items) {
             if (flex_item->flex_factor.has_value() && flex_item->flex_factor.value() == 0) {
             if (flex_item->flex_factor.has_value() && flex_item->flex_factor.value() == 0) {
                 freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
                 freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
-            } else if (flex_item->flex_factor.has_value()) {
-                // FIXME: This isn't spec
-                continue;
             } else if (used_flex_factor == FlexFactor::FlexGrowFactor) {
             } else if (used_flex_factor == FlexFactor::FlexGrowFactor) {
                 // FIXME: Spec doesn't include the == case, but we take a too basic approach to calculating the values used so this is appropriate
                 // FIXME: Spec doesn't include the == case, but we take a too basic approach to calculating the values used so this is appropriate
-                if (flex_item->flex_base_size >= flex_item->hypothetical_main_size) {
+                if (flex_item->flex_base_size > flex_item->hypothetical_main_size) {
                     freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
                     freeze_item_setting_target_main_size_to_hypothetical_main_size(*flex_item);
                 }
                 }
             } else if (used_flex_factor == FlexFactor::FlexShrinkFactor) {
             } else if (used_flex_factor == FlexFactor::FlexShrinkFactor) {