Add support for display: contents style

enums.py

@@ -31,7 +31,7 @@
         "SpaceEvenly",
     ],
     "PositionType": ["Static", "Relative", "Absolute"],
-    "Display": ["Flex", "None"],
+    "Display": ["Flex", "None", "Contents"],
     "Wrap": ["NoWrap", "Wrap", "WrapReverse"],
     "BoxSizing": ["BorderBox", "ContentBox"],
     "MeasureMode": ["Undefined", "Exactly", "AtMost"],

gentest/fixtures/YGDisplayTest.html

@@ -29,3 +29,61 @@
 <div id="display_none_with_position_absolute" style="width: 100px; height: 100px;">
   <div style="display:none; position: absolute; width: 100px; height: 100px"></div>
 </div>
+
+<div id="display_contents" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="display: contents;">
+    <div style="flex: 1; height: 10px;"></div>
+    <div style="flex: 1; height: 20px;"></div>
+  </div>
+</div>
+
+<div id="display_contents_fixed_size" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="display: contents; width: 50px; height: 50px;">
+    <div style="flex: 1; height: 10px;"></div>
+    <div style="flex: 1; height: 20px;"></div>
+  </div>
+</div>
+
+<div id="display_contents_with_margin" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="width: 20px; height: 20px; display: contents; margin: 10px;"></div>
+  <div style="flex-grow: 1;"></div>
+</div>
+
+<div id="display_contents_with_padding" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="display: contents; padding: 10px;">
+    <div style="flex: 1; height: 10px;"></div>
+    <div style="flex: 1; height: 20px;"></div>
+  </div>
+</div>
+
+<div id="display_contents_with_position" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="display: contents; top: 10px;">
+    <div style="flex: 1; height: 10px;"></div>
+    <div style="flex: 1; height: 20px;"></div>
+  </div>
+</div>
+
+<div id="display_contents_with_position_absolute" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="display: contents; position: absolute; width: 50px; height: 50px;">
+    <div style="flex: 1; height: 10px;"></div>
+    <div style="flex: 1; height: 20px;"></div>
+  </div>
+</div>
+
+<div id="display_contents_nested" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="display: contents;">
+    <div style="display: contents;">
+      <div style="flex: 1; height: 10px;"></div>
+      <div style="flex: 1; height: 20px;"></div>
+    </div>
+  </div>
+</div>
+
+<div id="display_contents_with_siblings" style="width: 100px; height: 100px; flex-direction: row;">
+  <div style="flex: 1; height: 30px;"></div>
+  <div style="display: contents;">
+    <div style="flex: 1; height: 10px;"></div>
+    <div style="flex: 1; height: 20px;"></div>
+  </div>
+  <div style="flex: 1; height: 30px;"></div>
+</div>

gentest/gentest-cpp.js

@@ -160,6 +160,7 @@ CPPEmitter.prototype = Object.create(Emitter.prototype, {
 
   YGDisplayFlex: {value: 'YGDisplayFlex'},
   YGDisplayNone: {value: 'YGDisplayNone'},
+  YGDisplayContents: {value: 'YGDisplayContents'},
   YGAuto: {value: 'YGAuto'},
 
   YGNodeCalculateLayout: {

gentest/gentest-java.js

@@ -195,6 +195,7 @@ JavaEmitter.prototype = Object.create(Emitter.prototype, {
 
   YGDisplayFlex: {value: 'YogaDisplay.FLEX'},
   YGDisplayNone: {value: 'YogaDisplay.NONE'},
+  YGDisplayContents: {value: 'YogaDisplay.CONTENTS'},
   YGAuto: {value: 'YogaConstants.AUTO'},
 
   YGWrapNoWrap: {value: 'YogaWrap.NO_WRAP'},

gentest/gentest-javascript.js

@@ -171,6 +171,7 @@ JavascriptEmitter.prototype = Object.create(Emitter.prototype, {
 
   YGDisplayFlex: {value: 'Display.Flex'},
   YGDisplayNone: {value: 'Display.None'},
+  YGDisplayContents: {value: 'Display.Contents'},
 
   YGBoxSizingBorderBox: {value: 'BoxSizing.BorderBox'},
   YGBoxSizingContentBox: {value: 'BoxSizing.ContentBox'},

gentest/gentest.js

@@ -665,6 +665,8 @@ function displayValue(e, value) {
       return e.YGDisplayFlex;
     case 'none':
       return e.YGDisplayNone;
+    case 'contents':
+      return e.YGDisplayContents;
   }
 }
 

java/com/facebook/yoga/YogaDisplay.java

@@ -11,7 +11,8 @@
 
 public enum YogaDisplay {
   FLEX(0),
-  NONE(1);
+  NONE(1),
+  CONTENTS(2);
 
   private final int mIntValue;
 
@@ -27,6 +28,7 @@ public static YogaDisplay fromInt(int value) {
     switch (value) {
       case 0: return FLEX;
       case 1: return NONE;
+      case 2: return CONTENTS;
       default: throw new IllegalArgumentException("Unknown enum value: " + value);
     }
   }

java/tests/generated/com/facebook/yoga/YGDisplayContentsTest.java

@@ -0,0 +1,107 @@
+/*
+ * Copyright (c) Meta Platforms, Inc. and affiliates.
+ *
+ * This source code is licensed under the MIT license found in the
+ * LICENSE file in the root directory of this source tree.
+ *
+ * @generated SignedSource<<be0d102e74e15f15050520f21afcaee1>>
+ * generated by gentest/gentest-driver.ts from gentest/fixtures/YGDisplayContentsTest.html
+ */
+
+package com.facebook.yoga;
+
+import static org.junit.Assert.assertEquals;
+
+import org.junit.Ignore;
+import org.junit.Test;
+import org.junit.runner.RunWith;
+import org.junit.runners.Parameterized;
+import com.facebook.yoga.utils.TestUtils;
+
+@RunWith(Parameterized.class)
+public class YGDisplayContentsTest {
+  @Parameterized.Parameters(name = "{0}")
+  public static Iterable<TestParametrization.NodeFactory> nodeFactories() {
+    return TestParametrization.nodeFactories();
+  }
+
+  @Parameterized.Parameter public TestParametrization.NodeFactory mNodeFactory;
+
+  @Test
+  public void test_test1() {
+    YogaConfig config = YogaConfigFactory.create();
+
+    final YogaNode root = createNode(config);
+    root.setFlexDirection(YogaFlexDirection.ROW);
+    root.setPositionType(YogaPositionType.ABSOLUTE);
+    root.setWidth(100f);
+    root.setHeight(100f);
+
+    final YogaNode root_child0 = createNode(config);
+    root_child0.setDisplay(YogaDisplay.CONTENTS);
+    root.addChildAt(root_child0, 0);
+
+    final YogaNode root_child0_child0 = createNode(config);
+    root_child0_child0.setFlexGrow(1f);
+    root_child0_child0.setFlexShrink(1f);
+    root_child0_child0.setFlexBasisPercent(0f);
+    root_child0_child0.setHeight(10f);
+    root_child0.addChildAt(root_child0_child0, 0);
+
+    final YogaNode root_child0_child1 = createNode(config);
+    root_child0_child1.setFlexGrow(1f);
+    root_child0_child1.setFlexShrink(1f);
+    root_child0_child1.setFlexBasisPercent(0f);
+    root_child0_child1.setHeight(20f);
+    root_child0.addChildAt(root_child0_child1, 1);
+    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(0f, root_child0.getLayoutWidth(), 0.0f);
+    assertEquals(0f, root_child0.getLayoutHeight(), 0.0f);
+
+    assertEquals(0f, root_child0_child0.getLayoutX(), 0.0f);
+    assertEquals(0f, root_child0_child0.getLayoutY(), 0.0f);
+    assertEquals(50f, root_child0_child0.getLayoutWidth(), 0.0f);
+    assertEquals(10f, root_child0_child0.getLayoutHeight(), 0.0f);
+
+    assertEquals(50f, root_child0_child1.getLayoutX(), 0.0f);
+    assertEquals(0f, root_child0_child1.getLayoutY(), 0.0f);
+    assertEquals(50f, root_child0_child1.getLayoutWidth(), 0.0f);
+    assertEquals(20f, root_child0_child1.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(0f, root_child0.getLayoutWidth(), 0.0f);
+    assertEquals(0f, root_child0.getLayoutHeight(), 0.0f);
+
+    assertEquals(50f, root_child0_child0.getLayoutX(), 0.0f);
+    assertEquals(0f, root_child0_child0.getLayoutY(), 0.0f);
+    assertEquals(50f, root_child0_child0.getLayoutWidth(), 0.0f);
+    assertEquals(10f, root_child0_child0.getLayoutHeight(), 0.0f);
+
+    assertEquals(0f, root_child0_child1.getLayoutX(), 0.0f);
+    assertEquals(0f, root_child0_child1.getLayoutY(), 0.0f);
+    assertEquals(50f, root_child0_child1.getLayoutWidth(), 0.0f);
+    assertEquals(20f, root_child0_child1.getLayoutHeight(), 0.0f);
+  }
+
+  private YogaNode createNode(YogaConfig config) {
+    return mNodeFactory.create(config);
+  }
+}