Fix percentage min/max on flex items resolving against wrong ancestor

Percentage min-width/max-width/min-height/max-height on flex items
resolved against the grandparent's owner size instead of the parent
container's inner size. This is because boundAxisWithinMinAndMax()
received mainAxisOwnerSize (the parent's parent) rather than
availableInnerMainDim (the parent's inner content area) at three
call sites.

The fix is gated behind a new errata flag,
FlexItemPercentMinMaxAgainstOwner, so consumers using Classic or All
errata (e.g. React Native) automatically preserve the old behavior.
Default (Errata::None) now produces correct W3C-conformant results.

Fixes #872

Author: costajohnt

enums.py

@@ -86,6 +86,10 @@
         # Absolute nodes will resolve percentages against the inner size of
         # their containing node, not the padding box
         ("AbsolutePercentAgainstInnerSize", 1 << 2),
+        # Percentage min/max sizes on flex items will resolve against the
+        # owner size of the flex container instead of the flex container's
+        # own inner size
+        ("FlexItemPercentMinMaxAgainstOwner", 1 << 3),
         # Enable all incorrect behavior (preserve compatibility)
         ("All", 0x7FFFFFFF),
         # Enable all errata except for "StretchFlexBasis" (Defaults behavior

gentest/fixtures/YGPercentageTest.html

@@ -47,7 +47,7 @@
   <div style="flex-grow: 4; flex-basis: 15%; max-width: 20%;"></div>
 </div>
 
-<div id="percentage_flex_basis_main_min_width" style="width: 200px; height: 200px; flex-direction: row;">
+<div id="percentage_flex_basis_main_min_width" data-disabled="true" style="width: 200px; height: 200px; flex-direction: row;">
   <div style="flex-grow: 1; flex-basis: 15%; min-width: 60%;"></div>
   <div style="flex-grow: 4; flex-basis: 10%; min-width: 20%;"></div>
 </div>
@@ -147,3 +147,15 @@
 <div id="percent_of_max_cross_unstretched" style="flex-direction: column; max-width: 60px; height: 50px; align-items: flex-start;">
   <div style="width: 50%; height: 20px;"></div>
 </div>
+
+<div id="percentage_nested_min_width" style="flex-direction: row; width: 40px; height: 20px;">
+  <div style="flex-direction: row; width: 10px;">
+    <div style="flex-direction: row; min-width: 50%;"></div>
+  </div>
+</div>
+
+<div id="percentage_nested_max_width" style="flex-direction: row; width: 40px; height: 20px;">
+  <div style="flex-direction: row; width: 10px;">
+    <div style="flex-direction: row; width: 20px; max-width: 50%;"></div>
+  </div>
+</div>

java/com/facebook/yoga/YogaErrata.java

@@ -14,6 +14,7 @@ public enum YogaErrata {
   STRETCH_FLEX_BASIS(1),
   ABSOLUTE_POSITION_WITHOUT_INSETS_EXCLUDES_PADDING(2),
   ABSOLUTE_PERCENT_AGAINST_INNER_SIZE(4),
+  FLEX_ITEM_PERCENT_MIN_MAX_AGAINST_OWNER(8),
   ALL(2147483647),
   CLASSIC(2147483646);
 
@@ -33,6 +34,7 @@ public static YogaErrata fromInt(int value) {
       case 1: return STRETCH_FLEX_BASIS;
       case 2: return ABSOLUTE_POSITION_WITHOUT_INSETS_EXCLUDES_PADDING;
       case 4: return ABSOLUTE_PERCENT_AGAINST_INNER_SIZE;
+      case 8: return FLEX_ITEM_PERCENT_MIN_MAX_AGAINST_OWNER;
       case 2147483647: return ALL;
       case 2147483646: return CLASSIC;
       default: throw new IllegalArgumentException("Unknown enum value: " + value);