From 3770165f72e4fc35927c51d3d5873d9397b3ccd3 Mon Sep 17 00:00:00 2001
From: Pritesh Nandgaonkar <prit91@fb.com>
Date: Thu, 16 Aug 2018 06:22:10 -0700
Subject: [PATCH] Fix parent height calculation in case of baseline alignment

Summary:
Prior to this diff, if parents height was not set then the height of parent was deduced as max of childrens height(considering  line ht, padding, margin etc. ), but it didn't consider the baseline scenario where the previous logic will fail as then the parents height will be determined by the space taken by children above and below the reference baseline. I added a test case for the same.

Look at the diff D9088051 which shows the screenshot of the bug.
It is solved to https://pxl.cl/gvVk

Reviewed By: dsyang

Differential Revision: D9219678

fbshipit-source-id: f4a0b9f1452c33e78bd8c6cf39f6fcf538a04074
---
 ReactCommon/yoga/yoga/Yoga.cpp | 86 +++++++++++++++++++---------------
 1 file changed, 48 insertions(+), 38 deletions(-)

diff --git a/ReactCommon/yoga/yoga/Yoga.cpp b/ReactCommon/yoga/yoga/Yoga.cpp
index 86d66956f..e17766bcc 100644
--- a/ReactCommon/yoga/yoga/Yoga.cpp
+++ b/ReactCommon/yoga/yoga/Yoga.cpp
@@ -3152,47 +3152,46 @@ static void YGNodelayoutImpl(
   }
 
   // STEP 8: MULTI-LINE CONTENT ALIGNMENT
-  if (performLayout && (lineCount > 1 || YGIsBaselineLayout(node)) &&
-      !YGFloatIsUndefined(availableInnerCrossDim)) {
-    const float remainingAlignContentDim =
-        availableInnerCrossDim - totalLineCrossDim;
-
+  // currentLead stores the size of the cross dim
+  float currentLead = leadingPaddingAndBorderCross;
+  if (performLayout && (lineCount > 1 || YGIsBaselineLayout(node))) {
     float crossDimLead = 0;
-    float currentLead = leadingPaddingAndBorderCross;
-
-    switch (node->getStyle().alignContent) {
-      case YGAlignFlexEnd:
-        currentLead += remainingAlignContentDim;
-        break;
-      case YGAlignCenter:
-        currentLead += remainingAlignContentDim / 2;
-        break;
-      case YGAlignStretch:
-        if (availableInnerCrossDim > totalLineCrossDim) {
-          crossDimLead = remainingAlignContentDim / lineCount;
-        }
-        break;
-      case YGAlignSpaceAround:
-        if (availableInnerCrossDim > totalLineCrossDim) {
-          currentLead += remainingAlignContentDim / (2 * lineCount);
-          if (lineCount > 1) {
+    if (!YGFloatIsUndefined(availableInnerCrossDim)) {
+      const float remainingAlignContentDim =
+          availableInnerCrossDim - totalLineCrossDim;
+      switch (node->getStyle().alignContent) {
+        case YGAlignFlexEnd:
+          currentLead += remainingAlignContentDim;
+          break;
+        case YGAlignCenter:
+          currentLead += remainingAlignContentDim / 2;
+          break;
+        case YGAlignStretch:
+          if (availableInnerCrossDim > totalLineCrossDim) {
             crossDimLead = remainingAlignContentDim / lineCount;
           }
-        } else {
-          currentLead += remainingAlignContentDim / 2;
-        }
-        break;
-      case YGAlignSpaceBetween:
-        if (availableInnerCrossDim > totalLineCrossDim && lineCount > 1) {
-          crossDimLead = remainingAlignContentDim / (lineCount - 1);
-        }
-        break;
-      case YGAlignAuto:
-      case YGAlignFlexStart:
-      case YGAlignBaseline:
-        break;
+          break;
+        case YGAlignSpaceAround:
+          if (availableInnerCrossDim > totalLineCrossDim) {
+            currentLead += remainingAlignContentDim / (2 * lineCount);
+            if (lineCount > 1) {
+              crossDimLead = remainingAlignContentDim / lineCount;
+            }
+          } else {
+            currentLead += remainingAlignContentDim / 2;
+          }
+          break;
+        case YGAlignSpaceBetween:
+          if (availableInnerCrossDim > totalLineCrossDim && lineCount > 1) {
+            crossDimLead = remainingAlignContentDim / (lineCount - 1);
+          }
+          break;
+        case YGAlignAuto:
+        case YGAlignFlexStart:
+        case YGAlignBaseline:
+          break;
+      }
     }
-
     uint32_t endIndex = 0;
     for (uint32_t i = 0; i < lineCount; i++) {
       const uint32_t startIndex = endIndex;
@@ -3394,7 +3393,6 @@ static void YGNodelayoutImpl(
        measureModeCrossDim == YGMeasureModeAtMost)) {
     // Clamp the size to the min/max size, if specified, and make sure it
     // doesn't go below the padding and border amount.
-
     node->setLayoutMeasuredDimension(
         YGNodeBoundAxis(
             node,
@@ -3420,6 +3418,18 @@ static void YGNodelayoutImpl(
         dim[crossAxis]);
   }
 
+  if (performLayout &&
+      node->getStyle().dimensions[dim[crossAxis]].unit == YGUnitAuto &&
+      node->getStyle().alignItems == YGAlignBaseline) {
+    node->setLayoutMeasuredDimension(
+        YGNodeBoundAxis(
+            node,
+            crossAxis,
+            currentLead + paddingAndBorderAxisRow,
+            crossAxisownerSize,
+            ownerWidth),
+        dim[crossAxis]);
+  }
   // As we only wrapped in normal direction yet, we need to reverse the
   // positions on wrap-reverse.
   if (performLayout && node->getStyle().flexWrap == YGWrapWrapReverse) {