Summary: Pull Request resolved: https://github.com/facebook/yoga/pull/1286 This can be marked in fixtures to skip a test without commenting it out. We add one more usage of this. The same functionality existed (unused) before for `experiments`, which I changed to `data-experiments`. Formatting of JS tests changed to be closer to what Prettier would output, and to remove usage of `Yoga.UNDEFINED` which doesn't existi and just resolves to `undefined` (this is converted to NaN by the wrapper layer). Reviewed By: yungsters Differential Revision: D45723003 fbshipit-source-id: 337af319ab1c1c12047d6579da8c7e63b4f1537a
129 lines
4.8 KiB
HTML
129 lines
4.8 KiB
HTML
<div id="max_width" style="width: 100px; height: 100px;">
|
|
<div style="height: 10px; max-width: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="max_height" style="width: 100px; height: 100px; flex-direction: row;">
|
|
<div style="width: 10px; max-height: 50px;"></div>
|
|
</div>
|
|
|
|
<!-- TODO: Yoga's behavior is no longer in line with Chromium -->
|
|
<div id="min_height" data-disabled="true" style="width: 100px; height: 100px;">
|
|
<div style="flex-grow: 1; min-height: 60px;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<!-- TODO: Yoga's behavior is no longer in line with Chromium -->
|
|
<div id="min_width" data-disabled="true" style="width: 100px; height: 100px; flex-direction: row">
|
|
<div style="flex-grow: 1; min-width: 60px;"></div>
|
|
<div style="flex-grow: 1;"></div>
|
|
</div>
|
|
|
|
<div id="justify_content_min_max" style="max-height: 200px; min-height: 100px; width: 100px; justify-content: center;">
|
|
<div style="width: 60px; height: 60px;"></div>
|
|
</div>
|
|
|
|
<div id="align_items_min_max" style="max-width: 200px; min-width: 100px; height: 100px; align-items: center;">
|
|
<div style="width: 60px; height: 60px;"></div>
|
|
</div>
|
|
|
|
<div id="justify_content_overflow_min_max" style="min-height: 100px; max-height: 110px; justify-content: center;">
|
|
<div style="width: 50px; height: 50px;"></div>
|
|
<div style="width: 50px; height: 50px;"></div>
|
|
<div style="width: 50px; height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_to_min" style="min-height: 100px; max-height: 500px; width: 100px;">
|
|
<div style="flex-grow: 1; flex-shrink: 1;"></div>
|
|
<div style="height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_in_at_most_container" style="width: 100px; height: 100px; background-color: white; flex-direction: row; align-items: flex-start;">
|
|
<div style="flex-direction: row;">
|
|
<div style="flex-grow: 1; flex-basis: 0px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_child" style="flex-direction: row;">
|
|
<div style="height: 100px; flex-grow: 1; flex-basis: 0px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_min_max_column" style="min-height: 100px; max-height: 200px">
|
|
<div style="flex-grow:1;"></div>
|
|
<div style="height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_max_width" style="width: 200px; height: 100px;">
|
|
<div style="flex-direction: row; max-width: 100px;">
|
|
<div style="height: 20px; flex-grow: 1;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_max_width" style="width: 200px; height: 100px;">
|
|
<div style="flex-direction: row; max-width: 300px;">
|
|
<div style="height: 20px; flex-grow: 1;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_root_ignored" style="width: 100px; min-height: 100px; max-height:500px;flex-grow:1">
|
|
<div style="flex-basis:200px; flex-grow:1;"></div>
|
|
<div style="height:100px; "></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_root_minimized" style="width: 100px; min-height: 100px; max-height:500px">
|
|
<div style="min-height: 100px; max-height:500px;flex-grow:1">
|
|
<div style="flex-basis:200px; flex-grow:1;"></div>
|
|
<div style="height:100px; "></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_height_maximized" style="width: 100px; height:500px">
|
|
<div style="min-height: 100px; max-height:500px;flex-grow:1">
|
|
<div style="flex-basis:200px; flex-grow:1;"></div>
|
|
<div style="height:100px; "></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_min_row" style="min-width: 100px; height:100px; flex-direction: row;">
|
|
<div style="flex-grow:1;"></div>
|
|
<div style="width: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_min_column" style="min-height: 100px;">
|
|
<div style="flex-grow:1;"></div>
|
|
<div style="height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_max_row" style="width: 200px;">
|
|
<div style="height: 100px; max-width: 100px; flex-direction: row;">
|
|
<div style="flex-shrink:1; flex-basis:100px"></div>
|
|
<div style="width: 50px;"></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="flex_grow_within_constrained_max_column" style="max-height: 100px; width: 100px;">
|
|
<div style="flex-shrink:1; flex-basis:100px"></div>
|
|
<div style="height: 50px;"></div>
|
|
</div>
|
|
|
|
<div id="child_min_max_width_flexing" style="width: 120px; height: 50px; flex-direction: row; align-items:stretch">
|
|
<div style="min-width: 60px; flex-grow:1; flex-shrink:0; flex-basis: 0px"></div>
|
|
<div style="max-width: 20px; flex-grow:1; flex-shrink:0; flex-basis: 50%"></div>
|
|
</div>
|
|
|
|
<div id="min_width_overrides_width" style="min-width: 100px; width: 50px;">
|
|
</div>
|
|
|
|
<div id="max_width_overrides_width" style="max-width: 100px; width: 200px;">
|
|
</div>
|
|
|
|
<div id="min_height_overrides_height" style="min-height: 100px; height: 50px;">
|
|
</div>
|
|
|
|
<div id="max_height_overrides_height" style="max-height: 100px; height: 200px;">
|
|
</div>
|
|
|
|
<div id="min_max_percent_no_width_height" style="width: 100px; height: 100px; align-items: flex-start;">
|
|
<div style="min-width: 10%; max-width: 10%; min-height: 10%; max-height: 10%;">
|
|
</div>
|
|
</div>
|