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

Made relevant JS tests transpile to C ; [src/Layout.c]: print_css_node_rec(): print alignContent ; [src/Layout-test-utils.c]: add_failed_test(): Sets failed_test->next to NULL, otherwise the test crashes if there's one and only one failure ; Added type casts so that it can be compiled as C++ by MSVC on Windows ; [Makefile]: Added c_test_msvc target when running in Windows so that the test executable can be built and debugged with Visual Studio on Windows ;

Browse Source
This commit is contained in:
Pierre Renaux
2015-05-09 13:03:21 +08:00
parent c7fbf44474
commit 14e264f5be
9 changed files with 513 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

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

@@ -4873,6 +4873,221 @@ int main()
test("should layout absolutely positioned node with padded flex 1 parent", 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.align_content = CSS_ALIGN_STRETCH;
node_0->style.align_items = CSS_ALIGN_FLEX_START;
node_0->style.flex_wrap = CSS_WRAP;
node_0->style.dimensions[CSS_WIDTH] = 300;
node_0->style.dimensions[CSS_HEIGHT] = 380;
init_css_node_children(node_0, 15);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 1);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 2);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 3);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 4);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 100;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 5);
node_1->style.align_self = CSS_ALIGN_FLEX_START;
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 6);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 7);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 100;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 8);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 9);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 10);
node_1->style.align_self = CSS_ALIGN_FLEX_START;
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 11);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 12);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 13);
node_1->style.align_self = CSS_ALIGN_FLEX_START;
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
node_1 = node_0->get_child(node_0->context, 14);
node_1->style.dimensions[CSS_WIDTH] = 50;
node_1->style.dimensions[CSS_HEIGHT] = 50;
node_1->style.margin[CSS_LEFT] = 10;
node_1->style.margin[CSS_TOP] = 10;
node_1->style.margin[CSS_RIGHT] = 10;
node_1->style.margin[CSS_BOTTOM] = 10;
}
}
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] = 380;
init_css_node_children(node_0, 15);
{
css_node_t *node_1;
node_1 = node_0->get_child(node_0->context, 0);
node_1->layout.position[CSS_TOP] = 10;
node_1->layout.position[CSS_LEFT] = 10;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 1);
node_1->layout.position[CSS_TOP] = 10;
node_1->layout.position[CSS_LEFT] = 80;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 2);
node_1->layout.position[CSS_TOP] = 10;
node_1->layout.position[CSS_LEFT] = 150;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 3);
node_1->layout.position[CSS_TOP] = 10;
node_1->layout.position[CSS_LEFT] = 220;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 4);
node_1->layout.position[CSS_TOP] = 92.5;
node_1->layout.position[CSS_LEFT] = 10;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 100;
node_1 = node_0->get_child(node_0->context, 5);
node_1->layout.position[CSS_TOP] = 92.5;
node_1->layout.position[CSS_LEFT] = 80;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 6);
node_1->layout.position[CSS_TOP] = 92.5;
node_1->layout.position[CSS_LEFT] = 150;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 7);
node_1->layout.position[CSS_TOP] = 92.5;
node_1->layout.position[CSS_LEFT] = 220;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 100;
node_1 = node_0->get_child(node_0->context, 8);
node_1->layout.position[CSS_TOP] = 225;
node_1->layout.position[CSS_LEFT] = 10;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 9);
node_1->layout.position[CSS_TOP] = 225;
node_1->layout.position[CSS_LEFT] = 80;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 10);
node_1->layout.position[CSS_TOP] = 225;
node_1->layout.position[CSS_LEFT] = 150;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 11);
node_1->layout.position[CSS_TOP] = 225;
node_1->layout.position[CSS_LEFT] = 220;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 12);
node_1->layout.position[CSS_TOP] = 307.5;
node_1->layout.position[CSS_LEFT] = 10;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 13);
node_1->layout.position[CSS_TOP] = 307.5;
node_1->layout.position[CSS_LEFT] = 80;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
node_1 = node_0->get_child(node_0->context, 14);
node_1->layout.position[CSS_TOP] = 307.5;
node_1->layout.position[CSS_LEFT] = 150;
node_1->layout.dimensions[CSS_WIDTH] = 50;
node_1->layout.dimensions[CSS_HEIGHT] = 50;
}
}
test("should layout with alignContent: stretch, and alignItems: flex-start", root_node, root_layout);
}
/** END_GENERATED **/
return tests_finished();
}

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

@@ -1591,30 +1591,27 @@ describe('Layout', function() {
describe('Layout alignContent', function() {
var alignContentData = {
style: {width: 300, height: 380, flexDirection: 'row', flexWrap: 'wrap'},
children: [
/* 0 */ {style: {width: 50, height: 50, margin: 10}},
/* 1 */ {style: {width: 50, height: 50, margin: 10}},
/* 2 */ {style: {width: 50, height: 50, margin: 10}},
/* 3 */ {style: {width: 50, height: 50, margin: 10}},
/* 4 */ {style: {width: 50, height: 100, margin: 10}},
/* 5 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
/* 6 */ {style: {width: 50, height: 50, margin: 10}},
/* 7 */ {style: {width: 50, height: 100, margin: 10}},
/* 8 */ {style: {width: 50, height: 50, margin: 10}},
/* 9 */ {style: {width: 50, height: 50, margin: 10}},
/* 10 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start' }},
/* 11 */ {style: {width: 50, height: 50, margin: 10}},
/* 12 */ {style: {width: 50, height: 50, margin: 10}},
/* 13 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
/* 14 */ {style: {width: 50, height: 50, margin: 10}},
],
};
it('should layout with alignContent: stretch, and alignItems: flex-start', function() {
testLayout(
alignContentData,
{style: {width: 300, height: 380, flexDirection: 'row', flexWrap: 'wrap', alignContent: 'stretch', alignItems: 'flex-start'},
children: [
/* 0 */ {style: {width: 50, height: 50, margin: 10}},
/* 1 */ {style: {width: 50, height: 50, margin: 10}},
/* 2 */ {style: {width: 50, height: 50, margin: 10}},
/* 3 */ {style: {width: 50, height: 50, margin: 10}},
/* 4 */ {style: {width: 50, height: 100, margin: 10}},
/* 5 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
/* 6 */ {style: {width: 50, height: 50, margin: 10}},
/* 7 */ {style: {width: 50, height: 100, margin: 10}},
/* 8 */ {style: {width: 50, height: 50, margin: 10}},
/* 9 */ {style: {width: 50, height: 50, margin: 10}},
/* 10 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start' }},
/* 11 */ {style: {width: 50, height: 50, margin: 10}},
/* 12 */ {style: {width: 50, height: 50, margin: 10}},
/* 13 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
/* 14 */ {style: {width: 50, height: 50, margin: 10}},
],
},
{width: 300, height: 380, top: 0, left: 0, children: [
{width: 50, height: 50, top: 10, left: 10},
{width: 50, height: 50, top: 10, left: 80},
@@ -1635,13 +1632,32 @@ describe('Layout alignContent', function() {
);
});
function testAlignContent(alignContent, alignItems) {
it('should layout with alignContent: ' + alignContent + ', and alignItems: ' + alignItems, function() {
testLayoutAgainstDomOnly(alignContentData);
testLayoutAgainstDomOnly(
{style: {width: 300, height: 380, flexDirection: 'row', flexWrap: 'wrap', alignContent: alignContent, alignItems: alignItems},
children: [
/* 0 */ {style: {width: 50, height: 50, margin: 10}},
/* 1 */ {style: {width: 50, height: 50, margin: 10}},
/* 2 */ {style: {width: 50, height: 50, margin: 10}},
/* 3 */ {style: {width: 50, height: 50, margin: 10}},
/* 4 */ {style: {width: 50, height: 100, margin: 10}},
/* 5 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
/* 6 */ {style: {width: 50, height: 50, margin: 10}},
/* 7 */ {style: {width: 50, height: 100, margin: 10}},
/* 8 */ {style: {width: 50, height: 50, margin: 10}},
/* 9 */ {style: {width: 50, height: 50, margin: 10}},
/* 10 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start' }},
/* 11 */ {style: {width: 50, height: 50, margin: 10}},
/* 12 */ {style: {width: 50, height: 50, margin: 10}},
/* 13 */ {style: {width: 50, height: 50, margin: 10, alignSelf: 'flex-start'}},
/* 14 */ {style: {width: 50, height: 50, margin: 10}},
],
}
);
});
}
// testAlignContent('stretch', 'flex-start'); // above with expected value data
testAlignContent('stretch', 'center');
testAlignContent('stretch', 'flex-end');
testAlignContent('stretch', 'stretch');