Generate tests for flex properties

Summary: Generate tests for flex-properties and fix bug where flex basis was not taken into account when parent main dimension was undefined. Differential Revision: D3771513 fbshipit-source-id: 1b5edc7a28bb26217e8a6d10d1829d9031c3ae2e
KennyWZhang · Aug 25, 2016 · 43faff4 · 43faff4
1 parent ea9a6ce
commit 43faff4
Show file tree

Hide file tree

Showing 4 changed files with 198 additions and 57 deletions.
diff --git a/CSSLayout/CSSLayout.c b/CSSLayout/CSSLayout.c
@@ -1040,8 +1040,7 @@ static void layoutNodeImpl(const CSSNodeRef node,
         child->layout.computedFlexBasis =
             fmaxf(child->style.dimensions[CSSDimensionHeight],
                   getPaddingAndBorderAxis(child, CSSFlexDirectionColumn));
-      } else if (!CSSValueIsUndefined(child->style.flexBasis) &&
-                 !CSSValueIsUndefined(availableInnerMainDim)) {
+      } else if (!CSSValueIsUndefined(child->style.flexBasis)) {
         child->layout.computedFlexBasis =
             fmaxf(child->style.flexBasis, getPaddingAndBorderAxis(child, mainAxis));
       } else {

diff --git a/java/com/facebook/csslayout/LayoutEngine.java b/java/com/facebook/csslayout/LayoutEngine.java
@@ -694,7 +694,7 @@ private static void layoutNodeImpl(
 
           // The height is definite, so use that as the flex basis.
           child.layout.computedFlexBasis = Math.max(child.style.dimensions[DIMENSION_HEIGHT], ((child.style.padding.getWithFallback(leadingSpacing[CSS_FLEX_DIRECTION_COLUMN], leading[CSS_FLEX_DIRECTION_COLUMN]) + child.style.border.getWithFallback(leadingSpacing[CSS_FLEX_DIRECTION_COLUMN], leading[CSS_FLEX_DIRECTION_COLUMN])) + (child.style.padding.getWithFallback(trailingSpacing[CSS_FLEX_DIRECTION_COLUMN], trailing[CSS_FLEX_DIRECTION_COLUMN]) + child.style.border.getWithFallback(trailingSpacing[CSS_FLEX_DIRECTION_COLUMN], trailing[CSS_FLEX_DIRECTION_COLUMN]))));
-        } else if (!isFlexBasisAuto(child) && !Float.isNaN(availableInnerMainDim)) {
+        } else if (!isFlexBasisAuto(child)) {
 
           // If the basis isn't 'auto', it is assumed to be zero.
           child.layout.computedFlexBasis = Math.max(child.style.flexBasis, ((child.style.padding.getWithFallback(leadingSpacing[mainAxis], leading[mainAxis]) + child.style.border.getWithFallback(leadingSpacing[mainAxis], leading[mainAxis])) + (child.style.padding.getWithFallback(trailingSpacing[mainAxis], trailing[mainAxis]) + child.style.border.getWithFallback(trailingSpacing[mainAxis], trailing[mainAxis]))));

diff --git a/tests/CSSLayoutFlexBasisTest.cpp b/tests/CSSLayoutFlexBasisTest.cpp
diff --git a/tests/CSSLayoutFlexTest.cpp b/tests/CSSLayoutFlexTest.cpp
@@ -0,0 +1,196 @@
+/**
+ * Copyright (c) 2014-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+/**
+ * @Generated by gentest/gentest.sh with the following input
+ *
+ * <div style="width: 100px; height: 100px;">
+ * <div style="flex-basis: 50px; flex-grow: 1;"></div>
+ * <div style="flex-grow: 1;"></div>
+ * </div>
+ * <div style="width: 100px; height: 100px; flex-direction: row;">
+ * <div style="flex-basis: 50px; flex-grow: 1;"></div>
+ * <div style="flex-grow: 1;"></div>
+ * </div>
+ * <div style="width: 100px; height: 100px;">
+ * <div style="flex-basis: 100px; flex-shrink: 1;"></div>
+ * <div style="flex-basis: 50px;"></div>
+ * </div>
+ * <div style="width: 100px; height: 100px; flex-direction: row;">
+ * <div style="flex-basis: 100px; flex-shrink: 1;"></div>
+ * <div style="flex-basis: 50px;"></div>
+ * </div>
+ * <div style="width: 100px;">
+ * <div style="flex-basis: 100px; flex-grow: 1;"></div>
+ * <div style="flex-basis: 50px;"></div>
+ * </div>
+ *
+ */
+
+#include <CSSLayout/CSSLayout-internal.h>
+#include <CSSLayoutTestUtils/CSSLayoutTestUtils.h>
+#include <gtest/gtest.h>
+
+TEST(CSSLayoutTest, flex_basis_flex_grow_column) {
+  const CSSNodeRef root = CSSNodeNew();
+  CSSNodeStyleSetWidth(root, 100);
+  CSSNodeStyleSetHeight(root, 100);
+
+  const CSSNodeRef root_child0 = CSSNodeNew();
+  CSSNodeStyleSetFlexGrow(root_child0, 1);
+  CSSNodeStyleSetFlexBasis(root_child0, 50);
+  CSSNodeInsertChild(root, root_child0, 0);
+
+  const CSSNodeRef root_child1 = CSSNodeNew();
+  CSSNodeStyleSetFlexGrow(root_child1, 1);
+  CSSNodeInsertChild(root, root_child1, 1);
+  CSSNodeCalculateLayout(root, CSSUndefined, CSSUndefined, CSSDirectionLTR);
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(75, CSSNodeLayoutGetHeight(root_child0));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child1));
+  ASSERT_EQ(75, CSSNodeLayoutGetTop(root_child1));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child1));
+  ASSERT_EQ(25, CSSNodeLayoutGetHeight(root_child1));
+}
+
+TEST(CSSLayoutTest, flex_basis_flex_grow_row) {
+  const CSSNodeRef root = CSSNodeNew();
+  CSSNodeStyleSetFlexDirection(root, CSSFlexDirectionRow);
+  CSSNodeStyleSetWidth(root, 100);
+  CSSNodeStyleSetHeight(root, 100);
+
+  const CSSNodeRef root_child0 = CSSNodeNew();
+  CSSNodeStyleSetFlexGrow(root_child0, 1);
+  CSSNodeStyleSetFlexBasis(root_child0, 50);
+  CSSNodeInsertChild(root, root_child0, 0);
+
+  const CSSNodeRef root_child1 = CSSNodeNew();
+  CSSNodeStyleSetFlexGrow(root_child1, 1);
+  CSSNodeInsertChild(root, root_child1, 1);
+  CSSNodeCalculateLayout(root, CSSUndefined, CSSUndefined, CSSDirectionLTR);
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(75, CSSNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child0));
+
+  ASSERT_EQ(75, CSSNodeLayoutGetLeft(root_child1));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child1));
+  ASSERT_EQ(25, CSSNodeLayoutGetWidth(root_child1));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child1));
+}
+
+TEST(CSSLayoutTest, flex_basis_flex_shrink_column) {
+  const CSSNodeRef root = CSSNodeNew();
+  CSSNodeStyleSetWidth(root, 100);
+  CSSNodeStyleSetHeight(root, 100);
+
+  const CSSNodeRef root_child0 = CSSNodeNew();
+  CSSNodeStyleSetFlexShrink(root_child0, 1);
+  CSSNodeStyleSetFlexBasis(root_child0, 100);
+  CSSNodeInsertChild(root, root_child0, 0);
+
+  const CSSNodeRef root_child1 = CSSNodeNew();
+  CSSNodeStyleSetFlexBasis(root_child1, 50);
+  CSSNodeInsertChild(root, root_child1, 1);
+  CSSNodeCalculateLayout(root, CSSUndefined, CSSUndefined, CSSDirectionLTR);
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(50, CSSNodeLayoutGetHeight(root_child0));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child1));
+  ASSERT_EQ(50, CSSNodeLayoutGetTop(root_child1));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child1));
+  ASSERT_EQ(50, CSSNodeLayoutGetHeight(root_child1));
+}
+
+TEST(CSSLayoutTest, flex_basis_flex_shrink_row) {
+  const CSSNodeRef root = CSSNodeNew();
+  CSSNodeStyleSetFlexDirection(root, CSSFlexDirectionRow);
+  CSSNodeStyleSetWidth(root, 100);
+  CSSNodeStyleSetHeight(root, 100);
+
+  const CSSNodeRef root_child0 = CSSNodeNew();
+  CSSNodeStyleSetFlexShrink(root_child0, 1);
+  CSSNodeStyleSetFlexBasis(root_child0, 100);
+  CSSNodeInsertChild(root, root_child0, 0);
+
+  const CSSNodeRef root_child1 = CSSNodeNew();
+  CSSNodeStyleSetFlexBasis(root_child1, 50);
+  CSSNodeInsertChild(root, root_child1, 1);
+  CSSNodeCalculateLayout(root, CSSUndefined, CSSUndefined, CSSDirectionLTR);
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(50, CSSNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child0));
+
+  ASSERT_EQ(50, CSSNodeLayoutGetLeft(root_child1));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child1));
+  ASSERT_EQ(50, CSSNodeLayoutGetWidth(root_child1));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child1));
+}
+
+TEST(CSSLayoutTest, flex_basis_flex_grow_undefined_main) {
+  const CSSNodeRef root = CSSNodeNew();
+  CSSNodeStyleSetWidth(root, 100);
+
+  const CSSNodeRef root_child0 = CSSNodeNew();
+  CSSNodeStyleSetFlexGrow(root_child0, 1);
+  CSSNodeStyleSetFlexBasis(root_child0, 100);
+  CSSNodeStyleSetWidth(root_child0, 100);
+  CSSNodeInsertChild(root, root_child0, 0);
+
+  const CSSNodeRef root_child1 = CSSNodeNew();
+  CSSNodeStyleSetFlexBasis(root_child1, 50);
+  CSSNodeStyleSetWidth(root_child1, 100);
+  CSSNodeInsertChild(root, root_child1, 1);
+  CSSNodeCalculateLayout(root, CSSUndefined, CSSUndefined, CSSDirectionLTR);
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root));
+  ASSERT_EQ(150, CSSNodeLayoutGetHeight(root));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0));
+  ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child0));
+  ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child0));
+
+  ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child1));
+  ASSERT_EQ(100, CSSNodeLayoutGetTop(root_child1));
+  ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child1));
+  ASSERT_EQ(50, CSSNodeLayoutGetHeight(root_child1));
+}