Commit 859e445d authored by Ting-Yu Lin's avatar Ting-Yu Lin
Browse files

Bug 1674774a Part 2 - Fix the border-box size which is used to position flex... 

Bug 1674774a Part 2 - Fix the border-box size which is used to position flex container's children. r=mats

If the flex container frame's tentative border-box size is different
from its final size, and it's in vertical-rl writing mode, we need to
adjust children's position. This is implemented in Part 3.

Differential Revision: https://phabricator.services.mozilla.com/D97521
parent ed394cfb

layout/generic/nsFlexContainerFrame.cpp

+26 −16
Original line number Diff line number Diff line
@@ -4483,14 +4483,30 @@ void nsFlexContainerFrame::Reflow(nsPresContext* aPresContext, 
    }

  }



  // Determine this frame's tentative border-box size. This is used for logical

  // to physical coordinate conversion when positioning children.

  //

  // Note that vertical-rl writing-mode is the only case where the block flow

  // direction progresses in a negative physical direction, and therefore block

  // direction coordinate conversion depends on knowing the width of the

  // coordinate space in order to translate between the logical and physical

  // origins. As a result, if our final border-box block-size is different from

  // this tentative one, and we are in vertical-rl writing mode, we need to

  // adjust our children's position after reflowing them.

  const LogicalSize tentativeBorderBoxSize(

      wm, contentBoxSize.ISize(wm) + borderPadding.IStartEnd(wm),

      std::min(effectiveContentBSize + borderPadding.BStartEnd(wm),

               aReflowInput.AvailableBSize()));

  const nsSize containerSize = tentativeBorderBoxSize.GetPhysicalSize(wm);



  const auto* prevInFlow = static_cast<nsFlexContainerFrame*>(GetPrevInFlow());

  OverflowAreas ocBounds;

  nsReflowStatus ocStatus;

  nscoord sumOfChildrenBlockSize;

  if (prevInFlow) {

    ReflowOverflowContainerChildren(aPresContext, aReflowInput, ocBounds,

                                    ReflowChildFlags::Default, ocStatus,

                                    MergeSortedFrameListsFor);

    ReflowOverflowContainerChildren(

        aPresContext, aReflowInput, ocBounds, ReflowChildFlags::Default,

        ocStatus, MergeSortedFrameListsFor, Some(containerSize));

    sumOfChildrenBlockSize =

        prevInFlow->GetProperty(SumOfChildrenBlockSizeProperty());

  } else {
@@ -4499,7 +4515,7 @@ void nsFlexContainerFrame::Reflow(nsPresContext* aPresContext, 


  const auto [maxBlockEndEdgeOfChildren, areChildrenComplete] =

      ReflowChildren(aReflowInput, contentBoxMainSize, contentBoxCrossSize,

                     availableSizeForItems, borderPadding,

                     containerSize, availableSizeForItems, borderPadding,

                     sumOfChildrenBlockSize, flexContainerAscent, lines,

                     placeholders, axisTracker, hasLineClampEllipsis);
@@ -5057,7 +5073,7 @@ void nsFlexContainerFrame::DoFlexLayout( 


std::tuple<nscoord, bool> nsFlexContainerFrame::ReflowChildren(

    const ReflowInput& aReflowInput, const nscoord aContentBoxMainSize,

    const nscoord aContentBoxCrossSize,

    const nscoord aContentBoxCrossSize, const nsSize& aContainerSize,

    const LogicalSize& aAvailableSizeForItems,

    const LogicalMargin& aBorderPadding,

    const nscoord aSumOfPrevInFlowsChildrenBlockSize,
@@ -5071,12 +5087,6 @@ std::tuple<nscoord, bool> nsFlexContainerFrame::ReflowChildren( 
  const LogicalPoint containerContentBoxOrigin(

      flexWM, aBorderPadding.IStart(flexWM), aBorderPadding.BStart(flexWM));



  // Determine flex container's border-box size (used in positioning children):

  LogicalSize logSize = aAxisTracker.LogicalSizeFromFlexRelativeSizes(

      aContentBoxMainSize, aContentBoxCrossSize);

  logSize += aBorderPadding.Size(flexWM);

  nsSize containerSize = logSize.GetPhysicalSize(flexWM);



  // If the flex container has no baseline-aligned items, it will use the first

  // item to determine its baseline:

  const FlexItem* firstItem =
@@ -5154,9 +5164,9 @@ std::tuple<nscoord, bool> nsFlexContainerFrame::ReflowChildren( 
                        availableBSizeForItem)

                .ConvertTo(itemWM, flexWM);



        const nsReflowStatus childReflowStatus =

            ReflowFlexItem(aAxisTracker, aReflowInput, item, framePos,

                           availableSize, containerSize, aHasLineClampEllipsis);

        const nsReflowStatus childReflowStatus = ReflowFlexItem(

            aAxisTracker, aReflowInput, item, framePos, availableSize,

            aContainerSize, aHasLineClampEllipsis);



        if (childReflowStatus.IsIncomplete()) {

          incompleteItems.PutEntry(item.Frame());
@@ -5165,7 +5175,7 @@ std::tuple<nscoord, bool> nsFlexContainerFrame::ReflowChildren( 
        }

      } else {

        MoveFlexItemToFinalPosition(aReflowInput, item, framePos,

                                    containerSize);

                                    aContainerSize);

        // We didn't perform a final reflow of the item. If we still have a

        // -webkit-line-clamp ellipsis hanging around, but we shouldn't have

        // one any more, we need to clear that now.  Technically, we only need
@@ -5210,7 +5220,7 @@ std::tuple<nscoord, bool> nsFlexContainerFrame::ReflowChildren( 


  if (!aPlaceholders.IsEmpty()) {

    ReflowPlaceholders(aReflowInput, aPlaceholders, containerContentBoxOrigin,

                       containerSize);

                       aContainerSize);

  }



  const bool anyChildIncomplete = PushIncompleteChildren(

layout/generic/nsFlexContainerFrame.h

+3 −1
Original line number Diff line number Diff line
@@ -546,6 +546,8 @@ class nsFlexContainerFrame final : public nsContainerFrame { 
   *                            container.

   * @param aContentBoxCrossSize the final content-box cross-size of the flex

   *                             container.

   * @param aContainerSize this frame's tentative physical border-box size, used

   *                       only for logical to physical coordinate conversion.

   * @param aAvailableSizeForItems the size of the available space for our

   *                               children to reflow into.

   * @param aBorderPadding the border and padding for this frame (possibly with
@@ -566,7 +568,7 @@ class nsFlexContainerFrame final : public nsContainerFrame { 
   */

  std::tuple<nscoord, bool> ReflowChildren(

      const ReflowInput& aReflowInput, const nscoord aContentBoxMainSize,

      const nscoord aContentBoxCrossSize,

      const nscoord aContentBoxCrossSize, const nsSize& aContainerSize,

      const mozilla::LogicalSize& aAvailableSizeForItems,

      const mozilla::LogicalMargin& aBorderPadding,

      const nscoord aSumOfPrevInFlowsChildrenBlockSize,

layout/reftests/flexbox/pagination/reftest.list

+44 −44
Original line number Diff line number Diff line
@@ -79,22 +79,22 @@ fuzzy-if(Android&&webrender,0-128,0-10) == flexbox-empty-2d.html flexbox-empty-2 


# Tests for how we fragment flex items in a single-line column flex container

# under "writing-mode: vertical-rl".

fails == flexbox-single-column-vertical-rl-1a.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1b.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1c.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1d.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1e.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1f.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1g.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1h.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1i.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-1j.html flexbox-single-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-2.html flexbox-single-column-vertical-rl-2-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-3a.html flexbox-single-column-vertical-rl-3-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-3b.html flexbox-single-column-vertical-rl-3-ref.html # Bug 1674774

== flexbox-single-column-vertical-rl-1a.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1b.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1c.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1d.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1e.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1f.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1g.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1h.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1i.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-1j.html flexbox-single-column-vertical-rl-1-ref.html

== flexbox-single-column-vertical-rl-2.html flexbox-single-column-vertical-rl-2-ref.html

== flexbox-single-column-vertical-rl-3a.html flexbox-single-column-vertical-rl-3-ref.html

== flexbox-single-column-vertical-rl-3b.html flexbox-single-column-vertical-rl-3-ref.html

== flexbox-single-column-vertical-rl-4.html flexbox-single-column-vertical-rl-4-ref.html

fails == flexbox-single-column-vertical-rl-5.html flexbox-single-column-vertical-rl-5-ref.html # Bug 1674774

fails == flexbox-single-column-vertical-rl-6.html flexbox-single-column-vertical-rl-6-ref.html # Bug 1674774

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-column-vertical-rl-6.html flexbox-single-column-vertical-rl-6-ref.html # Bug 1679931



# Tests for how we fragment flex items in a multi-line column flex container.

== flexbox-multi-column-1a.html flexbox-multi-column-1-ref.html
@@ -125,17 +125,17 @@ fails == flexbox-single-column-vertical-rl-6.html flexbox-single-column-vertical 


# Tests for how we fragment flex items in a multi-line column flex container

# under "writing-mode: vertical-rl".

fails == flexbox-multi-column-vertical-rl-1a.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1b.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1c.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1d.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1e.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1f.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1g.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1h.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1i.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-1j.html flexbox-multi-column-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-column-vertical-rl-2.html flexbox-multi-column-vertical-rl-2-ref.html # Bug 1674774

== flexbox-multi-column-vertical-rl-1a.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1b.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1c.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1d.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1e.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1f.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1g.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1h.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1i.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-1j.html flexbox-multi-column-vertical-rl-1-ref.html

== flexbox-multi-column-vertical-rl-2.html flexbox-multi-column-vertical-rl-2-ref.html



# Tests for how we fragment flex items in a single-line row flex container.

== flexbox-single-row-1a.html flexbox-single-row-1-ref.html
@@ -168,17 +168,17 @@ fails == flexbox-multi-column-vertical-rl-2.html flexbox-multi-column-vertical-r 


# Tests for how we fragment flex items in a single-line row flex container

# under "writing-mode: vertical-rl".

fails == flexbox-single-row-vertical-rl-1a.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1b.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1c.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1d.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1e.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1f.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1g.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-1h.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-2.html flexbox-single-row-vertical-rl-2-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-3a.html flexbox-single-row-vertical-rl-3-ref.html # Bug 1674774

fails == flexbox-single-row-vertical-rl-3b.html flexbox-single-row-vertical-rl-3-ref.html # Bug 1674774

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1a.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1b.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1c.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1d.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1e.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1f.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1g.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-1h.html flexbox-single-row-vertical-rl-1-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-2.html flexbox-single-row-vertical-rl-2-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-3a.html flexbox-single-row-vertical-rl-3-ref.html # Bug 1679931

ref-pref(dom.meta-viewport.enabled,false) == flexbox-single-row-vertical-rl-3b.html flexbox-single-row-vertical-rl-3-ref.html # Bug 1679931

fails == flexbox-single-row-vertical-rl-4.html flexbox-single-row-vertical-rl-4-ref.html # Bug 1674774



# Tests for how we fragment flex items in a multi-line row flex container.
@@ -204,11 +204,11 @@ fails == flexbox-single-row-vertical-rl-4.html flexbox-single-row-vertical-rl-4- 


# Tests for how we fragment flex items in a multi-line row flex container.

# under "writing-mode: vertical-rl".

fails == flexbox-multi-row-vertical-rl-1a.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-1b.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-1c.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-1d.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-1e.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-1f.html flexbox-multi-row-vertical-rl-1-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-2a.html flexbox-multi-row-vertical-rl-2-ref.html # Bug 1674774

fails == flexbox-multi-row-vertical-rl-2b.html flexbox-multi-row-vertical-rl-2-ref.html # Bug 1674774
 
== flexbox-multi-row-vertical-rl-1a.html flexbox-multi-row-vertical-rl-1-ref.html

== flexbox-multi-row-vertical-rl-1b.html flexbox-multi-row-vertical-rl-1-ref.html

== flexbox-multi-row-vertical-rl-1c.html flexbox-multi-row-vertical-rl-1-ref.html

== flexbox-multi-row-vertical-rl-1d.html flexbox-multi-row-vertical-rl-1-ref.html

== flexbox-multi-row-vertical-rl-1e.html flexbox-multi-row-vertical-rl-1-ref.html

== flexbox-multi-row-vertical-rl-1f.html flexbox-multi-row-vertical-rl-1-ref.html

== flexbox-multi-row-vertical-rl-2a.html flexbox-multi-row-vertical-rl-2-ref.html

== flexbox-multi-row-vertical-rl-2b.html flexbox-multi-row-vertical-rl-2-ref.html