DaddyFrosty/yoga
1
0
Fork 0
Code Issues 96 Pull Requests 31 Actions Packages Projects Releases 33 Wiki Activity

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

Browse Source 
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
This commit is contained in:
Joe Vilches
2023-12-04 19:35:30 -08:00
committed by Facebook GitHub Bot
parent 382faa3f44
commit 59bf902a17
5 changed files with 11 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
gentest/fixtures/YGStaticPositionTest.html
View File

@@ -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>

2
java/tests/com/facebook/yoga/YGStaticPositionTest.java
View File

@@ -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);

4
javascript/tests/generated/YGStaticPositionTest.test.ts
View File

@@ -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;

4
tests/generated/YGStaticPositionTest.cpp
View File

@@ -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);

10
yoga/node/Node.cpp
View File

@@ -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
// properties (left, right, top, bottom, begin, end).
// In the case of position static these are just 0. See:
// https://www.w3.org/TR/css-position-3/#valdef-position-static
const float relativePositionMain =
relativePosition(mainAxis, directionRespectingRoot, mainSize);