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

Added support for min/max width and height constraints.

Browse Source
This commit is contained in:
Russell Keith-Magee
2015-03-31 17:27:13 +08:00
parent cf3f7ccda1
commit c523b7c404
13 changed files with 2179 additions and 73 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/__tests__/Layout-random-test.js
View File

@@ -49,6 +49,10 @@ describe('Random layout', function() {
var node = {style: {}};
randMinMax(node, 0.5, 'width', -100, 1000);
randMinMax(node, 0.5, 'height', -100, 1000);
randMinMax(node, 0.5, 'minWidth', -100, 1000);
randMinMax(node, 0.5, 'minHeight', -100, 1000);
randMinMax(node, 0.5, 'maxWidth', -100, 1000);
randMinMax(node, 0.5, 'maxHeight', -100, 1000);
randMinMax(node, 0.5, 'top', -10, 10);
randMinMax(node, 0.5, 'left', -10, 10);
randMinMax(node, 0.5, 'right', -10, 10);

813
src/__tests__/Layout-test.c
View File

@@ -3768,6 +3768,819 @@ int main()
test("should layout flex wrap with a line bigger than container", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 100;
node_0->style.dimensions[CSS_HEIGHT] = 200;
node_0->style.maxDimensions[CSS_WIDTH] = 90;
node_0->style.maxDimensions[CSS_HEIGHT] = 190;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 90;
node_0->layout.dimensions[CSS_HEIGHT] = 190;
}
test("should use max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 100;
node_0->style.dimensions[CSS_HEIGHT] = 200;
node_0->style.minDimensions[CSS_WIDTH] = 110;
node_0->style.minDimensions[CSS_HEIGHT] = 210;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 110;
node_0->layout.dimensions[CSS_HEIGHT] = 210;
}
test("should use min bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 100;
node_0->style.dimensions[CSS_HEIGHT] = 200;
node_0->style.maxDimensions[CSS_WIDTH] = 90;
node_0->style.maxDimensions[CSS_HEIGHT] = 190;
node_0->style.minDimensions[CSS_WIDTH] = 110;
node_0->style.minDimensions[CSS_HEIGHT] = 210;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 110;
node_0->layout.dimensions[CSS_HEIGHT] = 210;
}
test("should use min bounds over max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 100;
node_0->style.dimensions[CSS_HEIGHT] = 200;
node_0->style.maxDimensions[CSS_WIDTH] = 80;
node_0->style.maxDimensions[CSS_HEIGHT] = 180;
node_0->style.minDimensions[CSS_WIDTH] = 90;
node_0->style.minDimensions[CSS_HEIGHT] = 190;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 90;
node_0->layout.dimensions[CSS_HEIGHT] = 190;
}
test("should use min bounds over max bounds and natural width", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 100;
node_0->style.dimensions[CSS_HEIGHT] = 200;
node_0->style.minDimensions[CSS_WIDTH] = -10;
node_0->style.minDimensions[CSS_HEIGHT] = -20;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 100;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
}
test("should ignore negative min bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 100;
node_0->style.dimensions[CSS_HEIGHT] = 200;
node_0->style.maxDimensions[CSS_WIDTH] = -10;
node_0->style.maxDimensions[CSS_HEIGHT] = -20;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 100;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
}
test("should ignore negative max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.maxDimensions[CSS_WIDTH] = 30;
node_0->style.maxDimensions[CSS_HEIGHT] = 10;
node_0->style.padding[CSS_LEFT] = 20;
node_0->style.padding[CSS_TOP] = 15;
node_0->style.padding[CSS_RIGHT] = 20;
node_0->style.padding[CSS_BOTTOM] = 15;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 40;
node_0->layout.dimensions[CSS_HEIGHT] = 30;
}
test("should use padded size over max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.minDimensions[CSS_WIDTH] = 50;
node_0->style.minDimensions[CSS_HEIGHT] = 40;
node_0->style.padding[CSS_LEFT] = 20;
node_0->style.padding[CSS_TOP] = 15;
node_0->style.padding[CSS_RIGHT] = 20;
node_0->style.padding[CSS_BOTTOM] = 15;
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 50;
node_0->layout.dimensions[CSS_HEIGHT] = 40;
}
test("should use min size over padded size", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.flex_direction = CSS_FLEX_DIRECTION_ROW;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 3);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.flex = 1;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.flex = 1;
node_1->style.minDimensions[CSS_WIDTH] = 200;
node_1 = node_0->get_child(node_0->context, 2);
node_1->style.flex = 1;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 3);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 50;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
node_1 = node_0->get_child(node_0->context, 2);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 250;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
}
}
test("should override flex direction size with min bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.flex_direction = CSS_FLEX_DIRECTION_ROW;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 3);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.flex = 1;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.flex = 1;
node_1->style.maxDimensions[CSS_WIDTH] = 110;
node_1->style.minDimensions[CSS_WIDTH] = 90;
node_1 = node_0->get_child(node_0->context, 2);
node_1->style.flex = 1;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 3);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 100;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 100;
node_1->layout.dimensions[CSS_WIDTH] = 100;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
node_1 = node_0->get_child(node_0->context, 2);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 200;
node_1->layout.dimensions[CSS_WIDTH] = 100;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
}
}
test("should not override flex direction size within bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.flex_direction = CSS_FLEX_DIRECTION_ROW;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 3);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.flex = 1;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.flex = 1;
node_1->style.maxDimensions[CSS_WIDTH] = 60;
node_1 = node_0->get_child(node_0->context, 2);
node_1->style.flex = 1;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 3);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 120;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 120;
node_1->layout.dimensions[CSS_WIDTH] = 60;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
node_1 = node_0->get_child(node_0->context, 2);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 180;
node_1->layout.dimensions[CSS_WIDTH] = 120;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
}
}
test("should override flex direction size with max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.flex = 1;
node_1->style.maxDimensions[CSS_WIDTH] = 310;
node_1->style.minDimensions[CSS_WIDTH] = 290;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 300;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
}
}
test("should pre-fill child size within bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.flex = 1;
node_1->style.maxDimensions[CSS_WIDTH] = 290;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 290;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
}
}
test("should pre-fill child size within max bound", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.flex = 1;
node_1->style.minDimensions[CSS_WIDTH] = 310;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 200;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 310;
node_1->layout.dimensions[CSS_HEIGHT] = 200;
}
}
test("should pre-fill child size within min bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.maxDimensions[CSS_WIDTH] = 300;
node_0->style.maxDimensions[CSS_HEIGHT] = 700;
node_0->style.minDimensions[CSS_WIDTH] = 100;
node_0->style.minDimensions[CSS_HEIGHT] = 500;
init_css_node_children(node_0, 2);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_WIDTH] = 200;
node_1->style.dimensions[CSS_HEIGHT] = 300;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.dimensions[CSS_WIDTH] = 200;
node_1->style.dimensions[CSS_HEIGHT] = 300;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 200;
node_0->layout.dimensions[CSS_HEIGHT] = 600;
init_css_node_children(node_0, 2);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 300;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 300;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 300;
}
}
test("should set parents size based on bounded children", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.maxDimensions[CSS_WIDTH] = 100;
node_0->style.maxDimensions[CSS_HEIGHT] = 500;
init_css_node_children(node_0, 2);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_WIDTH] = 200;
node_1->style.dimensions[CSS_HEIGHT] = 300;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.dimensions[CSS_WIDTH] = 200;
node_1->style.dimensions[CSS_HEIGHT] = 300;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 100;
node_0->layout.dimensions[CSS_HEIGHT] = 500;
init_css_node_children(node_0, 2);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 300;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 300;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 300;
}
}
test("should set parents size based on max bounded children", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.minDimensions[CSS_WIDTH] = 300;
node_0->style.minDimensions[CSS_HEIGHT] = 700;
init_css_node_children(node_0, 2);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_WIDTH] = 200;
node_1->style.dimensions[CSS_HEIGHT] = 300;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.dimensions[CSS_WIDTH] = 200;
node_1->style.dimensions[CSS_HEIGHT] = 300;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 300;
node_0->layout.dimensions[CSS_HEIGHT] = 700;
init_css_node_children(node_0, 2);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 300;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 300;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 200;
node_1->layout.dimensions[CSS_HEIGHT] = 300;
}
}
test("should set parents size based on min bounded children", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.align_items = CSS_ALIGN_STRETCH;
node_0->style.dimensions[CSS_WIDTH] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_HEIGHT] = 100;
node_1->style.maxDimensions[CSS_WIDTH] = 1100;
node_1->style.maxDimensions[CSS_HEIGHT] = 110;
node_1->style.minDimensions[CSS_WIDTH] = 900;
node_1->style.minDimensions[CSS_HEIGHT] = 90;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 1000;
node_0->layout.dimensions[CSS_HEIGHT] = 100;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 1000;
node_1->layout.dimensions[CSS_HEIGHT] = 100;
}
}
test("should keep stretched size within bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.align_items = CSS_ALIGN_STRETCH;
node_0->style.dimensions[CSS_WIDTH] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_HEIGHT] = 100;
node_1->style.maxDimensions[CSS_WIDTH] = 900;
node_1->style.maxDimensions[CSS_HEIGHT] = 90;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 1000;
node_0->layout.dimensions[CSS_HEIGHT] = 90;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 900;
node_1->layout.dimensions[CSS_HEIGHT] = 90;
}
}
test("should keep stretched size within max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.align_items = CSS_ALIGN_STRETCH;
node_0->style.dimensions[CSS_WIDTH] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_HEIGHT] = 100;
node_1->style.minDimensions[CSS_WIDTH] = 1100;
node_1->style.minDimensions[CSS_HEIGHT] = 110;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 1000;
node_0->layout.dimensions[CSS_HEIGHT] = 110;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 1100;
node_1->layout.dimensions[CSS_HEIGHT] = 110;
}
}
test("should keep stretched size within min bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.flex_direction = CSS_FLEX_DIRECTION_ROW;
node_0->style.dimensions[CSS_WIDTH] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_HEIGHT] = 100;
node_1->style.minDimensions[CSS_WIDTH] = 100;
node_1->style.minDimensions[CSS_HEIGHT] = 110;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 1000;
node_0->layout.dimensions[CSS_HEIGHT] = 110;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 0;
node_1->layout.position[CSS_LEFT] = 0;
node_1->layout.dimensions[CSS_WIDTH] = 100;
node_1->layout.dimensions[CSS_HEIGHT] = 110;
}
}
test("should keep cross axis size within min bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 1000;
node_0->style.dimensions[CSS_HEIGHT] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.position_type = CSS_POSITION_ABSOLUTE;
node_1->style.maxDimensions[CSS_WIDTH] = 500;
node_1->style.maxDimensions[CSS_HEIGHT] = 600;
node_1->style.position[CSS_LEFT] = 100;
node_1->style.position[CSS_TOP] = 100;
node_1->style.position[CSS_RIGHT] = 100;
node_1->style.position[CSS_BOTTOM] = 100;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 1000;
node_0->layout.dimensions[CSS_HEIGHT] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 100;
node_1->layout.position[CSS_LEFT] = 100;
node_1->layout.dimensions[CSS_WIDTH] = 500;
node_1->layout.dimensions[CSS_HEIGHT] = 600;
}
}
test("should layout node with position absolute, top and left and max bounds", root_node, root_layout);
}
{
css_node_t *root_node = new_test_css_node();
{
css_node_t *node_0 = root_node;
node_0->style.dimensions[CSS_WIDTH] = 1000;
node_0->style.dimensions[CSS_HEIGHT] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.position_type = CSS_POSITION_ABSOLUTE;
node_1->style.minDimensions[CSS_WIDTH] = 900;
node_1->style.minDimensions[CSS_HEIGHT] = 1000;
node_1->style.position[CSS_LEFT] = 100;
node_1->style.position[CSS_TOP] = 100;
node_1->style.position[CSS_RIGHT] = 100;
node_1->style.position[CSS_BOTTOM] = 100;
}
}
css_node_t *root_layout = new_test_css_node();
{
css_node_t *node_0 = root_layout;
node_0->layout.position[CSS_TOP] = 0;
node_0->layout.position[CSS_LEFT] = 0;
node_0->layout.dimensions[CSS_WIDTH] = 1000;
node_0->layout.dimensions[CSS_HEIGHT] = 1000;
init_css_node_children(node_0, 1);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 100;
node_1->layout.position[CSS_LEFT] = 100;
node_1->layout.dimensions[CSS_WIDTH] = 900;
node_1->layout.dimensions[CSS_HEIGHT] = 1000;
}
}
test("should layout node with position absolute, top and left and min bounds", root_node, root_layout);
}
/** END_GENERATED **/
return tests_finished();
}

239
src/__tests__/Layout-test.js
View File

@@ -1244,4 +1244,243 @@ describe('Layout', function() {
);
});
it('should use max bounds', function() {
testLayout(
{style: {width: 100, height: 200, maxWidth: 90, maxHeight: 190}},
{width: 90, height: 190, top: 0, left: 0}
);
});
it('should use min bounds', function() {
testLayout(
{style: {width: 100, height: 200, minWidth: 110, minHeight: 210}},
{width: 110, height: 210, top: 0, left: 0}
);
});
it('should use min bounds over max bounds', function() {
testLayout(
{style: {width: 100, height: 200, minWidth: 110, maxWidth: 90, minHeight: 210, maxHeight: 190}},
{width: 110, height: 210, top: 0, left: 0}
);
});
it('should use min bounds over max bounds and natural width', function() {
testLayout(
{style: {width: 100, height: 200, minWidth: 90, maxWidth: 80, minHeight: 190, maxHeight: 180}},
{width: 90, height: 190, top: 0, left: 0}
);
});
it('should ignore negative min bounds', function() {
testLayout(
{style: {width: 100, height: 200, minWidth: -10, minHeight: -20}},
{width: 100, height: 200, top: 0, left: 0}
);
});
it('should ignore negative max bounds', function() {
testLayout(
{style: {width: 100, height: 200, maxWidth: -10, maxHeight: -20}},
{width: 100, height: 200, top: 0, left: 0}
);
});
it('should use padded size over max bounds', function() {
testLayout(
{style: {paddingTop: 15, paddingBottom: 15, paddingLeft: 20, paddingRight: 20, maxWidth: 30, maxHeight: 10}},
{width: 40, height: 30, top: 0, left: 0}
);
});
it('should use min size over padded size', function() {
testLayout(
{style: {paddingTop: 15, paddingBottom: 15, paddingLeft: 20, paddingRight: 20, minWidth: 50, minHeight: 40}},
{width: 50, height: 40, top: 0, left: 0}
);
});
it('should override flex direction size with min bounds', function() {
testLayout(
{style: {width: 300, height: 200, flexDirection:'row'}, children: [
{style: {flex: 1}},
{style: {flex: 1, minWidth: 200}},
{style: {flex: 1}}
]},
{width: 300, height: 200, top: 0, left: 0, children: [
{width: 50, height: 200, top: 0, left: 0},
{width: 200, height: 200, top: 0, left: 50},
{width: 50, height: 200, top: 0, left: 250}
]}
);
});
it('should not override flex direction size within bounds', function() {
testLayout(
{style: {width: 300, height: 200, flexDirection:'row'}, children: [
{style: {flex: 1}},
{style: {flex: 1, minWidth: 90, maxWidth: 110}},
{style: {flex: 1}}
]},
{width: 300, height: 200, top: 0, left: 0, children: [
{width: 100, height: 200, top: 0, left: 0},
{width: 100, height: 200, top: 0, left: 100},
{width: 100, height: 200, top: 0, left: 200}
]}
);
});
it('should override flex direction size with max bounds', function() {
testLayout(
{style: {width: 300, height: 200, flexDirection:'row'}, children: [
{style: {flex: 1}},
{style: {flex: 1, maxWidth: 60}},
{style: {flex: 1}}
]},
{width: 300, height: 200, top: 0, left: 0, children: [
{width: 120, height: 200, top: 0, left: 0},
{width: 60, height: 200, top: 0, left: 120},
{width: 120, height: 200, top: 0, left: 180}
]}
);
});
it('should pre-fill child size within bounds', function() {
testLayout(
{style: {width: 300, height: 200}, children: [
{style: {flex: 1, minWidth: 290, maxWidth: 310}},
]},
{width: 300, height: 200, top: 0, left: 0, children: [
{width: 300, height: 200, top: 0, left: 0},
]}
);
});
it('should pre-fill child size within max bound', function() {
testLayout(
{style: {width: 300, height: 200}, children: [
{style: {flex: 1, maxWidth: 290}},
]},
{width: 300, height: 200, top: 0, left: 0, children: [
{width: 290, height: 200, top: 0, left: 0},
]}
);
});
it('should pre-fill child size within min bounds', function() {
testLayout(
{style: {width: 300, height: 200}, children: [
{style: {flex: 1, minWidth: 310}},
]},
{width: 300, height: 200, top: 0, left: 0, children: [
{width: 310, height: 200, top: 0, left: 0},
]}
);
});
it('should set parents size based on bounded children', function() {
testLayout(
{style: {minWidth: 100, maxWidth: 300, minHeight: 500, maxHeight: 700}, children: [
{style: {width: 200, height: 300}},
{style: {width: 200, height: 300}},
]},
{width: 200, height: 600, top: 0, left: 0, children: [
{width: 200, height: 300, top: 0, left: 0},
{width: 200, height: 300, top: 300, left: 0},
]}
);
});
it('should set parents size based on max bounded children', function() {
testLayout(
{style: {maxWidth: 100, maxHeight: 500}, children: [
{style: {width: 200, height: 300}},
{style: {width: 200, height: 300}},
]},
{width: 100, height: 500, top: 0, left: 0, children: [
{width: 200, height: 300, top: 0, left: 0},
{width: 200, height: 300, top: 300, left: 0},
]}
);
});
it('should set parents size based on min bounded children', function() {
testLayout(
{style: {minWidth: 300, minHeight: 700}, children: [
{style: {width: 200, height: 300}},
{style: {width: 200, height: 300}},
]},
{width: 300, height: 700, top: 0, left: 0, children: [
{width: 200, height: 300, top: 0, left: 0},
{width: 200, height: 300, top: 300, left: 0},
]}
);
});
it('should keep stretched size within bounds', function() {
testLayout(
{style: {width: 1000, alignItems: 'stretch'}, children: [
{style: {height: 100, minHeight: 90, maxHeight: 110, minWidth: 900, maxWidth: 1100}}
]},
{width: 1000, height: 100, top: 0, left: 0, children: [
{width: 1000, height: 100, top: 0, left: 0}
]}
);
});
it('should keep stretched size within max bounds', function() {
testLayout(
{style: {width: 1000, alignItems: 'stretch'}, children: [
{style: {height: 100, maxHeight: 90, maxWidth: 900}}
]},
{width: 1000, height: 90, top: 0, left: 0, children: [
{width: 900, height: 90, top: 0, left: 0}
]}
);
});
it('should keep stretched size within min bounds', function() {
testLayout(
{style: {width: 1000, alignItems: 'stretch'}, children: [
{style: {height: 100, minHeight: 110, minWidth: 1100}}
]},
{width: 1000, height: 110, top: 0, left: 0, children: [
{width: 1100, height: 110, top: 0, left: 0}
]}
);
});
it('should keep cross axis size within min bounds', function() {
testLayout(
{style: {width: 1000, flexDirection: 'row'}, children: [
{style: {height: 100, minHeight: 110, minWidth: 100}}
]},
{width: 1000, height: 110, top: 0, left: 0, children: [
{width: 100, height: 110, top: 0, left: 0}
]}
);
});
it('should layout node with position absolute, top and left and max bounds', function() {
testLayout(
{style: {width: 1000, height: 1000}, children: [
{style: {position: 'absolute', top: 100, left: 100, bottom: 100, right: 100, maxWidth: 500, maxHeight: 600}}
]},
{width: 1000, height: 1000, top: 0, left: 0, children: [
{width: 500, height: 600, top: 100, left: 100},
]}
);
});
it('should layout node with position absolute, top and left and min bounds', function() {
testLayout(
{style: {width: 1000, height: 1000}, children: [
{style: {position: 'absolute', top: 100, left: 100, bottom: 100, right: 100, minWidth: 900, minHeight: 1000}}
]},
{width: 1000, height: 1000, top: 0, left: 0, children: [
{width: 900, height: 1000, top: 100, left: 100},
]}
);
});
});