Back out "Back out "[yoga][gentest][intrinsic sizing] Gentest and initial tests for intrinsic sizing"" (#1758)
Summary: Pull Request resolved: https://github.com/facebook/yoga/pull/1758 Original commit changeset: 52d6cc754cb9 Original Phabricator Diff: D66332308 Reviewed By: NickGerleman Differential Revision: D66662663 fbshipit-source-id: fb3a0d10ec0f0149aeee510148f26ada8eff7e47
This commit is contained in:
committed by
Facebook GitHub Bot
parent
f99e657acd
commit
76ffdbc25d
@@ -219,3 +219,251 @@
|
||||
Sed at consectetur ipsum.
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="max_content_width" style="flex-direction: row; width:max-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_width" style="width: 90px; position: relative;">
|
||||
<div style="flex-direction: row; width: fit-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_width" style="width: 500px; position: relative;">
|
||||
<div style="flex-direction: row; width: -webkit-fill-available; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="max_content_height" style="height:max-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_height" style="height: 90px; position: relative;">
|
||||
<div style="height: fit-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_height" style="height: 500px; position: relative;">
|
||||
<div style="height: -webkit-fill-available; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="max_content_flex_basis_column" style="flex-basis: max-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_flex_basis_column" style="height: 90px; position: relative;">
|
||||
<div style="flex-basis: fit-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_flex_basis_column" style="height: 500px; position: relative;">
|
||||
<div style="flex-basis: -webkit-fill-available; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="max_content_flex_basis_row" style="flex-direction: row; flex-basis: max-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 500px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_flex_basis_row" style="width: 90px; position: relative;">
|
||||
<div style="flex-direction: row; flex-basis: fit-content; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_flex_basis_row" style="width: 500px; position: relative;">
|
||||
<div style="flex-direction: row; flex-basis: -webkit-fill-available; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="max_content_max_width" style="flex-direction: row; max-width:max-content; width: 200px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_max_width" style="width: 90px; position: relative;">
|
||||
<div style="flex-direction: row; max-width: fit-content; width: 110px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_max_width" style="width: 500px; position: relative;">
|
||||
<div style="flex-direction: row; max-width: -webkit-fill-available; width: 600px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="max_content_min_width" style="flex-direction: row; min-width:max-content; width: 100px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_min_width" style="width: 90px; position: relative;">
|
||||
<div style="flex-direction: row; min-width: fit-content; width: 90px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_min_width" style="width: 500px; position: relative;">
|
||||
<div style="flex-direction: row; min-width: -webkit-fill-available; width: 400px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 100px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 25px; height: 50px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="max_content_max_height" style="max-height:max-content; height: 200px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_max_height" style="height: 90px; position: relative;">
|
||||
<div style="max-height: fit-content; height: 110px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_max_height" style="height: 500px; position: relative;">
|
||||
<div style="max-height: -webkit-fill-available; flex-wrap: wrap; height: 600px;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="max_content_min_height" style="min-height:max-content; height: 100px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="fit_content_min_height" style="height: 90px; position: relative;">
|
||||
<div style="min-height: fit-content; height: 90px; flex-wrap: wrap;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div data-disabled="true" id="stretch_min_height" style="height: 500px; position: relative;">
|
||||
<div style="min-height: -webkit-fill-available; flex-wrap: wrap; height: 400px;">
|
||||
<div style="width: 50px; height: 50px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 100px;">
|
||||
</div>
|
||||
<div style="width: 50px; height: 25px;">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
@@ -17,13 +17,25 @@ function toFunctionNameCpp(value) {
|
||||
return 'Percent';
|
||||
} else if (value.indexOf('Auto') >= 0) {
|
||||
return 'Auto';
|
||||
} else if (value.indexOf('MaxContent') >= 0) {
|
||||
return 'MaxContent';
|
||||
} else if (value.indexOf('FitContent') >= 0) {
|
||||
return 'FitContent';
|
||||
} else if (value.indexOf('Stretch') >= 0) {
|
||||
return 'Stretch';
|
||||
}
|
||||
|
||||
return '';
|
||||
}
|
||||
|
||||
function keywordFunctionCpp(functionPrefix, nodeName, value) {
|
||||
const functionSuffix = toFunctionNameCpp(value);
|
||||
if (functionSuffix == 'Auto') {
|
||||
if (
|
||||
functionSuffix == 'Auto' ||
|
||||
functionSuffix == 'MaxContent' ||
|
||||
functionSuffix == 'FitContent' ||
|
||||
functionSuffix == 'Stretch'
|
||||
) {
|
||||
return functionPrefix + functionSuffix + '(' + nodeName + ');';
|
||||
} else {
|
||||
return (
|
||||
@@ -163,6 +175,10 @@ CPPEmitter.prototype = Object.create(Emitter.prototype, {
|
||||
YGDisplayContents: {value: 'YGDisplayContents'},
|
||||
YGAuto: {value: 'YGAuto'},
|
||||
|
||||
YGMaxContent: {value: 'MaxContent'},
|
||||
YGFitContent: {value: 'FitContent'},
|
||||
YGStretch: {value: 'Stretch'},
|
||||
|
||||
YGNodeCalculateLayout: {
|
||||
value: function (node, dir, _experiments) {
|
||||
this.push(
|
||||
@@ -382,57 +398,25 @@ CPPEmitter.prototype = Object.create(Emitter.prototype, {
|
||||
|
||||
YGNodeStyleSetMaxHeight: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
'YGNodeStyleSetMaxHeight' +
|
||||
toFunctionNameCpp(value) +
|
||||
'(' +
|
||||
nodeName +
|
||||
', ' +
|
||||
toValueCpp(value) +
|
||||
');',
|
||||
);
|
||||
this.push(keywordFunctionCpp('YGNodeStyleSetMaxHeight', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
YGNodeStyleSetMaxWidth: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
'YGNodeStyleSetMaxWidth' +
|
||||
toFunctionNameCpp(value) +
|
||||
'(' +
|
||||
nodeName +
|
||||
', ' +
|
||||
toValueCpp(value) +
|
||||
');',
|
||||
);
|
||||
this.push(keywordFunctionCpp('YGNodeStyleSetMaxWidth', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
YGNodeStyleSetMinHeight: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
'YGNodeStyleSetMinHeight' +
|
||||
toFunctionNameCpp(value) +
|
||||
'(' +
|
||||
nodeName +
|
||||
', ' +
|
||||
toValueCpp(value) +
|
||||
');',
|
||||
);
|
||||
this.push(keywordFunctionCpp('YGNodeStyleSetMinHeight', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
YGNodeStyleSetMinWidth: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
'YGNodeStyleSetMinWidth' +
|
||||
toFunctionNameCpp(value) +
|
||||
'(' +
|
||||
nodeName +
|
||||
', ' +
|
||||
toValueCpp(value) +
|
||||
');',
|
||||
);
|
||||
this.push(keywordFunctionCpp('YGNodeStyleSetMinWidth', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
|
@@ -17,13 +17,24 @@ function toMethodName(value) {
|
||||
return 'Percent';
|
||||
} else if (value.indexOf('AUTO') >= 0) {
|
||||
return 'Auto';
|
||||
} else if (value.indexOf('MAX_CONTENT') >= 0) {
|
||||
return 'MaxContent';
|
||||
} else if (value.indexOf('FIT_CONTENT') >= 0) {
|
||||
return 'FitContent';
|
||||
} else if (value.indexOf('STRETCH') >= 0) {
|
||||
return 'Stretch';
|
||||
}
|
||||
return '';
|
||||
}
|
||||
|
||||
function keywordMethod(methodPrefix, nodeName, value) {
|
||||
const methodSuffix = toMethodName(value);
|
||||
if (methodSuffix == 'Auto') {
|
||||
if (
|
||||
methodSuffix == 'Auto' ||
|
||||
methodSuffix == 'MaxContent' ||
|
||||
methodSuffix == 'FitContent' ||
|
||||
methodSuffix == 'Stretch'
|
||||
) {
|
||||
return nodeName + '.' + methodPrefix + methodSuffix + '();';
|
||||
} else {
|
||||
return (
|
||||
@@ -205,6 +216,10 @@ JavaEmitter.prototype = Object.create(Emitter.prototype, {
|
||||
YGBoxSizingBorderBox: {value: 'YogaBoxSizing.BORDER_BOX'},
|
||||
YGBoxSizingContentBox: {value: 'YogaBoxSizing.CONTENT_BOX'},
|
||||
|
||||
YGMaxContent: {value: 'MAX_CONTENT'},
|
||||
YGFitContent: {value: 'FIT_CONTENT'},
|
||||
YGStretch: {value: 'STRETCH'},
|
||||
|
||||
YGNodeCalculateLayout: {
|
||||
value: function (node, dir, _experiments) {
|
||||
this.push(node + '.setDirection(' + dir + ');');
|
||||
@@ -360,53 +375,25 @@ JavaEmitter.prototype = Object.create(Emitter.prototype, {
|
||||
|
||||
YGNodeStyleSetMaxHeight: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
nodeName +
|
||||
'.setMaxHeight' +
|
||||
toMethodName(value) +
|
||||
'(' +
|
||||
toValueJava(value) +
|
||||
'f);',
|
||||
);
|
||||
this.push(keywordMethod('setMaxHeight', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
YGNodeStyleSetMaxWidth: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
nodeName +
|
||||
'.setMaxWidth' +
|
||||
toMethodName(value) +
|
||||
'(' +
|
||||
toValueJava(value) +
|
||||
'f);',
|
||||
);
|
||||
this.push(keywordMethod('setMaxWidth', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
YGNodeStyleSetMinHeight: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
nodeName +
|
||||
'.setMinHeight' +
|
||||
toMethodName(value) +
|
||||
'(' +
|
||||
toValueJava(value) +
|
||||
'f);',
|
||||
);
|
||||
this.push(keywordMethod('setMinHeight', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
YGNodeStyleSetMinWidth: {
|
||||
value: function (nodeName, value) {
|
||||
this.push(
|
||||
nodeName +
|
||||
'.setMinWidth' +
|
||||
toMethodName(value) +
|
||||
'(' +
|
||||
toValueJava(value) +
|
||||
'f);',
|
||||
);
|
||||
this.push(keywordMethod('setMinWidth', nodeName, value));
|
||||
},
|
||||
},
|
||||
|
||||
|
@@ -15,6 +15,9 @@ function toValueJavascript(value) {
|
||||
if (value.match(/^[0-9.e+-]+px$/i)) return parseFloat(value);
|
||||
if (value.match(/^[0-9.e+-]+%/i)) return JSON.stringify(value);
|
||||
if (value == 'Yoga.AUTO') return '"auto"';
|
||||
if (value == 'max-content') return '"max-content"';
|
||||
if (value == 'fit-content') return '"fit-content"';
|
||||
if (value == 'stretch') return '"stretch"';
|
||||
return value;
|
||||
}
|
||||
|
||||
@@ -176,6 +179,10 @@ JavascriptEmitter.prototype = Object.create(Emitter.prototype, {
|
||||
YGBoxSizingBorderBox: {value: 'BoxSizing.BorderBox'},
|
||||
YGBoxSizingContentBox: {value: 'BoxSizing.ContentBox'},
|
||||
|
||||
YGMaxContent: {value: 'max-content'},
|
||||
YGFitContent: {value: 'fit-content'},
|
||||
YGStretch: {value: 'stretch'},
|
||||
|
||||
YGNodeCalculateLayout: {
|
||||
value: function (node, dir, _experiments) {
|
||||
this.push(node + '.calculateLayout(undefined, undefined, ' + dir + ');');
|
||||
|
@@ -654,6 +654,13 @@ function pointValue(e, value) {
|
||||
return e.YGAuto;
|
||||
case 'undefined':
|
||||
return e.YGUndefined;
|
||||
case 'max-content':
|
||||
return e.YGMaxContent;
|
||||
case 'fit-content':
|
||||
return e.YGFitContent;
|
||||
case 'stretch':
|
||||
case '-webkit-fill-available':
|
||||
return e.YGStretch;
|
||||
default:
|
||||
return value;
|
||||
}
|
||||
|
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
File diff suppressed because it is too large
Load Diff
Reference in New Issue
Block a user