Repository: LadybirdBrowser/ladybird
File: Libraries/LibWeb/Layout/BlockFormattingContext.cpp (C++)

Code before:
    }

    place_block_level_element_in_normal_flow_vertically(box, y + margin_top);

    compute_width(box, available_space);
    avoid_float_intrusions(box, available_space);

    place_block_level_element_in_normal_flow_horizontally(box, available_space);

    AvailableSpace available_space_for_height_resolution = available_space;
    auto is_grid_or_flex_container = box.display().is_grid_inside() || box.display().is_flex_inside();
    auto is_table_box = box.display().is_table_row() || box.display().is_table_row_group() || box.display().is_table_header_group() || box.display().is_table_footer_group() || box.display().is_table_cell() || box.display().is_table_caption();
    // NOTE: Spec doesn't mention this but quirk application needs to be skipped for grid and flex containers.
    //       See https://github.com/w3c/csswg-drafts/issues/5545
    if (box.document().in_quirks_mode() && box.computed_values().height().is_percentage() && !is_table_box && !is_grid_or_flex_container) {
        // In quirks mode, for the purpose of calculating the height of an element, if the
        // computed value of the position property of element is relative or static, the specified value
        // for the height property of element is a <percentage>, and element does not have a computed
        // value of the display property that is table-row, table-row-group, table-header-group,
        // table-footer-group, table-cell or table-caption, the containing block of element must be
        // calculated using the following algorithm, aborting on the first step that returns a value:
        auto height = containing_block_height_to_resolve_percentage_in_quirks_mode(box, m_state);
        available_space_for_height_resolution.height = AvailableSize::make_definite(height);
    }

    resolve_used_height_if_not_treated_as_auto(box, available_space_for_height_resolution);

    // NOTE: Flex containers with `auto` height are treated as `max-content`, so we can compute their height early.
    if (box.is_replaced_box() || box.display().is_flex_inside()) {
        resolve_used_height_if_treated_as_auto(box, available_space_for_height_resolution);
    }

    // This monster basically means: "a ListItemBox that does not have specified content in the ::marker pseudo-element".
    // This happens for ::marker with content 'normal'.
    bool is_list_item_box_without_css_content = is<ListItemBox>(box) && (!(box.dom_node() && box.dom_node()->is_element() && static_cast<DOM::Element const*>(box.dom_node())->computed_properties(CSS::PseudoElement::Marker)->property(CSS::PropertyID::Content).is_content()));

    // Before we insert the children of a list item we need to know the location of the marker.
    // If we do not do this then left-floating elements inside the list item will push the marker to the right,
    // in some cases even causing it to overlap with the non-floating content of the list.
    CSSPixels left_space_before_children_formatted;
    if (is_list_item_box_without_css_content)
        if (auto const* li_box = as_if<ListItemBox>(box)) {
            // We need to ensure that our height and width are final before we calculate our left offset.
            // Otherwise, the y at which we calculate the intrusion by floats might be incorrect.
            ensure_sizes_correct_for_left_offset_calculation(*li_box);

            auto const& list_item_state = m_state.get(*li_box);
            auto const& marker_state = m_state.get(*li_box->marker());

            auto offset_y = max(CSSPixels(0), (li_box->marker()->computed_values().line_height() - marker_state.content_height()) / 2);
            auto space_used_before_children_formatted = intrusion_by_floats_into_box(list_item_state, offset_y);

Review comment (refactor):
it seems you’re using `is<ListItemBox>(box)` below in form of `auto const* li_box = as_if<ListItemBox>(box)`. maybe it’d be better to start with that here and use below, and define `is_list_item_box_without_css_content` in terms of `li_box`? (i guess that you can also assume, that `dom_node()` return value exists, all these would probably significantly simplify this “monster” as you call it.)

Code after:
    // NOTE: Spec doesn't mention this but quirk application needs to be skipped for grid and flex containers.
    //       See https://github.com/w3c/csswg-drafts/issues/5545
    if (box.document().in_quirks_mode() && box.computed_values().height().is_percentage() && !is_table_box && !is_grid_or_flex_container) {
        // In quirks mode, for the purpose of calculating the height of an element, if the
        // computed value of the position property of element is relative or static, the specified value
        // for the height property of element is a <percentage>, and element does not have a computed
        // value of the display property that is table-row, table-row-group, table-header-group,
        // table-footer-group, table-cell or table-caption, the containing block of element must be
        // calculated using the following algorithm, aborting on the first step that returns a value:
        auto height = containing_block_height_to_resolve_percentage_in_quirks_mode(box, m_state);
        available_space_for_height_resolution.height = AvailableSize::make_definite(height);
    }

    resolve_used_height_if_not_treated_as_auto(box, available_space_for_height_resolution);

    // NOTE: Flex containers with `auto` height are treated as `max-content`, so we can compute their height early.
    if (box.is_replaced_box() || box.display().is_flex_inside()) {
        resolve_used_height_if_treated_as_auto(box, available_space_for_height_resolution);
    }

    // This monster basically means: "a ListItemBox that does not have specified content in the ::marker pseudo-element".
    // This happens for ::marker with content 'normal'.
    // FIXME: We currently so not support ListItemBox-es generated by pseudo-elements. We will need to, eventually.
    ListItemBox const* li_box = as_if<ListItemBox>(box);
    bool is_list_item_box_without_css_content = li_box && (!(box.dom_node() && box.dom_node()->is_element() && as_if<DOM::Element const>(box.dom_node())->computed_properties(CSS::PseudoElement::Marker)->property(CSS::PropertyID::Content).is_content()));

    // Before we insert the children of a list item we need to know the location of the marker.
    // If we do not do this then left-floating elements inside the list item will push the marker to the right,
    // in some cases even causing it to overlap with the non-floating content of the list.
    CSSPixels left_space_before_children_formatted;
    if (is_list_item_box_without_css_content) {
        // We need to ensure that our height and width are final before we calculate our left offset.
        // Otherwise, the y at which we calculate the intrusion by floats might be incorrect.
        ensure_sizes_correct_for_left_offset_calculation(*li_box);

        auto const& list_item_state = m_state.get(*li_box);
        auto const& marker_state = m_state.get(*li_box->marker());

        auto offset_y = max(CSSPixels(0), (li_box->marker()->computed_values().line_height() - marker_state.content_height()) / 2);
        auto space_used_before_children_formatted = intrusion_by_floats_into_box(list_item_state, offset_y);

        left_space_before_children_formatted = space_used_before_children_formatted.left;
    }

    if (independent_formatting_context) {
        // This box establishes a new formatting context. Pass control to it.
        independent_formatting_context->run(box_state.available_inner_space_or_constraints_from(available_space));
    } else {
        // This box participates in the current block container's flow.
        if (box.children_are_inline()) {
            layout_inline_children(as<BlockContainer>(box), box_state.available_inner_space_or_constraints_from(available_space));