Fix align-content:strech overriding align-item

Summary: Fix for facebook#413. This was a hangover from a previous attept to fix other align-content problems. Closes facebook#417 Reviewed By: astreet Differential Revision: D4604727 Pulled By: emilsjolander fbshipit-source-id: 92fd31a385d8182c6b201c891d5ae478372d525d
webin · Feb 23, 2017 · 4f5c7ed · 4f5c7ed
1 parent 60ffa19
commit 4f5c7ed
Show file tree

Hide file tree

Showing 6 changed files with 229 additions and 2 deletions.
diff --git a/csharp/tests/Facebook.Yoga/YGAlignContentTest.cs b/csharp/tests/Facebook.Yoga/YGAlignContentTest.cs
@@ -1790,5 +1790,61 @@ public void Test_align_content_stretch_column()
             Assert.AreEqual(50f, root_child4.LayoutHeight);
         }
 
+        [Test]
+        public void Test_align_content_stretch_is_not_overriding_align_items()
+        {
+            YogaNode root = new YogaNode();
+            root.AlignContent = YogaAlign.Stretch;
+
+            YogaNode root_child0 = new YogaNode();
+            root_child0.FlexDirection = YogaFlexDirection.Row;
+            root_child0.AlignContent = YogaAlign.Stretch;
+            root_child0.AlignItems = YogaAlign.Center;
+            root_child0.Width = 100;
+            root_child0.Height = 100;
+            root.Insert(0, root_child0);
+
+            YogaNode root_child0_child0 = new YogaNode();
+            root_child0_child0.AlignContent = YogaAlign.Stretch;
+            root_child0_child0.Width = 10;
+            root_child0_child0.Height = 10;
+            root_child0.Insert(0, root_child0_child0);
+            root.StyleDirection = YogaDirection.LTR;
+            root.CalculateLayout();
+
+            Assert.AreEqual(0f, root.LayoutX);
+            Assert.AreEqual(0f, root.LayoutY);
+            Assert.AreEqual(100f, root.LayoutWidth);
+            Assert.AreEqual(100f, root.LayoutHeight);
+
+            Assert.AreEqual(0f, root_child0.LayoutX);
+            Assert.AreEqual(0f, root_child0.LayoutY);
+            Assert.AreEqual(100f, root_child0.LayoutWidth);
+            Assert.AreEqual(100f, root_child0.LayoutHeight);
+
+            Assert.AreEqual(0f, root_child0_child0.LayoutX);
+            Assert.AreEqual(45f, root_child0_child0.LayoutY);
+            Assert.AreEqual(10f, root_child0_child0.LayoutWidth);
+            Assert.AreEqual(10f, root_child0_child0.LayoutHeight);
+
+            root.StyleDirection = YogaDirection.RTL;
+            root.CalculateLayout();
+
+            Assert.AreEqual(0f, root.LayoutX);
+            Assert.AreEqual(0f, root.LayoutY);
+            Assert.AreEqual(100f, root.LayoutWidth);
+            Assert.AreEqual(100f, root.LayoutHeight);
+
+            Assert.AreEqual(0f, root_child0.LayoutX);
+            Assert.AreEqual(0f, root_child0.LayoutY);
+            Assert.AreEqual(100f, root_child0.LayoutWidth);
+            Assert.AreEqual(100f, root_child0.LayoutHeight);
+
+            Assert.AreEqual(90f, root_child0_child0.LayoutX);
+            Assert.AreEqual(45f, root_child0_child0.LayoutY);
+            Assert.AreEqual(10f, root_child0_child0.LayoutWidth);
+            Assert.AreEqual(10f, root_child0_child0.LayoutHeight);
+        }
+
     }
 }
diff --git a/gentest/fixtures/YGAlignContentTest.html b/gentest/fixtures/YGAlignContentTest.html
@@ -142,3 +142,9 @@
   <div style="height: 50px;"></div>
   <div style="height: 50px;"></div>
 </div>
+
+<div id="align_content_stretch_is_not_overriding_align_items" style="align-content:stretch;">
+  <div style="width:100px; height: 100px; align-items: center; flex-direction: row; align-content:stretch;">
+    <div style="height: 10px; width: 10px; align-content:stretch;"></div>
+  </div>
+</div>
diff --git a/java/tests/com/facebook/yoga/YGAlignContentTest.java b/java/tests/com/facebook/yoga/YGAlignContentTest.java
@@ -1771,4 +1771,59 @@ public void test_align_content_stretch_column() {
     assertEquals(50f, root_child4.getLayoutHeight(), 0.0f);
   }
 
+  @Test
+  public void test_align_content_stretch_is_not_overriding_align_items() {
+    final YogaNode root = new YogaNode();
+    root.setAlignContent(YogaAlign.STRETCH);
+
+    final YogaNode root_child0 = new YogaNode();
+    root_child0.setFlexDirection(YogaFlexDirection.ROW);
+    root_child0.setAlignContent(YogaAlign.STRETCH);
+    root_child0.setAlignItems(YogaAlign.CENTER);
+    root_child0.setWidth(100f);
+    root_child0.setHeight(100f);
+    root.addChildAt(root_child0, 0);
+
+    final YogaNode root_child0_child0 = new YogaNode();
+    root_child0_child0.setAlignContent(YogaAlign.STRETCH);
+    root_child0_child0.setWidth(10f);
+    root_child0_child0.setHeight(10f);
+    root_child0.addChildAt(root_child0_child0, 0);
+    root.setDirection(YogaDirection.LTR);
+    root.calculateLayout(YogaConstants.UNDEFINED, YogaConstants.UNDEFINED);
+
+    assertEquals(0f, root.getLayoutX(), 0.0f);
+    assertEquals(0f, root.getLayoutY(), 0.0f);
+    assertEquals(100f, root.getLayoutWidth(), 0.0f);
+    assertEquals(100f, root.getLayoutHeight(), 0.0f);
+
+    assertEquals(0f, root_child0.getLayoutX(), 0.0f);
+    assertEquals(0f, root_child0.getLayoutY(), 0.0f);
+    assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
+    assertEquals(100f, root_child0.getLayoutHeight(), 0.0f);
+
+    assertEquals(0f, root_child0_child0.getLayoutX(), 0.0f);
+    assertEquals(45f, root_child0_child0.getLayoutY(), 0.0f);
+    assertEquals(10f, root_child0_child0.getLayoutWidth(), 0.0f);
+    assertEquals(10f, root_child0_child0.getLayoutHeight(), 0.0f);
+
+    root.setDirection(YogaDirection.RTL);
+    root.calculateLayout(YogaConstants.UNDEFINED, YogaConstants.UNDEFINED);
+
+    assertEquals(0f, root.getLayoutX(), 0.0f);
+    assertEquals(0f, root.getLayoutY(), 0.0f);
+    assertEquals(100f, root.getLayoutWidth(), 0.0f);
+    assertEquals(100f, root.getLayoutHeight(), 0.0f);
+
+    assertEquals(0f, root_child0.getLayoutX(), 0.0f);
+    assertEquals(0f, root_child0.getLayoutY(), 0.0f);
+    assertEquals(100f, root_child0.getLayoutWidth(), 0.0f);
+    assertEquals(100f, root_child0.getLayoutHeight(), 0.0f);
+
+    assertEquals(90f, root_child0_child0.getLayoutX(), 0.0f);
+    assertEquals(45f, root_child0_child0.getLayoutY(), 0.0f);
+    assertEquals(10f, root_child0_child0.getLayoutWidth(), 0.0f);
+    assertEquals(10f, root_child0_child0.getLayoutHeight(), 0.0f);
+  }
+
 }
diff --git a/javascript/tests/Facebook.Yoga/YGAlignContentTest.js b/javascript/tests/Facebook.Yoga/YGAlignContentTest.js
@@ -1802,3 +1802,60 @@ it("align_content_stretch_column", function () {
     }
   }
 });
+it("align_content_stretch_is_not_overriding_align_items", function () {
+  try {
+    var root = Yoga.Node.create();
+    root.setAlignContent(Yoga.ALIGN_STRETCH);
+
+    var root_child0 = Yoga.Node.create();
+    root_child0.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+    root_child0.setAlignContent(Yoga.ALIGN_STRETCH);
+    root_child0.setAlignItems(Yoga.ALIGN_CENTER);
+    root_child0.setWidth(100);
+    root_child0.setHeight(100);
+    root.insertChild(root_child0, 0);
+
+    var root_child0_child0 = Yoga.Node.create();
+    root_child0_child0.setAlignContent(Yoga.ALIGN_STRETCH);
+    root_child0_child0.setWidth(10);
+    root_child0_child0.setHeight(10);
+    root_child0.insertChild(root_child0_child0, 0);
+    root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+    console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+    console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+    console.assert(100 === root.getComputedWidth(), "100 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+    console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+    console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+    console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+    console.assert(100 === root_child0.getComputedWidth(), "100 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+    console.assert(100 === root_child0.getComputedHeight(), "100 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+    console.assert(0 === root_child0_child0.getComputedLeft(), "0 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+    console.assert(45 === root_child0_child0.getComputedTop(), "45 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+    console.assert(10 === root_child0_child0.getComputedWidth(), "10 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+    console.assert(10 === root_child0_child0.getComputedHeight(), "10 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+    root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+    console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+    console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+    console.assert(100 === root.getComputedWidth(), "100 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+    console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+    console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+    console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+    console.assert(100 === root_child0.getComputedWidth(), "100 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+    console.assert(100 === root_child0.getComputedHeight(), "100 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+    console.assert(90 === root_child0_child0.getComputedLeft(), "90 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+    console.assert(45 === root_child0_child0.getComputedTop(), "45 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+    console.assert(10 === root_child0_child0.getComputedWidth(), "10 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+    console.assert(10 === root_child0_child0.getComputedHeight(), "10 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+  } finally {
+    if (typeof root !== "undefined") {
+      root.freeRecursive();
+    }
+  }
+});
diff --git a/tests/YGAlignContentTest.cpp b/tests/YGAlignContentTest.cpp
@@ -1748,3 +1748,57 @@ TEST(YogaTest, align_content_stretch_column) {
 
   YGNodeFreeRecursive(root);
 }
+
+TEST(YogaTest, align_content_stretch_is_not_overriding_align_items) {
+  const YGNodeRef root = YGNodeNew();
+  YGNodeStyleSetAlignContent(root, YGAlignStretch);
+
+  const YGNodeRef root_child0 = YGNodeNew();
+  YGNodeStyleSetFlexDirection(root_child0, YGFlexDirectionRow);
+  YGNodeStyleSetAlignContent(root_child0, YGAlignStretch);
+  YGNodeStyleSetAlignItems(root_child0, YGAlignCenter);
+  YGNodeStyleSetWidth(root_child0, 100);
+  YGNodeStyleSetHeight(root_child0, 100);
+  YGNodeInsertChild(root, root_child0, 0);
+
+  const YGNodeRef root_child0_child0 = YGNodeNew();
+  YGNodeStyleSetAlignContent(root_child0_child0, YGAlignStretch);
+  YGNodeStyleSetWidth(root_child0_child0, 10);
+  YGNodeStyleSetHeight(root_child0_child0, 10);
+  YGNodeInsertChild(root_child0, root_child0_child0, 0);
+  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionLTR);
+
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root));
+
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child0));
+
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0_child0));
+  ASSERT_FLOAT_EQ(45, YGNodeLayoutGetTop(root_child0_child0));
+  ASSERT_FLOAT_EQ(10, YGNodeLayoutGetWidth(root_child0_child0));
+  ASSERT_FLOAT_EQ(10, YGNodeLayoutGetHeight(root_child0_child0));
+
+  YGNodeCalculateLayout(root, YGUndefined, YGUndefined, YGDirectionRTL);
+
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root));
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root));
+
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetLeft(root_child0));
+  ASSERT_FLOAT_EQ(0, YGNodeLayoutGetTop(root_child0));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetWidth(root_child0));
+  ASSERT_FLOAT_EQ(100, YGNodeLayoutGetHeight(root_child0));
+
+  ASSERT_FLOAT_EQ(90, YGNodeLayoutGetLeft(root_child0_child0));
+  ASSERT_FLOAT_EQ(45, YGNodeLayoutGetTop(root_child0_child0));
+  ASSERT_FLOAT_EQ(10, YGNodeLayoutGetWidth(root_child0_child0));
+  ASSERT_FLOAT_EQ(10, YGNodeLayoutGetHeight(root_child0_child0));
+
+  YGNodeFreeRecursive(root);
+}
diff --git a/yoga/Yoga.c b/yoga/Yoga.c
@@ -2666,8 +2666,7 @@ static void YGNodelayoutImpl(const YGNodeRef node,
   }
 
   // STEP 8: MULTI-LINE CONTENT ALIGNMENT
-  if (performLayout &&
-      (lineCount > 1 || node->style.alignContent == YGAlignStretch || YGIsBaselineLayout(node)) &&
+  if (performLayout && (lineCount > 1 || YGIsBaselineLayout(node)) &&
       !YGFloatIsUndefined(availableInnerCrossDim)) {
     const float remainingAlignContentDim = availableInnerCrossDim - totalLineCrossDim;