Move files around

2016-12-16 14:09:39 +00:00
parent 57b042feb1
commit cb44a9f5a2
291 changed files with 25201 additions and 1724 deletions
--- a/gentest/fixtures/YGMinMaxDimensionTest.html
+++ b/gentest/fixtures/YGMinMaxDimensionTest.html
@@ -41,3 +41,25 @@
    <div style="height: 20px; flex-grow: 1;"></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>
--- a/gentest/fixtures/YGPercentageTest.html
+++ b/gentest/fixtures/YGPercentageTest.html
@@ -0,0 +1,82 @@
+<div id="percentage_width_height" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="width: 30%; height: 30%;"></div>
+</div>
+
+<div id="percentage_position_left_top" experiments="Rounding" style="width: 400px; height: 400px; flex-direction: row;">
+  <div style="width: 45%; height: 55%; left: 10%; top: 20%"></div>
+</div>
+
+<div id="percentage_position_bottom_right" experiments="Rounding" style="width: 500px; height: 500px; flex-direction: row;">
+  <div style="width: 55%; height: 15%; bottom: 10%; right: 20%"></div>
+</div>
+
+<div id="percentage_flex_basis" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 50%;"></div>
+  <div style="flex-grow: 1; flex-basis: 25%;"></div>
+</div>
+
+<div id="percentage_flex_basis_cross" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 50%;"></div>
+  <div style="flex-grow: 1; flex-basis: 25%;"></div>
+</div>
+
+<div id="percentage_flex_basis_cross_min_height" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; min-height: 60%;"></div>
+  <div style="flex-grow: 2; min-height: 10%;"></div>
+</div>
+
+<div id="percentage_flex_basis_main_max_height" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 10%; max-height: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; max-height: 20%;"></div>
+</div>
+
+<div id="percentage_flex_basis_cross_max_height" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; max-height: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; max-height: 20%;"></div>
+</div>
+
+<div id="percentage_flex_basis_main_max_width" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 15%; max-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; max-width: 20%;"></div>
+</div>
+
+<div id="percentage_flex_basis_cross_max_width" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; max-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 15%; max-width: 20%;"></div>
+</div>
+
+
+<div id="percentage_flex_basis_main_min_width" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: row;">
+  <div style="flex-grow: 1; flex-basis: 15%; min-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 10%; min-width: 20%;"></div>
+</div>
+
+<div id="percentage_flex_basis_cross_min_width" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; min-width: 60%;"></div>
+  <div style="flex-grow: 4; flex-basis: 15%; min-width: 20%;"></div>
+</div>
+
+<div id="percentage_multiple_nested_with_padding_margin_and_percentage_values" experiments="Rounding" style="width: 200px; height: 200px; flex-direction: column;">
+  <div style="flex-grow: 1; flex-basis: 10%; min-width: 60%; margin: 5px; padding: 3px;">
+    <div style="width: 50%; margin: 5px; padding: 3%;">
+      <div style="width: 45%; margin: 5%; padding: 3px;"></div>
+    </div>
+  </div>
+  <div style="flex-grow: 4; flex-basis: 15%; min-width: 20%;"></div>
+</div>
+
+<div id="percentage_margin_should_calculate_based_only_on_width" experiments="Rounding" style="width: 200px; height: 100px;">
+  <div style="flex-grow: 1; margin: 10%;">
+    <div style="width: 10px; height: 10px;"></div>
+  </div>
+</div>
+
+<div id="percentage_padding_should_calculate_based_only_on_width" experiments="Rounding" style="width: 200px; height: 100px;">
+  <div style="flex-grow: 1; padding: 10%;">
+    <div style="width: 10px; height: 10px;"></div>
+  </div>
+</div>
+
+<div id="percentage_absolute_position" experiments="Rounding" style="width: 200px; height: 100px;">
+  <div style="position: absolute; top: 10%; left: 30%; width: 10px; height: 10px;"></div>
+</div>
--- a/gentest/gentest-cpp.js
+++ b/gentest/gentest-cpp.js
@@ -7,10 +7,18 @@
 * of patent rights can be found in the PATENTS file in the same directory.
 */

-function toFloatString(n) {
+function toValueCpp(value) {
+  var n = value.toString().replace('px','').replace('%','');
  return n + (Number(n) == n && n % 1 !== 0 ? 'f' : '');
 }

+function toFunctionName(value) {
+  if (value.indexOf('%') >= 0){
+    return 'Percent';
+  }
+  return '';
+}
+
 var CPPEmitter = function() {
  Emitter.call(this, 'cpp', '  ');
 };
@@ -66,7 +74,7 @@ CPPEmitter.prototype = Object.create(Emitter.prototype, {
  }},

  AssertEQ:{value:function(v0, v1) {
-    this.push('ASSERT_FLOAT_EQ(' + toFloatString(v0) + ', ' + v1 + ');');
+    this.push('ASSERT_FLOAT_EQ(' + toValueCpp(v0) + ', ' + v1 + ');');
  }},

  YGAlignAuto:{value:'YGAlignAuto'},
@@ -133,90 +141,90 @@ CPPEmitter.prototype = Object.create(Emitter.prototype, {
  }},

  YGNodeStyleSetAlignContent:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetAlignContent(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetAlignContent(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetAlignItems:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetAlignItems(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetAlignItems(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetAlignSelf:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetAlignSelf(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetAlignSelf(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetBorder:{value:function(nodeName, edge, value) {
-    this.push('YGNodeStyleSetBorder(' + nodeName + ', ' + edge + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetBorder(' + nodeName + ', ' + edge + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetDirection:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetDirection(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetDirection(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetFlexBasis:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetFlexBasis(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetFlexBasis' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetFlexDirection:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetFlexDirection(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetFlexDirection(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetFlexGrow:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetFlexGrow(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetFlexGrow(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetFlexShrink:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetFlexShrink(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetFlexShrink(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetFlexWrap:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetFlexWrap(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetFlexWrap(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetHeight:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetHeight(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetHeight' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetJustifyContent:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetJustifyContent(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetJustifyContent(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetMargin:{value:function(nodeName, edge, value) {
-    this.push('YGNodeStyleSetMargin(' + nodeName + ', ' + edge + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetMargin' + toFunctionName(value) + '(' + nodeName + ', ' + edge + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetMaxHeight:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetMaxHeight(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetMaxHeight' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetMaxWidth:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetMaxWidth(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetMaxWidth' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetMinHeight:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetMinHeight(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetMinHeight' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetMinWidth:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetMinWidth(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetMinWidth' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetOverflow:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetOverflow(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetOverflow(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetPadding:{value:function(nodeName, edge, value) {
-    this.push('YGNodeStyleSetPadding(' + nodeName + ', ' + edge + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetPadding' + toFunctionName(value) + '(' + nodeName + ', ' + edge + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetPosition:{value:function(nodeName, edge, value) {
-    this.push('YGNodeStyleSetPosition(' + nodeName + ', ' + edge + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetPosition' + toFunctionName(value) + '(' + nodeName + ', ' + edge + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetPositionType:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetPositionType(' + nodeName + ', ' + value + ');');
+    this.push('YGNodeStyleSetPositionType(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},

  YGNodeStyleSetWidth:{value:function(nodeName, value) {
-    this.push('YGNodeStyleSetWidth(' + nodeName + ', ' + toFloatString(value) + ');');
+    this.push('YGNodeStyleSetWidth' + toFunctionName(value) + '(' + nodeName + ', ' + toValueCpp(value) + ');');
  }},
 });
--- a/gentest/gentest-cs.js
+++ b/gentest/gentest-cs.js
@@ -7,6 +7,19 @@
 * of patent rights can be found in the PATENTS file in the same directory.
 */

+function toValueCs(value) {
+  var n = value.toString().replace('px','').replace('%','');
+  return n + (Number(n) == n && n % 1 !== 0 ? 'f' : '');
+}
+
+function toCsUnitValue(value) {
+  var methodName = '';
+  if (value.indexOf('%') >= 0){
+    methodName = '.Percent()';
+  }
+  return toValueCs(value) + methodName;
+}
+
 var CSEmitter = function() {
  Emitter.call(this, 'cs', '    ');
 };
@@ -143,90 +156,90 @@ CSEmitter.prototype = Object.create(Emitter.prototype, {
  }},

  YGNodeStyleSetAlignContent:{value:function(nodeName, value) {
-    this.push(nodeName + '.AlignContent = ' + value + ';');
+    this.push(nodeName + '.AlignContent = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetAlignItems:{value:function(nodeName, value) {
-    this.push(nodeName + '.AlignItems = ' + value + ';');
+    this.push(nodeName + '.AlignItems = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetAlignSelf:{value:function(nodeName, value) {
-    this.push(nodeName + '.AlignSelf = ' + value + ';');
+    this.push(nodeName + '.AlignSelf = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetBorder:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.SetBorder(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.SetBorder(' + edge + ', ' + toValueCs(value) + ');');
  }},

  YGNodeStyleSetDirection:{value:function(nodeName, value) {
-    this.push(nodeName + '.StyleDirection = ' + value + ';');
+    this.push(nodeName + '.StyleDirection = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetFlexBasis:{value:function(nodeName, value) {
-    this.push(nodeName + '.FlexBasis = ' + value + 'f;');
+    this.push(nodeName + '.FlexBasis = ' + toCsUnitValue(value) + ';');
  }},

  YGNodeStyleSetFlexDirection:{value:function(nodeName, value) {
-    this.push(nodeName + '.FlexDirection = ' + value + ';');
+    this.push(nodeName + '.FlexDirection = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetFlexGrow:{value:function(nodeName, value) {
-    this.push(nodeName + '.FlexGrow = ' + value + 'f;');
+    this.push(nodeName + '.FlexGrow = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetFlexShrink:{value:function(nodeName, value) {
-    this.push(nodeName + '.FlexShrink = ' + value + 'f;');
+    this.push(nodeName + '.FlexShrink = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetFlexWrap:{value:function(nodeName, value) {
-    this.push(nodeName + '.Wrap = ' + value + ';');
+    this.push(nodeName + '.Wrap = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.Height = ' + value + 'f;');
+    this.push(nodeName + '.Height = ' + toCsUnitValue(value) + ';');
  }},

  YGNodeStyleSetJustifyContent:{value:function(nodeName, value) {
-    this.push(nodeName + '.JustifyContent = ' + value + ';');
+    this.push(nodeName + '.JustifyContent = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetMargin:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.SetMargin(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.SetMargin(' + edge + ', ' + toCsUnitValue(value) + ');');
  }},

  YGNodeStyleSetMaxHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.MaxHeight = ' + value + 'f;');
+    this.push(nodeName + '.MaxHeight = ' + toCsUnitValue(value) + ';');
  }},

  YGNodeStyleSetMaxWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.MaxWidth = ' + value + 'f;');
+    this.push(nodeName + '.MaxWidth = ' + toCsUnitValue(value) + ';');
  }},

  YGNodeStyleSetMinHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.MinHeight = ' + value + 'f;');
+    this.push(nodeName + '.MinHeight = ' + toCsUnitValue(value) + ';');
  }},

  YGNodeStyleSetMinWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.MinWidth = ' + value + 'f;');
+    this.push(nodeName + '.MinWidth = ' + toCsUnitValue(value) + ';');
  }},

  YGNodeStyleSetOverflow:{value:function(nodeName, value) {
-    this.push(nodeName + '.Overflow = ' + value + ';');
+    this.push(nodeName + '.Overflow = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetPadding:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.SetPadding(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.SetPadding(' + edge + ', ' + toCsUnitValue(value) + ');');
  }},

  YGNodeStyleSetPosition:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.SetPosition(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.SetPosition(' + edge + ', ' + toCsUnitValue(value) + ');');
  }},

  YGNodeStyleSetPositionType:{value:function(nodeName, value) {
-    this.push(nodeName + '.PositionType = ' + value + ';');
+    this.push(nodeName + '.PositionType = ' + toValueCs(value) + ';');
  }},

  YGNodeStyleSetWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.Width = ' + value + 'f;');
+    this.push(nodeName + '.Width = ' + toCsUnitValue(value) + ';');
  }},
 });
--- a/gentest/gentest-java.js
+++ b/gentest/gentest-java.js
@@ -7,6 +7,18 @@
 * of patent rights can be found in the PATENTS file in the same directory.
 */

+function toValueJava(value) {
+  var n = value.toString().replace('px','').replace('%','');
+  return n + (Number(n) == n && n % 1 !== 0 ? '' : '');
+}
+
+function toMethodName(value) {
+  if (value.indexOf('%') >= 0){
+    return 'Percent';
+  }
+  return '';
+}
+
 var JavaEmitter = function() {
  Emitter.call(this, 'java', '  ');
 };
@@ -148,90 +160,90 @@ JavaEmitter.prototype = Object.create(Emitter.prototype, {
  }},

  YGNodeStyleSetAlignContent:{value:function(nodeName, value) {
-    this.push(nodeName + '.setAlignContent(' + value + ');');
+    this.push(nodeName + '.setAlignContent(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetAlignItems:{value:function(nodeName, value) {
-    this.push(nodeName + '.setAlignItems(' + value + ');');
+    this.push(nodeName + '.setAlignItems(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetAlignSelf:{value:function(nodeName, value) {
-    this.push(nodeName + '.setAlignSelf(' + value + ');');
+    this.push(nodeName + '.setAlignSelf(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetBorder:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setBorder(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.setBorder(' + edge + ', ' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetDirection:{value:function(nodeName, value) {
-    this.push(nodeName + '.setDirection(' + value + ');');
+    this.push(nodeName + '.setDirection(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetFlexBasis:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexBasis(' + value + 'f);');
+    this.push(nodeName + '.setFlexBasis' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetFlexDirection:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexDirection(' + value + ');');
+    this.push(nodeName + '.setFlexDirection(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetFlexGrow:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexGrow(' + value + 'f);');
+    this.push(nodeName + '.setFlexGrow(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetFlexShrink:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexShrink(' + value + 'f);');
+    this.push(nodeName + '.setFlexShrink(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetFlexWrap:{value:function(nodeName, value) {
-    this.push(nodeName + '.setWrap(' + value + ');');
+    this.push(nodeName + '.setWrap(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.setHeight(' + value + 'f);');
+    this.push(nodeName + '.setHeight' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetJustifyContent:{value:function(nodeName, value) {
-    this.push(nodeName + '.setJustifyContent(' + value + ');');
+    this.push(nodeName + '.setJustifyContent(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetMargin:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setMargin(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.setMargin' + toMethodName(value) + '(' + edge + ', ' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetMaxHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMaxHeight(' + value + 'f);');
+    this.push(nodeName + '.setMaxHeight' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetMaxWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMaxWidth(' + value + 'f);');
+    this.push(nodeName + '.setMaxWidth' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetMinHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMinHeight(' + value + 'f);');
+    this.push(nodeName + '.setMinHeight' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetMinWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMinWidth(' + value + 'f);');
+    this.push(nodeName + '.setMinWidth' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetOverflow:{value:function(nodeName, value) {
-    this.push(nodeName + '.setOverflow(' + value + ');');
+    this.push(nodeName + '.setOverflow(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetPadding:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setPadding(' + edge + ', ' + value + ');');
+    this.push(nodeName + '.setPadding' + toMethodName(value) + '(' + edge + ', ' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetPosition:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setPosition(' + edge + ', ' + value + 'f);');
+    this.push(nodeName + '.setPosition' + toMethodName(value) + '(' + edge + ', ' + toValueJava(value) + 'f);');
  }},

  YGNodeStyleSetPositionType:{value:function(nodeName, value) {
-    this.push(nodeName + '.setPositionType(' + value + ');');
+    this.push(nodeName + '.setPositionType(' + toValueJava(value) + ');');
  }},

  YGNodeStyleSetWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.setWidth(' + value + 'f);');
+    this.push(nodeName + '.setWidth' + toMethodName(value) + '(' + toValueJava(value) + 'f);');
  }},
 });
--- a/gentest/gentest-javascript.js
+++ b/gentest/gentest-javascript.js
@@ -0,0 +1,238 @@
+/**
+ * Copyright (c) 2014-present, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ */
+
+var JavascriptEmitter = function() {
+  Emitter.call(this, 'js', '  ');
+};
+
+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);
+  return value;
+}
+
+function toJavascriptUpper(symbol) {
+  var out = '';
+  for (var i = 0; i < symbol.length; i++) {
+    var c = symbol[i];
+    if (c == c.toUpperCase() && i != 0 && symbol[i - 1] != symbol[i - 1].toUpperCase()) {
+      out += '_';
+    }
+    out += c.toUpperCase();
+  }
+  return out;
+}
+
+JavascriptEmitter.prototype = Object.create(Emitter.prototype, {
+  constructor:{value:JavascriptEmitter},
+
+  emitPrologue:{value:function() {
+    this.push([
+      'var Yoga = Yoga || require("../../sources/entry-" + process.env.TEST_ENTRY);',
+      ''
+    ]);
+  }},
+
+  emitTestPrologue:{value:function(name, experiments) {
+    this.push('it(' + JSON.stringify(name) + ', function () {');
+    this.pushIndent();
+
+    if (experiments.length > 0) {
+      for (var i in experiments) {
+        this.push('Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_' + toJavascriptUpper(experiments[i]) + ', true);');
+      }
+      this.push('');
+    }
+  }},
+
+  emitTestTreePrologue:{value:function(nodeName) {
+    this.push('var ' + nodeName + ' = Yoga.Node.create();');
+  }},
+
+  emitTestEpilogue:{value:function(experiments) {
+    this.push('');
+    this.push('if (typeof root !== "undefined")');
+    this.pushIndent();
+    this.push('root.freeRecursive();');
+    this.popIndent();
+
+    this.push('');
+    this.push('(typeof gc !== "undefined") && gc();');
+    this.AssertEQ('0', 'Yoga.getInstanceCount()');
+
+    if (experiments.length > 0) {
+      this.push('');
+      for (var i in experiments) {
+        this.push('Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_' + toJavascriptUpper(experiments[i]) + ', false);');
+      }
+    }
+
+    this.popIndent();
+    this.push('});');
+  }},
+
+  emitEpilogue:{value:function () {
+    this.push('');
+  }},
+
+  AssertEQ:{value:function(v0, v1) {
+    this.push('console.assert(' + v0 + ' === ' + v1 + ', "' + v0 + ' === ' + v1 + ' (" + ' + v1 + ' + ")");');
+  }},
+
+  YGAlignAuto:{value:'Yoga.ALIGN_AUTO'},
+  YGAlignCenter:{value:'Yoga.ALIGN_CENTER'},
+  YGAlignFlexEnd:{value:'Yoga.ALIGN_FLEX_END'},
+  YGAlignFlexStart:{value:'Yoga.ALIGN_FLEX_START'},
+  YGAlignStretch:{value:'Yoga.ALIGN_STRETCH'},
+
+  YGDirectionInherit:{value:'Yoga.DIRECTION_INHERIT'},
+  YGDirectionLTR:{value:'Yoga.DIRECTION_LTR'},
+  YGDirectionRTL:{value:'Yoga.DIRECTION_RTL'},
+
+  YGEdgeBottom:{value:'Yoga.EDGE_BOTTOM'},
+  YGEdgeEnd:{value:'Yoga.EDGE_END'},
+  YGEdgeLeft:{value:'Yoga.EDGE_LEFT'},
+  YGEdgeRight:{value:'Yoga.EDGE_RIGHT'},
+  YGEdgeStart:{value:'Yoga.EDGE_START'},
+  YGEdgeTop:{value:'Yoga.EDGE_TOP'},
+
+  YGFlexDirectionColumn:{value:'Yoga.FLEX_DIRECTION_COLUMN'},
+  YGFlexDirectionColumnReverse:{value:'Yoga.FLEX_DIRECTION_COLUMN_REVERSE'},
+  YGFlexDirectionRow:{value:'Yoga.FLEX_DIRECTION_ROW'},
+  YGFlexDirectionRowReverse:{value:'Yoga.FLEX_DIRECTION_ROW_REVERSE'},
+
+  YGJustifyCenter:{value:'Yoga.JUSTIFY_CENTER'},
+  YGJustifyFlexEnd:{value:'Yoga.JUSTIFY_FLEX_END'},
+  YGJustifyFlexStart:{value:'Yoga.JUSTIFY_FLEX_START'},
+  YGJustifySpaceAround:{value:'Yoga.JUSTIFY_SPACE_AROUND'},
+  YGJustifySpaceBetween:{value:'Yoga.JUSTIFY_SPACE_BETWEEN'},
+
+  YGOverflowHidden:{value:'Yoga.OVERFLOW_HIDDEN'},
+  YGOverflowVisible:{value:'Yoga.OVERFLOW_VISIBLE'},
+
+  YGPositionTypeAbsolute:{value:'Yoga.POSITION_TYPE_ABSOLUTE'},
+  YGPositionTypeRelative:{value:'Yoga.POSITION_TYPE_RELATIVE'},
+
+  YGWrapNoWrap:{value:'Yoga.WRAP_NO_WRAP'},
+  YGWrapWrap:{value:'Yoga.WRAP_WRAP'},
+
+  YGUndefined:{value:'Yoga.UNDEFINED'},
+
+  YGNodeCalculateLayout:{value:function(node, dir) {
+    this.push(node + '.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, ' + dir + ');');
+  }},
+
+  YGNodeInsertChild:{value:function(parentName, nodeName, index) {
+    this.push(parentName + '.insertChild(' + nodeName + ', ' + index + ');');
+  }},
+
+  YGNodeLayoutGetLeft:{value:function(nodeName) {
+    return nodeName + '.getComputedLeft()';
+  }},
+
+  YGNodeLayoutGetTop:{value:function(nodeName) {
+    return nodeName + '.getComputedTop()';
+  }},
+
+  YGNodeLayoutGetWidth:{value:function(nodeName) {
+    return nodeName + '.getComputedWidth()';
+  }},
+
+  YGNodeLayoutGetHeight:{value:function(nodeName) {
+    return nodeName + '.getComputedHeight()';
+  }},
+
+  YGNodeStyleSetAlignContent:{value:function(nodeName, value) {
+    this.push(nodeName + '.setAlignContent(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetAlignItems:{value:function(nodeName, value) {
+    this.push(nodeName + '.setAlignItems(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetAlignSelf:{value:function(nodeName, value) {
+    this.push(nodeName + '.setAlignSelf(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetBorder:{value:function(nodeName, edge, value) {
+    this.push(nodeName + '.setBorder(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetDirection:{value:function(nodeName, value) {
+    this.push(nodeName + '.setDirection(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetFlexBasis:{value:function(nodeName, value) {
+    this.push(nodeName + '.setFlexBasis(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetFlexDirection:{value:function(nodeName, value) {
+    this.push(nodeName + '.setFlexDirection(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetFlexGrow:{value:function(nodeName, value) {
+    this.push(nodeName + '.setFlexGrow(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetFlexShrink:{value:function(nodeName, value) {
+    this.push(nodeName + '.setFlexShrink(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetFlexWrap:{value:function(nodeName, value) {
+    this.push(nodeName + '.setFlexWrap(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetHeight:{value:function(nodeName, value) {
+    this.push(nodeName + '.setHeight(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetJustifyContent:{value:function(nodeName, value) {
+    this.push(nodeName + '.setJustifyContent(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetMargin:{value:function(nodeName, edge, value) {
+    this.push(nodeName + '.setMargin(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetMaxHeight:{value:function(nodeName, value) {
+    this.push(nodeName + '.setMaxHeight(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetMaxWidth:{value:function(nodeName, value) {
+    this.push(nodeName + '.setMaxWidth(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetMinHeight:{value:function(nodeName, value) {
+    this.push(nodeName + '.setMinHeight(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetMinWidth:{value:function(nodeName, value) {
+    this.push(nodeName + '.setMinWidth(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetOverflow:{value:function(nodeName, value) {
+    this.push(nodeName + '.setOverflow(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetPadding:{value:function(nodeName, edge, value) {
+    this.push(nodeName + '.setPadding(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetPosition:{value:function(nodeName, edge, value) {
+    this.push(nodeName + '.setPosition(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetPositionType:{value:function(nodeName, value) {
+    this.push(nodeName + '.setPositionType(' + toValueJavascript(value) + ');');
+  }},
+
+  YGNodeStyleSetWidth:{value:function(nodeName, value) {
+    this.push(nodeName + '.setWidth(' + toValueJavascript(value) + ');');
+  }},
+});
--- a/gentest/gentest.js
+++ b/gentest/gentest.js
@@ -27,6 +27,12 @@ window.onload = function() {
      document.body.children[0],
      document.body.children[1],
      document.body.children[2]);
+
+  printTest(
+      new JavascriptEmitter(),
+      document.body.children[0],
+      document.body.children[1],
+      document.body.children[2]);
 }

 function assert(condition, message) {
@@ -378,7 +384,7 @@ function pixelValue(e, value) {
  switch (value) {
    case 'auto': return e.YGUndefined;
    case 'undefined': return e.YGUndefined;
-    default: return value.replace('px', '');
+    default: return value;
  }
 }

--- a/gentest/gentest.rb
+++ b/gentest/gentest.rb
@@ -47,6 +47,10 @@ Dir['fixtures/*.html'].each do |file|
  f = File.open("../csharp/tests/Facebook.Yoga/#{name}.cs", 'w')
  f.write eval(logs[2].message.sub(/^[^"]*/, '')).sub('YogaTest', name)
  f.close
+
+  f = File.open("../javascript/tests/Facebook.Yoga/#{name}.js", 'w')
+  f.write eval(logs[3].message.sub(/^[^"]*/, '')).sub('YogaTest', name)
+  f.close
 end
 File.delete('test.html')
 browser.close
--- a/gentest/test-template.html
+++ b/gentest/test-template.html
@@ -7,6 +7,7 @@
    <script src="gentest-cpp.js"></script>
    <script src="gentest-java.js"></script>
    <script src="gentest-cs.js"></script>
+    <script src="gentest-javascript.js"></script>

    <style>
      body {