Skip to content

Commit

Permalink
Make position static behave like position static (#1482)
Browse files Browse the repository at this point in the history 
Summary:
Pull Request resolved: #1482

X-link: facebook/react-native#41685

This is the final step (that I know of) to get the core features of static working. Here we turn on all of the tests and pass down the correct owner size for the call to `calculateLayoutInternal` that is in `layoutAbsoluteChild`

Reviewed By: NickGerleman

Differential Revision: D51293606

fbshipit-source-id: 972259e7ebecb19b55aef2ef866bd7cb57aaf0ca
  • Loading branch information
@joevilches @facebook-github-bot
joevilches authored and facebook-github-bot committed Dec 8, 2023
1 parent 1b146cd commit f6c4a8e
Show file tree
Hide file tree
Showing 5 changed files with 72 additions and 174 deletions.
68 changes: 34 additions & 34 deletions gentest/fixtures/YGStaticPositionTest.html
View file
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@
</div>
</div>

<div id="static_position_absolute_child_insets_relative_to_positioned_ancestor" data-disabled="true">
<div id="static_position_absolute_child_insets_relative_to_positioned_ancestor">
<div style="width: 200px; height: 200px; position: relative">
<div style="height: 100px; width: 100px; margin-left: 100px; position: static">
<div style="height: 50px; width: 50px; position: absolute; top: 50px; left: 50px;">
Expand All @@ -19,7 +19,7 @@
</div>
</div>

<div id="static_position_absolute_child_insets_relative_to_positioned_ancestor_deep" data-disabled="true">
<div id="static_position_absolute_child_insets_relative_to_positioned_ancestor_deep">
<div style="width: 200px; height: 200px; position: relative">
<div style="height: 100px; width: 100px; margin-left: 100px; position: static">
<div style="height: 100px; width: 100px; margin-left: 100px; position: static">
Expand All @@ -34,7 +34,7 @@
</div>
</div>

<div id="static_position_absolute_child_width_percentage" data-disabled="true">
<div id="static_position_absolute_child_width_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50%; position: absolute">
Expand All @@ -43,7 +43,7 @@
</div>
</div>

<div id="static_position_relative_child_width_percentage" data-disabled="true">
<div id="static_position_relative_child_width_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50%; position: relative">
Expand All @@ -52,7 +52,7 @@
</div>
</div>

<div id="static_position_static_child_width_percentage" data-disabled="true">
<div id="static_position_static_child_width_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50%; position: static">
Expand All @@ -61,7 +61,7 @@
</div>
</div>

<div id="static_position_absolute_child_height_percentage" data-disabled="true">
<div id="static_position_absolute_child_height_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50%; width: 50px; position: absolute">
Expand All @@ -70,7 +70,7 @@
</div>
</div>

<div id="static_position_relative_child_height_percentage" data-disabled="true">
<div id="static_position_relative_child_height_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50%; width: 50px; position: relative">
Expand All @@ -79,7 +79,7 @@
</div>
</div>

<div id="static_position_static_child_height_percentage" data-disabled="true">
<div id="static_position_static_child_height_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50%; width: 50px; position: static">
Expand All @@ -88,7 +88,7 @@
</div>
</div>

<div id="static_position_absolute_child_left_percentage" data-disabled="true">
<div id="static_position_absolute_child_left_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; left: 50%; position: absolute">
Expand All @@ -97,7 +97,7 @@
</div>
</div>

<div id="static_position_relative_child_left_percentage" data-disabled="true">
<div id="static_position_relative_child_left_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; left: 50%; position: relative">
Expand All @@ -106,7 +106,7 @@
</div>
</div>

<div id="static_position_static_child_left_percentage" data-disabled="true">
<div id="static_position_static_child_left_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; left: 50%; position: static">
Expand All @@ -115,7 +115,7 @@
</div>
</div>

<div id="static_position_absolute_child_right_percentage" data-disabled="true">
<div id="static_position_absolute_child_right_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; right: 50%; position: absolute">
Expand All @@ -124,7 +124,7 @@
</div>
</div>

<div id="static_position_relative_child_right_percentage" data-disabled="true">
<div id="static_position_relative_child_right_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; right: 50%; position: relative">
Expand All @@ -133,7 +133,7 @@
</div>
</div>

<div id="static_position_static_child_right_percentage" data-disabled="true">
<div id="static_position_static_child_right_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; right: 50%; position: static">
Expand All @@ -142,7 +142,7 @@
</div>
</div>

<div id="static_position_absolute_child_top_percentage" data-disabled="true">
<div id="static_position_absolute_child_top_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; top: 50%; position: absolute">
Expand All @@ -151,7 +151,7 @@
</div>
</div>

<div id="static_position_relative_child_top_percentage" data-disabled="true">
<div id="static_position_relative_child_top_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; top: 50%; position: relative">
Expand All @@ -160,7 +160,7 @@
</div>
</div>

<div id="static_position_static_child_top_percentage" data-disabled="true">
<div id="static_position_static_child_top_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; top: 50%; position: static">
Expand All @@ -169,7 +169,7 @@
</div>
</div>

<div id="static_position_absolute_child_bottom_percentage" data-disabled="true">
<div id="static_position_absolute_child_bottom_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; bottom: 50%; position: absolute">
Expand All @@ -178,7 +178,7 @@
</div>
</div>

<div id="static_position_relative_child_bottom_percentage" data-disabled="true">
<div id="static_position_relative_child_bottom_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; bottom: 50%; position: relative">
Expand All @@ -187,7 +187,7 @@
</div>
</div>

<div id="static_position_static_child_bottom_percentage" data-disabled="true">
<div id="static_position_static_child_bottom_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; bottom: 50%; position: static">
Expand All @@ -196,7 +196,7 @@
</div>
</div>

<div id="static_position_absolute_child_margin_percentage" data-disabled="true">
<div id="static_position_absolute_child_margin_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; margin: 50%; position: absolute">
Expand All @@ -205,7 +205,7 @@
</div>
</div>

<div id="static_position_relative_child_margin_percentage" data-disabled="true">
<div id="static_position_relative_child_margin_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; margin: 50%; position: relative">
Expand All @@ -214,7 +214,7 @@
</div>
</div>

<div id="static_position_static_child_margin_percentage" data-disabled="true">
<div id="static_position_static_child_margin_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; margin: 50%; position: static">
Expand All @@ -223,7 +223,7 @@
</div>
</div>

<div id="static_position_absolute_child_padding_percentage" data-disabled="true">
<div id="static_position_absolute_child_padding_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; padding: 50%; position: absolute">
Expand All @@ -232,7 +232,7 @@
</div>
</div>

<div id="static_position_relative_child_padding_percentage" data-disabled="true">
<div id="static_position_relative_child_padding_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; padding: 50%; position: relative">
Expand All @@ -241,7 +241,7 @@
</div>
</div>

<div id="static_position_static_child_padding_percentage" data-disabled="true">
<div id="static_position_static_child_padding_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; padding: 50%; position: static">
Expand All @@ -250,7 +250,7 @@
</div>
</div>

<div id="static_position_absolute_child_border_percentage" data-disabled="true">
<div id="static_position_absolute_child_border_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; border: 50%; position: absolute">
Expand All @@ -259,7 +259,7 @@
</div>
</div>

<div id="static_position_relative_child_border_percentage" data-disabled="true">
<div id="static_position_relative_child_border_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; border: 50%; position: relative">
Expand All @@ -268,7 +268,7 @@
</div>
</div>

<div id="static_position_static_child_border_percentage" data-disabled="true">
<div id="static_position_static_child_border_percentage">
<div style="width: 200px; height: 200px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50px; border: 50%; position: static">
Expand All @@ -277,7 +277,7 @@
</div>
</div>

<div id="static_position_absolute_child_containing_block_padding_box" data-disabled="true">
<div id="static_position_absolute_child_containing_block_padding_box">
<div style="width: 400px; height: 400px; padding: 100px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50%; position: absolute">
Expand All @@ -286,7 +286,7 @@
</div>
</div>

<div id="static_position_relative_child_containing_block_padding_box" data-disabled="true">
<div id="static_position_relative_child_containing_block_padding_box">
<div style="width: 400px; height: 400px; padding: 100px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50%; position: relative">
Expand All @@ -295,7 +295,7 @@
</div>
</div>

<div id="static_position_static_child_containing_block_padding_box" data-disabled="true">
<div id="static_position_static_child_containing_block_padding_box">
<div style="width: 400px; height: 400px; padding: 100px; position: relative">
<div style="height:100px; width: 100px; position: static">
<div style="height: 50px; width: 50%; position: static">
Expand All @@ -311,14 +311,14 @@
</div>
</div>

<div id="static_position_relative_child_containing_block_content_box" data-disabled="true">
<div id="static_position_relative_child_containing_block_content_box">
<div style="width: 400px; height: 400px; padding: 100px; position: relative">
<div style="height:50px; width: 50%; position: relative">
</div>
</div>
</div>

<div id="static_position_static_child_containing_block_content_box" data-disabled="true">
<div id="static_position_static_child_containing_block_content_box">
<div style="width: 400px; height: 400px; padding: 100px; position: relative">
<div style="height:50px; width: 50%; position: static">
</div>
Expand Down
Loading

0 comments on commit f6c4a8e

Please sign in to comment.