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

Fix sizing of absolutely positioned nodes inside overflow:hidden parent

Browse Source 
Summary:
When an absolutely positioned node appeared inside an overflow:hidden
parent, we were limiting its height. This is inconsistent with how
layout behaves on the web.
Closes https://github.com/facebook/css-layout/pull/218

Reviewed By: lucasr

Differential Revision: D3797285

Pulled By: emilsjolander

fbshipit-source-id: 98f98e77aa26edce86b9882c1cac284799b69a27
This commit is contained in:
Adam Comella
2016-08-31 08:02:44 -07:00
committed by Facebook Github Bot 2
parent d9191431ff
commit b51e832e4e
3 changed files with 38 additions and 19 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
tests/CSSLayoutAbsolutePositionTest.cpp
View File

@@ -22,6 +22,11 @@
* <div id="absolute_layout_width_height_left_top_right_bottom" style="width: 100px; height: 100px;">
* <div style="width:10px; height: 10px; position: absolute; left: 10px; top: 10px; right: 10px; bottom: 10px;"></div>
* </div>
* <div id="do_not_clamp_height_of_absolute_node_to_height_of_its_overflow_hidden_parent" style="height: 50px; width: 50px; overflow: hidden; flex-direction: row;">
* <div style="position: absolute; left: 0; top: 0;">
* <div style="width: 100px; height: 100px;"></div>
* </div>
* </div>
*
*/
@@ -129,3 +134,36 @@ TEST(CSSLayoutTest, absolute_layout_width_height_left_top_right_bottom) {
ASSERT_EQ(10, CSSNodeLayoutGetWidth(root_child0));
ASSERT_EQ(10, CSSNodeLayoutGetHeight(root_child0));
}
TEST(CSSLayoutTest, do_not_clamp_height_of_absolute_node_to_height_of_its_overflow_hidden_parent) {
const CSSNodeRef root = CSSNodeNew();
CSSNodeStyleSetFlexDirection(root, CSSFlexDirectionRow);
CSSNodeStyleSetOverflow(root, CSSOverflowHidden);
CSSNodeStyleSetWidth(root, 50);
CSSNodeStyleSetHeight(root, 50);
const CSSNodeRef root_child0 = CSSNodeNew();
CSSNodeStyleSetPositionType(root_child0, CSSPositionTypeAbsolute);
CSSNodeInsertChild(root, root_child0, 0);
const CSSNodeRef root_child0_child0 = CSSNodeNew();
CSSNodeStyleSetWidth(root_child0_child0, 100);
CSSNodeStyleSetHeight(root_child0_child0, 100);
CSSNodeInsertChild(root_child0, root_child0_child0, 0);
CSSNodeCalculateLayout(root, CSSUndefined, CSSUndefined, CSSDirectionLTR);
ASSERT_EQ(0, CSSNodeLayoutGetLeft(root));
ASSERT_EQ(0, CSSNodeLayoutGetTop(root));
ASSERT_EQ(50, CSSNodeLayoutGetWidth(root));
ASSERT_EQ(50, CSSNodeLayoutGetHeight(root));
ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0));
ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0));
ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child0));
ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child0));
ASSERT_EQ(0, CSSNodeLayoutGetLeft(root_child0_child0));
ASSERT_EQ(0, CSSNodeLayoutGetTop(root_child0_child0));
ASSERT_EQ(100, CSSNodeLayoutGetWidth(root_child0_child0));
ASSERT_EQ(100, CSSNodeLayoutGetHeight(root_child0_child0));
}