Fixes layout of nodes with YGDisplayNone and YGPositionTypeAbsolute (#1068)

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

There is an issue in react-native when the Yoga node position type is set to absolute and display: none is set where the node layout calculation gives the absolute dimensions, rather than the expected 0 x 0.

Here are some OSS issues tracking this:
https://github.com/facebook/react-native/issues/18415
https://github.com/microsoft/react-native-windows/issues/7289

## Changelog

[General] [Fix] - Fixes layout of nodes with YGDisplayNone and YGPositionTypeAbsolute

Reviewed By: Andrey-Mishanin

Differential Revision: D26849307

fbshipit-source-id: 197618aa3c4e1b3b7efeba7ea4efd30b2d1c982d
This commit is contained in:
Eric Rozell
2021-03-10 13:08:48 -08:00
committed by Facebook GitHub Bot
parent 1745c23a12
commit 342aebe1d7
8 changed files with 201 additions and 21 deletions

View File

@@ -1,9 +1,10 @@
/**
* Copyright (c) Facebook, Inc. and its affiliates.
*
* This source code is licensed under the MIT license found in the LICENSE
* file in the root directory of this source tree.
* This source code is licensed under the MIT license found in the
* LICENSE file in the root directory of this source tree.
*/
// @Generated by gentest/gentest.rb from gentest/fixtures/YGDisplayTest.html
var Yoga = Yoga || require("../../sources/entry-" + process.env.TEST_ENTRY);
@@ -342,3 +343,48 @@ it("display_none_with_position", function () {
config.free();
}
});
it("display_none_with_position_absolute", function () {
var config = Yoga.Config.create();
try {
var root = Yoga.Node.create(config);
root.setWidth(100);
root.setHeight(100);
var root_child0 = Yoga.Node.create(config);
root_child0.setPositionType(Yoga.POSITION_TYPE_ABSOLUTE);
root_child0.setWidth(100);
root_child0.setHeight(100);
root_child0.setDisplay(Yoga.DISPLAY_NONE);
root.insertChild(root_child0, 0);
root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
console.assert(100 === root.getComputedWidth(), "100 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
console.assert(0 === root_child0.getComputedWidth(), "0 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
console.assert(0 === root_child0.getComputedHeight(), "0 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
console.assert(100 === root.getComputedWidth(), "100 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
console.assert(0 === root_child0.getComputedWidth(), "0 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
console.assert(0 === root_child0.getComputedHeight(), "0 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
} finally {
if (typeof root !== "undefined") {
root.freeRecursive();
}
config.free();
}
});