Insets no longer apply to statically positioned nodes (#1454)

Summary:
Pull Request resolved: https://github.com/facebook/yoga/pull/1454

X-link: https://github.com/facebook/react-native/pull/41369

One of the most basic aspects of statically positioned nodes is that [insets do not apply to them](https://developer.mozilla.org/en-US/docs/Web/CSS/position#static). So I put a guard inside `Node::relativePosition` where we take that into account when setting the position.

Reviewed By: NickGerleman

Differential Revision: D50507808

fbshipit-source-id: 7aab4138b06e60936db0ddb6019a9a30f1ded2db

gentest/fixtures/YGStaticPositionTest.html

@@ -1,11 +1,11 @@
 <!-- The top level divs in each test are needed so that each div overlays each
      other and the top measurement is accurate -->
-<div id="static_position_insets_have_no_effect_left_top" data-disabled="true">
+<div id="static_position_insets_have_no_effect_left_top">
     <div style="width: 100px; height: 100px; position: static; top: 50px; left: 50px;">
     </div>
 </div>
 
-<div id="static_position_insets_have_no_effect_right_bottom" data-disabled="true">
+<div id="static_position_insets_have_no_effect_right_bottom">
     <div style="width: 100px; height: 100px; position: static; bottom: 50px; right: 50px;">
     </div>
 </div>

java/tests/com/facebook/yoga/YGStaticPositionTest.java

@@ -26,7 +26,6 @@ public class YGStaticPositionTest {
   @Parameterized.Parameter public TestParametrization.NodeFactory mNodeFactory;
 
   @Test
-  @Ignore
   public void test_static_position_insets_have_no_effect_left_top() {
     YogaConfig config = YogaConfigFactory.create();
     config.setExperimentalFeatureEnabled(YogaExperimentalFeature.ABSOLUTE_PERCENTAGE_AGAINST_PADDING_EDGE, true);
@@ -69,7 +68,6 @@ public class YGStaticPositionTest {
   }
 
   @Test
-  @Ignore
   public void test_static_position_insets_have_no_effect_right_bottom() {
     YogaConfig config = YogaConfigFactory.create();
     config.setExperimentalFeatureEnabled(YogaExperimentalFeature.ABSOLUTE_PERCENTAGE_AGAINST_PADDING_EDGE, true);

javascript/tests/generated/YGStaticPositionTest.test.ts

@@ -25,7 +25,7 @@ import {
   Wrap,
 } from 'yoga-layout';
 
-test.skip('static_position_insets_have_no_effect_left_top', () => {
+test('static_position_insets_have_no_effect_left_top', () => {
   const config = Yoga.Config.create();
   let root;
 
@@ -73,7 +73,7 @@ test.skip('static_position_insets_have_no_effect_left_top', () => {
     config.free();
   }
 });
-test.skip('static_position_insets_have_no_effect_right_bottom', () => {
+test('static_position_insets_have_no_effect_right_bottom', () => {
   const config = Yoga.Config.create();
   let root;
 

tests/generated/YGStaticPositionTest.cpp

@@ -12,8 +12,6 @@
 #include <yoga/Yoga.h>
 
 TEST(YogaTest, static_position_insets_have_no_effect_left_top) {
-  GTEST_SKIP();
-
   const YGConfigRef config = YGConfigNew();
   YGConfigSetExperimentalFeatureEnabled(config, YGExperimentalFeatureAbsolutePercentageAgainstPaddingEdge, true);
 
@@ -57,8 +55,6 @@ TEST(YogaTest, static_position_insets_have_no_effect_left_top) {
 }
 
 TEST(YogaTest, static_position_insets_have_no_effect_right_bottom) {
-  GTEST_SKIP();
-
   const YGConfigRef config = YGConfigNew();
   YGConfigSetExperimentalFeatureEnabled(config, YGExperimentalFeatureAbsolutePercentageAgainstPaddingEdge, true);
 

yoga/node/Node.cpp

@@ -488,11 +488,16 @@ void Node::setLayoutDimension(float LengthValue, Dimension dimension) {
 }
 
 // If both left and right are defined, then use left. Otherwise return +left or
-// -right depending on which is defined.
+// -right depending on which is defined. Ignore statically positioned nodes as
+// insets do not apply to them.
 float Node::relativePosition(
     FlexDirection axis,
     Direction direction,
     float axisSize) const {
+  if (style_.positionType() == PositionType::Static &&
+      !hasErrata(Errata::PositionStaticBehavesLikeRelative)) {
+    return 0;
+  }
   if (isInlineStartPositionDefined(axis, direction)) {
     return getInlineStartPosition(axis, direction, axisSize);
   }
@@ -514,8 +519,7 @@ void Node::setPosition(
   const FlexDirection crossAxis =
       yoga::resolveCrossDirection(mainAxis, directionRespectingRoot);
 
-  // Here we should check for `PositionType::Static` and in this case zero inset
+  // In the case of position static these are just 0. See:
-  // properties (left, right, top, bottom, begin, end).
   // https://www.w3.org/TR/css-position-3/#valdef-position-static
   const float relativePositionMain =
       relativePosition(mainAxis, directionRespectingRoot, mainSize);