make C and Java tests pass and update their code

.gitignore

@@ -2,3 +2,4 @@ a.out
 *.class
 /**/java/out/*
 /**/.idea/workspace.xml
+/lib/

src/JavaTranspiler.js

@@ -95,6 +95,7 @@ var JavaTranspiler = {
         .replace(/\/\*\([^\/]+\*\/\n/g, '') // remove comments for other languages
         .replace(/var\/\*([^\/]+)\*\//g, '$1')
         .replace(/ === /g, ' == ')
+        .replace(/ !== /g, ' != ')
         .replace(/\n  /g, '\n')
         .replace(/\/[*]!([^*]+)[*]\//g, '$1')
         .replace(/css_node_t\*/g, 'CSSNode'));

src/Layout-test-utils.js

@@ -10,37 +10,39 @@
 
 var layoutTestUtils = (function() {
 
-  jasmine.matchersUtil.buildFailureMessage = function () {
+  if (typeof jasmine !== 'undefined') {
-    var args = Array.prototype.slice.call(arguments, 0),
+    jasmine.matchersUtil.buildFailureMessage = function () {
-      matcherName = args[0],
+      var args = Array.prototype.slice.call(arguments, 0),
-      isNot = args[1],
+        matcherName = args[0],
-      actual = args[2],
+        isNot = args[1],
-      expected = args.slice(3),
+        actual = args[2],
-      englishyPredicate = matcherName.replace(/[A-Z]/g, function(s) { return ' ' + s.toLowerCase(); });
+        expected = args.slice(3),
+        englishyPredicate = matcherName.replace(/[A-Z]/g, function(s) { return ' ' + s.toLowerCase(); });
 
-    var pp = function(node) {
+      var pp = function(node) {
-      return jasmine.pp(node)
+        return jasmine.pp(node)
-        .replace(/([\{\[]) /g, '$1')
+          .replace(/([\{\[]) /g, '$1')
-        .replace(/ ([\}\]:])/g, '$1');
+          .replace(/ ([\}\]:])/g, '$1');
-    };
+      };
 
-    var message = 'Expected ' +
+      var message = 'Expected ' +
-      pp(actual) +
+        pp(actual) +
-      (isNot ? ' not ' : ' ') +
+        (isNot ? ' not ' : ' ') +
-      '\n' +
+        '\n' +
-      englishyPredicate;
+        englishyPredicate;
 
-    if (expected.length > 0) {
+      if (expected.length > 0) {
-      for (var i = 0; i < expected.length; i++) {
+        for (var i = 0; i < expected.length; i++) {
-        if (i > 0) {
+          if (i > 0) {
-          message += ',';
+            message += ',';
+          }
+          message += ' ' + pp(expected[i]);
         }
-        message += ' ' + pp(expected[i]);
       }
-    }
 
-    return message + '.';
+      return message + '.';
-  };
+    };
+  }
 
   var cachedIframe;
   function getIframe() {

src/Layout.c

@@ -394,8 +394,7 @@ static void layoutNodeImpl(css_node_t *node, float parentMaxWidth) {
     if (getAlignItem(node, child) == CSS_ALIGN_STRETCH &&
         getPositionType(child) == CSS_POSITION_RELATIVE &&
         !isUndefined(node->layout.dimensions[dim[crossAxis]]) &&
-        !isDimDefined(child, crossAxis) &&
+        !isDimDefined(child, crossAxis)) {
-        !isPosDefined(child, leading[crossAxis])) {
       child->layout.dimensions[dim[crossAxis]] = fmaxf(
         node->layout.dimensions[dim[crossAxis]] -
           getPaddingAndBorderAxis(node, crossAxis) -
@@ -480,7 +479,6 @@ static void layoutNodeImpl(css_node_t *node, float parentMaxWidth) {
     }
   }
 
-
   // <Loop B> Layout flexible children and allocate empty space
 
   // In order to position the elements in the main axis, we have two
@@ -489,73 +487,75 @@ static void layoutNodeImpl(css_node_t *node, float parentMaxWidth) {
   float leadingMainDim = 0;
   float betweenMainDim = 0;
 
-  // If the dimensions of the current node is defined by its children, they
+  float definedMainDim = fmaxf(mainContentDim, 0);
-  // are all going to be packed together and we don't need to compute
-  // anything.
   if (!isUndefined(node->layout.dimensions[dim[mainAxis]])) {
-    // The remaining available space that needs to be allocated
+    definedMainDim = node->layout.dimensions[dim[mainAxis]] -
-    float remainingMainDim = node->layout.dimensions[dim[mainAxis]] -
+      getPaddingAndBorderAxis(node, mainAxis);
-      getPaddingAndBorderAxis(node, mainAxis) -
+  }
-      mainContentDim;
+  // The remaining available space that needs to be allocated
+  float remainingMainDim = definedMainDim - mainContentDim;
 
-    // If there are flexible children in the mix, they are going to fill the
+  // If there are flexible children in the mix, they are going to fill the
-    // remaining space
+  // remaining space
-    if (flexibleChildrenCount != 0) {
+  if (flexibleChildrenCount != 0) {
-      float flexibleMainDim = remainingMainDim / totalFlexible;
+    float flexibleMainDim = remainingMainDim / totalFlexible;
 
-      // The non flexible children can overflow the container, in this case
+    // The non flexible children can overflow the container, in this case
-      // we should just assume that there is no space available.
+    // we should just assume that there is no space available.
-      if (flexibleMainDim < 0) {
+    if (flexibleMainDim < 0) {
-        flexibleMainDim = 0;
+      flexibleMainDim = 0;
-      }
+    }
-      // We iterate over the full array and only apply the action on flexible
+    // We iterate over the full array and only apply the action on flexible
-      // children. This is faster than actually allocating a new array that
+    // children. This is faster than actually allocating a new array that
-      // contains only flexible children.
+    // contains only flexible children.
-      for (int i = 0; i < node->children_count; ++i) {
+    for (int i = 0; i < node->children_count; ++i) {
-        css_node_t* child = node->get_child(node->context, i);
+      css_node_t* child = node->get_child(node->context, i);
-        if (isFlex(child)) {
+      if (isFlex(child)) {
-          // At this point we know the final size of the element in the main
+        // At this point we know the final size of the element in the main
-          // dimension
+        // dimension
-          child->layout.dimensions[dim[mainAxis]] = flexibleMainDim * getFlex(child) +
+        child->layout.dimensions[dim[mainAxis]] = flexibleMainDim * getFlex(child) +
-            getPaddingAndBorderAxis(child, mainAxis);
+          getPaddingAndBorderAxis(child, mainAxis);
 
-          float maxWidth = CSS_UNDEFINED;
+        float maxWidth = CSS_UNDEFINED;
-          if (mainAxis == CSS_FLEX_DIRECTION_ROW) {
+        if (mainAxis == CSS_FLEX_DIRECTION_ROW) {
-            // do nothing
+          // do nothing
-          } else if (isDimDefined(node, CSS_FLEX_DIRECTION_ROW)) {
+        } else if (isDimDefined(node, CSS_FLEX_DIRECTION_ROW)) {
-            maxWidth = node->layout.dimensions[dim[CSS_FLEX_DIRECTION_ROW]] -
+          maxWidth = node->layout.dimensions[dim[CSS_FLEX_DIRECTION_ROW]] -
-              getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_ROW);
+            getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_ROW);
-          } else {
+        } else {
-            maxWidth = parentMaxWidth -
+          maxWidth = parentMaxWidth -
-              getMarginAxis(node, CSS_FLEX_DIRECTION_ROW) -
+            getMarginAxis(node, CSS_FLEX_DIRECTION_ROW) -
-              getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_ROW);
+            getPaddingAndBorderAxis(node, CSS_FLEX_DIRECTION_ROW);
-          }
-
-          // And we recursively call the layout algorithm for this child
-          layoutNode(child, maxWidth);
         }
-      }
 
-    // We use justifyContent to figure out how to allocate the remaining
+        // And we recursively call the layout algorithm for this child
-    // space available
+        layoutNode(child, maxWidth);
-    } else {
+      }
-      css_justify_t justifyContent = getJustifyContent(node);
+    }
-      if (justifyContent == CSS_JUSTIFY_FLEX_START) {
+
-        // Do nothing
+  // We use justifyContent to figure out how to allocate the remaining
-      } else if (justifyContent == CSS_JUSTIFY_CENTER) {
+  // space available
-        leadingMainDim = remainingMainDim / 2;
+  } else {
-      } else if (justifyContent == CSS_JUSTIFY_FLEX_END) {
+    css_justify_t justifyContent = getJustifyContent(node);
-        leadingMainDim = remainingMainDim;
+    if (justifyContent == CSS_JUSTIFY_FLEX_START) {
-      } else if (justifyContent == CSS_JUSTIFY_SPACE_BETWEEN) {
+      // Do nothing
-        remainingMainDim = fmaxf(remainingMainDim, 0);
+    } else if (justifyContent == CSS_JUSTIFY_CENTER) {
+      leadingMainDim = remainingMainDim / 2;
+    } else if (justifyContent == CSS_JUSTIFY_FLEX_END) {
+      leadingMainDim = remainingMainDim;
+    } else if (justifyContent == CSS_JUSTIFY_SPACE_BETWEEN) {
+      remainingMainDim = fmaxf(remainingMainDim, 0);
+      if (flexibleChildrenCount + nonFlexibleChildrenCount - 1 != 0) {
         betweenMainDim = remainingMainDim /
           (flexibleChildrenCount + nonFlexibleChildrenCount - 1);
-      } else if (justifyContent == CSS_JUSTIFY_SPACE_AROUND) {
+      } else {
-        // Space on the edges is half of the space between elements
+        betweenMainDim = 0;
-        betweenMainDim = remainingMainDim /
-          (flexibleChildrenCount + nonFlexibleChildrenCount);
-        leadingMainDim = betweenMainDim / 2;
       }
+    } else if (justifyContent == CSS_JUSTIFY_SPACE_AROUND) {
+      // Space on the edges is half of the space between elements
+      betweenMainDim = remainingMainDim /
+        (flexibleChildrenCount + nonFlexibleChildrenCount);
+      leadingMainDim = betweenMainDim / 2;
     }
   }
 

src/__tests__/Layout-test.c

@@ -3343,7 +3343,7 @@ int main()
       }
     }
 
-    test("should calcluate left properly with position: absolute right", root_node, root_layout);
+    test("should calculate left properly with position: absolute right", root_node, root_layout);
   }
 
   {
@@ -3415,7 +3415,7 @@ int main()
       }
     }
 
-    test("should calcluate left properly with position: absolute right and width", root_node, root_layout);
+    test("should calculate left properly with position: absolute right and width", root_node, root_layout);
   }
 
   {
@@ -3450,7 +3450,7 @@ int main()
       }
     }
 
-    test("should calcluate top properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
+    test("should calculate top properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
   }
 
   {
@@ -3485,7 +3485,191 @@ int main()
       }
     }
 
-    test("should calcluate left properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
+    test("should calculate left properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
+  }
+
+  {
+    css_node_t *root_node = new_test_css_node();
+    {
+      css_node_t *node_0 = root_node;
+      node_0->style.justify_content = CSS_JUSTIFY_SPACE_BETWEEN;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->style.border[CSS_BOTTOM] = 1;
+      }
+    }
+
+    css_node_t *root_layout = new_test_css_node();
+    {
+      css_node_t *node_0 = root_layout;
+      node_0->layout.position[CSS_TOP] = 0;
+      node_0->layout.position[CSS_LEFT] = 0;
+      node_0->layout.dimensions[CSS_WIDTH] = 0;
+      node_0->layout.dimensions[CSS_HEIGHT] = 1;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->layout.position[CSS_TOP] = 0;
+        node_1->layout.position[CSS_LEFT] = 0;
+        node_1->layout.dimensions[CSS_WIDTH] = 0;
+        node_1->layout.dimensions[CSS_HEIGHT] = 1;
+      }
+    }
+
+    test("should layout border bottom inside of justify content space between container", root_node, root_layout);
+  }
+
+  {
+    css_node_t *root_node = new_test_css_node();
+    {
+      css_node_t *node_0 = root_node;
+      node_0->style.justify_content = CSS_JUSTIFY_CENTER;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->style.margin[CSS_TOP] = -6;
+      }
+    }
+
+    css_node_t *root_layout = new_test_css_node();
+    {
+      css_node_t *node_0 = root_layout;
+      node_0->layout.position[CSS_TOP] = 0;
+      node_0->layout.position[CSS_LEFT] = 0;
+      node_0->layout.dimensions[CSS_WIDTH] = 0;
+      node_0->layout.dimensions[CSS_HEIGHT] = 0;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->layout.position[CSS_TOP] = -3;
+        node_1->layout.position[CSS_LEFT] = 0;
+        node_1->layout.dimensions[CSS_WIDTH] = 0;
+        node_1->layout.dimensions[CSS_HEIGHT] = 0;
+      }
+    }
+
+    test("should layout negative margin top inside of justify content center container", root_node, root_layout);
+  }
+
+  {
+    css_node_t *root_node = new_test_css_node();
+    {
+      css_node_t *node_0 = root_node;
+      node_0->style.justify_content = CSS_JUSTIFY_CENTER;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->style.margin[CSS_TOP] = 20;
+      }
+    }
+
+    css_node_t *root_layout = new_test_css_node();
+    {
+      css_node_t *node_0 = root_layout;
+      node_0->layout.position[CSS_TOP] = 0;
+      node_0->layout.position[CSS_LEFT] = 0;
+      node_0->layout.dimensions[CSS_WIDTH] = 0;
+      node_0->layout.dimensions[CSS_HEIGHT] = 20;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->layout.position[CSS_TOP] = 20;
+        node_1->layout.position[CSS_LEFT] = 0;
+        node_1->layout.dimensions[CSS_WIDTH] = 0;
+        node_1->layout.dimensions[CSS_HEIGHT] = 0;
+      }
+    }
+
+    test("should layout positive margin top inside of justify content center container", root_node, root_layout);
+  }
+
+  {
+    css_node_t *root_node = new_test_css_node();
+    {
+      css_node_t *node_0 = root_node;
+      node_0->style.justify_content = CSS_JUSTIFY_FLEX_END;
+      node_0->style.border[CSS_BOTTOM] = 5;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+      }
+    }
+
+    css_node_t *root_layout = new_test_css_node();
+    {
+      css_node_t *node_0 = root_layout;
+      node_0->layout.position[CSS_TOP] = 0;
+      node_0->layout.position[CSS_LEFT] = 0;
+      node_0->layout.dimensions[CSS_WIDTH] = 0;
+      node_0->layout.dimensions[CSS_HEIGHT] = 5;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->layout.position[CSS_TOP] = 0;
+        node_1->layout.position[CSS_LEFT] = 0;
+        node_1->layout.dimensions[CSS_WIDTH] = 0;
+        node_1->layout.dimensions[CSS_HEIGHT] = 0;
+      }
+    }
+
+    test("should layout border bottom and flex end with an empty child", root_node, root_layout);
+  }
+
+  {
+    css_node_t *root_node = new_test_css_node();
+    {
+      css_node_t *node_0 = root_node;
+      node_0->style.dimensions[CSS_WIDTH] = 800;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->style.position[CSS_LEFT] = 5;
+        init_css_node_children(node_1, 1);
+        {
+          css_node_t *node_2;
+          node_2 = node_1->get_child(node_1->context, 0);
+        }
+      }
+    }
+
+    css_node_t *root_layout = new_test_css_node();
+    {
+      css_node_t *node_0 = root_layout;
+      node_0->layout.position[CSS_TOP] = 0;
+      node_0->layout.position[CSS_LEFT] = 0;
+      node_0->layout.dimensions[CSS_WIDTH] = 800;
+      node_0->layout.dimensions[CSS_HEIGHT] = 0;
+      init_css_node_children(node_0, 1);
+      {
+        css_node_t *node_1;
+        node_1 = node_0->get_child(node_0->context, 0);
+        node_1->layout.position[CSS_TOP] = 0;
+        node_1->layout.position[CSS_LEFT] = 5;
+        node_1->layout.dimensions[CSS_WIDTH] = 800;
+        node_1->layout.dimensions[CSS_HEIGHT] = 0;
+        init_css_node_children(node_1, 1);
+        {
+          css_node_t *node_2;
+          node_2 = node_1->get_child(node_1->context, 0);
+          node_2->layout.position[CSS_TOP] = 0;
+          node_2->layout.position[CSS_LEFT] = 0;
+          node_2->layout.dimensions[CSS_WIDTH] = 800;
+          node_2->layout.dimensions[CSS_HEIGHT] = 0;
+        }
+      }
+    }
+
+    test("should layout with children of a contain with left", root_node, root_layout);
   }
   /** END_GENERATED **/
   return tests_finished();

src/java/src/com/facebook/csslayout/LayoutEngine.java

@@ -340,8 +340,7 @@ public class LayoutEngine {
       if (getAlignItem(node, child) == CSSAlign.STRETCH &&
           getPositionType(child) == CSSPositionType.RELATIVE &&
           !CSSConstants.isUndefined(getLayoutDimension(node, getDim(crossAxis))) &&
-          !isDimDefined(child, crossAxis) &&
+          !isDimDefined(child, crossAxis)) {
-          !isPosDefined(child, getLeading(crossAxis))) {
         setLayoutDimension(child, getDim(crossAxis), Math.max(
           getLayoutDimension(node, getDim(crossAxis)) -
             getPaddingAndBorderAxis(node, crossAxis) -
@@ -426,7 +425,6 @@ public class LayoutEngine {
       }
     }
   
-  
     // <Loop B> Layout flexible children and allocate empty space
   
     // In order to position the elements in the main axis, we have two
@@ -435,73 +433,75 @@ public class LayoutEngine {
     float leadingMainDim = 0;
     float betweenMainDim = 0;
   
-    // If the dimensions of the current node is defined by its children, they
+    float definedMainDim = Math.max(mainContentDim, 0);
-    // are all going to be packed together and we don't need to compute
-    // anything.
     if (!CSSConstants.isUndefined(getLayoutDimension(node, getDim(mainAxis)))) {
-      // The remaining available space that needs to be allocated
+      definedMainDim = getLayoutDimension(node, getDim(mainAxis)) -
-      float remainingMainDim = getLayoutDimension(node, getDim(mainAxis)) -
+        getPaddingAndBorderAxis(node, mainAxis);
-        getPaddingAndBorderAxis(node, mainAxis) -
+    }
-        mainContentDim;
+    // The remaining available space that needs to be allocated
+    float remainingMainDim = definedMainDim - mainContentDim;
   
-      // If there are flexible children in the mix, they are going to fill the
+    // If there are flexible children in the mix, they are going to fill the
-      // remaining space
+    // remaining space
-      if (flexibleChildrenCount != 0) {
+    if (flexibleChildrenCount != 0) {
-        float flexibleMainDim = remainingMainDim / totalFlexible;
+      float flexibleMainDim = remainingMainDim / totalFlexible;
   
-        // The non flexible children can overflow the container, in this case
+      // The non flexible children can overflow the container, in this case
-        // we should just assume that there is no space available.
+      // we should just assume that there is no space available.
-        if (flexibleMainDim < 0) {
+      if (flexibleMainDim < 0) {
-          flexibleMainDim = 0;
+        flexibleMainDim = 0;
-        }
+      }
-        // We iterate over the full array and only apply the action on flexible
+      // We iterate over the full array and only apply the action on flexible
-        // children. This is faster than actually allocating a new array that
+      // children. This is faster than actually allocating a new array that
-        // contains only flexible children.
+      // contains only flexible children.
-        for (int i = 0; i < node.getChildCount(); ++i) {
+      for (int i = 0; i < node.getChildCount(); ++i) {
-          CSSNode child = node.getChildAt(i);
+        CSSNode child = node.getChildAt(i);
-          if (isFlex(child)) {
+        if (isFlex(child)) {
-            // At this point we know the final size of the element in the main
+          // At this point we know the final size of the element in the main
-            // dimension
+          // dimension
-            setLayoutDimension(child, getDim(mainAxis), flexibleMainDim * getFlex(child) +
+          setLayoutDimension(child, getDim(mainAxis), flexibleMainDim * getFlex(child) +
-              getPaddingAndBorderAxis(child, mainAxis));
+            getPaddingAndBorderAxis(child, mainAxis));
   
-            float maxWidth = CSSConstants.UNDEFINED;
+          float maxWidth = CSSConstants.UNDEFINED;
-            if (mainAxis == CSSFlexDirection.ROW) {
+          if (mainAxis == CSSFlexDirection.ROW) {
-              // do nothing
+            // do nothing
-            } else if (isDimDefined(node, CSSFlexDirection.ROW)) {
+          } else if (isDimDefined(node, CSSFlexDirection.ROW)) {
-              maxWidth = getLayoutDimension(node, getDim(CSSFlexDirection.ROW)) -
+            maxWidth = getLayoutDimension(node, getDim(CSSFlexDirection.ROW)) -
-                getPaddingAndBorderAxis(node, CSSFlexDirection.ROW);
+              getPaddingAndBorderAxis(node, CSSFlexDirection.ROW);
-            } else {
+          } else {
-              maxWidth = parentMaxWidth -
+            maxWidth = parentMaxWidth -
-                getMarginAxis(node, CSSFlexDirection.ROW) -
+              getMarginAxis(node, CSSFlexDirection.ROW) -
-                getPaddingAndBorderAxis(node, CSSFlexDirection.ROW);
+              getPaddingAndBorderAxis(node, CSSFlexDirection.ROW);
-            }
-  
-            // And we recursively call the layout algorithm for this child
-            layoutNode(child, maxWidth);
           }
-        }
   
-      // We use justifyContent to figure out how to allocate the remaining
+          // And we recursively call the layout algorithm for this child
-      // space available
+          layoutNode(child, maxWidth);
-      } else {
+        }
-        CSSJustify justifyContent = getJustifyContent(node);
+      }
-        if (justifyContent == CSSJustify.FLEX_START) {
+  
-          // Do nothing
+    // We use justifyContent to figure out how to allocate the remaining
-        } else if (justifyContent == CSSJustify.CENTER) {
+    // space available
-          leadingMainDim = remainingMainDim / 2;
+    } else {
-        } else if (justifyContent == CSSJustify.FLEX_END) {
+      CSSJustify justifyContent = getJustifyContent(node);
-          leadingMainDim = remainingMainDim;
+      if (justifyContent == CSSJustify.FLEX_START) {
-        } else if (justifyContent == CSSJustify.SPACE_BETWEEN) {
+        // Do nothing
-          remainingMainDim = Math.max(remainingMainDim, 0);
+      } else if (justifyContent == CSSJustify.CENTER) {
+        leadingMainDim = remainingMainDim / 2;
+      } else if (justifyContent == CSSJustify.FLEX_END) {
+        leadingMainDim = remainingMainDim;
+      } else if (justifyContent == CSSJustify.SPACE_BETWEEN) {
+        remainingMainDim = Math.max(remainingMainDim, 0);
+        if (flexibleChildrenCount + nonFlexibleChildrenCount - 1 != 0) {
           betweenMainDim = remainingMainDim /
             (flexibleChildrenCount + nonFlexibleChildrenCount - 1);
-        } else if (justifyContent == CSSJustify.SPACE_AROUND) {
+        } else {
-          // Space on the edges is half of the space between elements
+          betweenMainDim = 0;
-          betweenMainDim = remainingMainDim /
-            (flexibleChildrenCount + nonFlexibleChildrenCount);
-          leadingMainDim = betweenMainDim / 2;
         }
+      } else if (justifyContent == CSSJustify.SPACE_AROUND) {
+        // Space on the edges is half of the space between elements
+        betweenMainDim = remainingMainDim /
+          (flexibleChildrenCount + nonFlexibleChildrenCount);
+        leadingMainDim = betweenMainDim / 2;
       }
     }
   

src/java/tests/com/facebook/csslayout/LayoutEngineTest.java

@@ -3585,7 +3585,7 @@ public class LayoutEngineTest {
       }
     }
 
-    test("should calcluate left properly with position: absolute right", root_node, root_layout);
+    test("should calculate left properly with position: absolute right", root_node, root_layout);
   }
 
   @Test
@@ -3661,7 +3661,7 @@ public class LayoutEngineTest {
       }
     }
 
-    test("should calcluate left properly with position: absolute right and width", root_node, root_layout);
+    test("should calculate left properly with position: absolute right and width", root_node, root_layout);
   }
 
   @Test
@@ -3698,7 +3698,7 @@ public class LayoutEngineTest {
       }
     }
 
-    test("should calcluate top properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
+    test("should calculate top properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
   }
 
   @Test
@@ -3735,7 +3735,201 @@ public class LayoutEngineTest {
       }
     }
 
-    test("should calcluate left properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
+    test("should calculate left properly with position: absolute right, width, and no parent dimensions", root_node, root_layout);
+  }
+
+  @Test
+  public void testCase88()
+  {
+    TestCSSNode root_node = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_node;
+      node_0.style.justifyContent = CSSJustify.SPACE_BETWEEN;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.style.border[CSSStyle.SPACING_BOTTOM] = 1;
+      }
+    }
+
+    TestCSSNode root_layout = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_layout;
+      node_0.layout.y = 0;
+      node_0.layout.x = 0;
+      node_0.layout.width = 0;
+      node_0.layout.height = 1;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.layout.y = 0;
+        node_1.layout.x = 0;
+        node_1.layout.width = 0;
+        node_1.layout.height = 1;
+      }
+    }
+
+    test("should layout border bottom inside of justify content space between container", root_node, root_layout);
+  }
+
+  @Test
+  public void testCase89()
+  {
+    TestCSSNode root_node = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_node;
+      node_0.style.justifyContent = CSSJustify.CENTER;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.style.margin[CSSStyle.SPACING_TOP] = -6;
+      }
+    }
+
+    TestCSSNode root_layout = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_layout;
+      node_0.layout.y = 0;
+      node_0.layout.x = 0;
+      node_0.layout.width = 0;
+      node_0.layout.height = 0;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.layout.y = -3;
+        node_1.layout.x = 0;
+        node_1.layout.width = 0;
+        node_1.layout.height = 0;
+      }
+    }
+
+    test("should layout negative margin top inside of justify content center container", root_node, root_layout);
+  }
+
+  @Test
+  public void testCase90()
+  {
+    TestCSSNode root_node = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_node;
+      node_0.style.justifyContent = CSSJustify.CENTER;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.style.margin[CSSStyle.SPACING_TOP] = 20;
+      }
+    }
+
+    TestCSSNode root_layout = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_layout;
+      node_0.layout.y = 0;
+      node_0.layout.x = 0;
+      node_0.layout.width = 0;
+      node_0.layout.height = 20;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.layout.y = 20;
+        node_1.layout.x = 0;
+        node_1.layout.width = 0;
+        node_1.layout.height = 0;
+      }
+    }
+
+    test("should layout positive margin top inside of justify content center container", root_node, root_layout);
+  }
+
+  @Test
+  public void testCase91()
+  {
+    TestCSSNode root_node = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_node;
+      node_0.style.justifyContent = CSSJustify.FLEX_END;
+      node_0.style.border[CSSStyle.SPACING_BOTTOM] = 5;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+      }
+    }
+
+    TestCSSNode root_layout = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_layout;
+      node_0.layout.y = 0;
+      node_0.layout.x = 0;
+      node_0.layout.width = 0;
+      node_0.layout.height = 5;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.layout.y = 0;
+        node_1.layout.x = 0;
+        node_1.layout.width = 0;
+        node_1.layout.height = 0;
+      }
+    }
+
+    test("should layout border bottom and flex end with an empty child", root_node, root_layout);
+  }
+
+  @Test
+  public void testCase92()
+  {
+    TestCSSNode root_node = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_node;
+      node_0.style.width = 800;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.style.positionLeft = 5;
+        addChildren(node_1, 1);
+        {
+          TestCSSNode node_2;
+          node_2 = node_1.getChildAt(0);
+        }
+      }
+    }
+
+    TestCSSNode root_layout = new TestCSSNode();
+    {
+      TestCSSNode node_0 = root_layout;
+      node_0.layout.y = 0;
+      node_0.layout.x = 0;
+      node_0.layout.width = 800;
+      node_0.layout.height = 0;
+      addChildren(node_0, 1);
+      {
+        TestCSSNode node_1;
+        node_1 = node_0.getChildAt(0);
+        node_1.layout.y = 0;
+        node_1.layout.x = 5;
+        node_1.layout.width = 800;
+        node_1.layout.height = 0;
+        addChildren(node_1, 1);
+        {
+          TestCSSNode node_2;
+          node_2 = node_1.getChildAt(0);
+          node_2.layout.y = 0;
+          node_2.layout.x = 0;
+          node_2.layout.width = 800;
+          node_2.layout.height = 0;
+        }
+      }
+    }
+
+    test("should layout with children of a contain with left", root_node, root_layout);
   }
   /** END_GENERATED **/
 }

src/transpile.js

@@ -232,6 +232,7 @@ function transpileAnnotatedJStoC(jsCode) {
     .replace(/parent\./g, 'parent->')
     .replace(/var\/\*([^\/]+)\*\//g, '$1')
     .replace(/ === /g, ' == ')
+    .replace(/ !== /g, ' != ')
     .replace(/\n  /g, '\n')
     .replace(/\/\*\(c\)!([^*]+)\*\//g, '$1')
     .replace(/\/[*]!([^*]+)[*]\//g, '$1')