Bug 1715661 - Fix justify-content:{left|right} for column oriented vertical flex container. r=dholbert

In a column oriented vertical flex container, its main axis is parallel
to physical left <-> right axis, so justify-content:left and
justify-content:right should map to physical left and right edge,
respectively. This patch makes this particular case go to the (tweaked)
`else` branch.

https://drafts.csswg.org/css-align-3/#valdef-justify-content-left

Differential Revision: https://phabricator.services.mozilla.com/D120415

layout/generic/nsFlexContainerFrame.cpp

@@ -3381,14 +3381,22 @@ MainAxisPositionTracker::MainAxisPositionTracker(
   // Map 'left'/'right' to 'start'/'end'
   if (mJustifyContent.primary == StyleAlignFlags::LEFT ||
       mJustifyContent.primary == StyleAlignFlags::RIGHT) {
-    if (aAxisTracker.IsColumnOriented()) {
+    const auto wm = aAxisTracker.GetWritingMode();
-      // Container's alignment axis is not parallel to the inline axis,
+    if (aAxisTracker.IsColumnOriented() && !wm.IsVertical()) {
-      // so we map both 'left' and 'right' to 'start'.
+      // Container's alignment axis (main axis) is *not* parallel to the
+      // line-left <-> line-right axis or the physical left <-> physical right
+      // axis, so we map both 'left' and 'right' to 'start'.
       mJustifyContent.primary = StyleAlignFlags::START;
     } else {
-      // Row-oriented, so we map 'left' and 'right' to 'start' or 'end',
+      MOZ_ASSERT(
-      // depending on left-to-right writing mode.
+          aAxisTracker.MainAxis() == eLogicalAxisInline ||
-      const bool isLTR = aAxisTracker.GetWritingMode().IsBidiLTR();
+              wm.PhysicalAxis(aAxisTracker.MainAxis()) == eAxisHorizontal,
+          "The container's main axis should be parallel to either line-left "
+          "<-> line-right axis or physical left <-> physical right axis!");
+
+      // Otherwise, we map 'left' and 'right' to 'start' or 'end', depending on
+      // the container's writing mode.
+      const bool isLTR = wm.IsPhysicalLTR();
       const bool isJustifyLeft =
           (mJustifyContent.primary == StyleAlignFlags::LEFT);
       mJustifyContent.primary = (isJustifyLeft == isLTR)

testing/web-platform/meta/css/css-flexbox/flexbox-justify-content-wmvert-002.html.ini

@@ -1,7 +0,0 @@
-[flexbox-justify-content-wmvert-002.html]
-  [.flexitem 1]
-    expected: FAIL
-
-  [.flexitem 2]
-    expected: FAIL
-