Improve JS bindings

Summary:
- Fix a few things related to how npm should publish the package (sources were in the gitignore file, so I think it would have break the build during install - I fixed this by adding a npmignore that should override the gitignore rules)

- The enumerations values are now generated directly from `enums.py`

- I added percent unit support (#258) to the bindings (`.setWidthPercent` is currently exposed, but I've also added a very very little parsing to also support `.setWidth("100%")` and `.setWidth(.getWidth())`), added the missing tests, and fixed Travis.
Closes https://github.com/facebook/yoga/pull/314

Reviewed By: mikearmstrong001

Differential Revision: D4377198

Pulled By: emilsjolander

fbshipit-source-id: 774dfafd416f5421f3be59a1d181eb7056487abe

enums.py

@@ -192,3 +192,20 @@ for name, values in ENUMS.items():
                 f.write('        %s,\n' % value)
         f.write('    }\n')
         f.write('}\n')
+
+# write out javascript file
+with open(root + '/javascript/sources/YGEnums.js', 'w') as f:
+    f.write(LICENSE)
+    f.write('module.exports = {\n\n')
+    for name, values in ENUMS.items():
+        f.write('  %s_COUNT: %s,\n' % (to_java_upper(name), len(values)))
+        base = 0
+        for value in values:
+            if isinstance(value, tuple):
+                f.write('  %s_%s: %d,\n' % (to_java_upper(name), to_java_upper(value[0]), value[1]))
+                base = value[1] + 1
+            else:
+                f.write('  %s_%s: %d,\n' % (to_java_upper(name), to_java_upper(value), base))
+                base += 1
+        f.write('\n');
+    f.write('};\n')

gentest/gentest-javascript.js

@@ -11,6 +11,12 @@ 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++) {
@@ -143,90 +149,90 @@ JavascriptEmitter.prototype = Object.create(Emitter.prototype, {
   }},
 
   YGNodeStyleSetAlignContent:{value:function(nodeName, value) {
-    this.push(nodeName + '.setAlignContent(' + value + ');');
+    this.push(nodeName + '.setAlignContent(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetAlignItems:{value:function(nodeName, value) {
-    this.push(nodeName + '.setAlignItems(' + value + ');');
+    this.push(nodeName + '.setAlignItems(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetAlignSelf:{value:function(nodeName, value) {
-    this.push(nodeName + '.setAlignSelf(' + value + ');');
+    this.push(nodeName + '.setAlignSelf(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetBorder:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setBorder(' + edge + ', ' + value + ');');
+    this.push(nodeName + '.setBorder(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetDirection:{value:function(nodeName, value) {
-    this.push(nodeName + '.setDirection(' + value + ');');
+    this.push(nodeName + '.setDirection(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetFlexBasis:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexBasis(' + value + ');');
+    this.push(nodeName + '.setFlexBasis(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetFlexDirection:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexDirection(' + value + ');');
+    this.push(nodeName + '.setFlexDirection(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetFlexGrow:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexGrow(' + value + ');');
+    this.push(nodeName + '.setFlexGrow(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetFlexShrink:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexShrink(' + value + ');');
+    this.push(nodeName + '.setFlexShrink(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetFlexWrap:{value:function(nodeName, value) {
-    this.push(nodeName + '.setFlexWrap(' + value + ');');
+    this.push(nodeName + '.setFlexWrap(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.setHeight(' + value + ');');
+    this.push(nodeName + '.setHeight(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetJustifyContent:{value:function(nodeName, value) {
-    this.push(nodeName + '.setJustifyContent(' + value + ');');
+    this.push(nodeName + '.setJustifyContent(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetMargin:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setMargin(' + edge + ', ' + value + ');');
+    this.push(nodeName + '.setMargin(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetMaxHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMaxHeight(' + value + ');');
+    this.push(nodeName + '.setMaxHeight(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetMaxWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMaxWidth(' + value + ');');
+    this.push(nodeName + '.setMaxWidth(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetMinHeight:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMinHeight(' + value + ');');
+    this.push(nodeName + '.setMinHeight(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetMinWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.setMinWidth(' + value + ');');
+    this.push(nodeName + '.setMinWidth(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetOverflow:{value:function(nodeName, value) {
-    this.push(nodeName + '.setOverflow(' + value + ');');
+    this.push(nodeName + '.setOverflow(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetPadding:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setPadding(' + edge + ', ' + value + ');');
+    this.push(nodeName + '.setPadding(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetPosition:{value:function(nodeName, edge, value) {
-    this.push(nodeName + '.setPosition(' + edge + ', ' + value + ');');
+    this.push(nodeName + '.setPosition(' + toValueJavascript(edge) + ', ' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetPositionType:{value:function(nodeName, value) {
-    this.push(nodeName + '.setPositionType(' + value + ');');
+    this.push(nodeName + '.setPositionType(' + toValueJavascript(value) + ');');
   }},
 
   YGNodeStyleSetWidth:{value:function(nodeName, value) {
-    this.push(nodeName + '.setWidth(' + value + ');');
+    this.push(nodeName + '.setWidth(' + toValueJavascript(value) + ');');
   }},
 });

javascript/.npmignore

@@ -0,0 +1,12 @@
+node_modules
+
+*.gypi
+!/final-flags.gypi
+
+/dist
+/build/*
+!/build/Release
+/build/Release/*
+!/build/Release/nbind.js
+
+npm-debug.log*

javascript/package.json

@@ -28,7 +28,9 @@
 
         "bench": "node tests/run-bench $(find tests/Benchmarks -name '*.js')",
 
-        "install": "npm -- run autogypi && npm -- run build:node"
+        "install": "npm -- run autogypi && npm -- run build:node",
+
+        "prepare": "npm -- run build:browser"
 
     },
 

javascript/sources/Node.cc

@@ -74,6 +74,11 @@ void Node::setPosition(int edge, double position)
     YGNodeStyleSetPosition(m_node, static_cast<YGEdge>(edge), position);
 }
 
+void Node::setPositionPercent(int edge, double position)
+{
+    YGNodeStyleSetPositionPercent(m_node, static_cast<YGEdge>(edge), position);
+}
+
 void Node::setAlignContent(int alignContent)
 {
     YGNodeStyleSetAlignContent(m_node, static_cast<YGAlign>(alignContent));
@@ -109,6 +114,11 @@ void Node::setMargin(int edge, double margin)
     YGNodeStyleSetMargin(m_node, static_cast<YGEdge>(edge), margin);
 }
 
+void Node::setMarginPercent(int edge, double margin)
+{
+    YGNodeStyleSetMarginPercent(m_node, static_cast<YGEdge>(edge), margin);
+}
+
 void Node::setOverflow(int overflow)
 {
     YGNodeStyleSetOverflow(m_node, static_cast<YGOverflow>(overflow));
@@ -124,6 +134,11 @@ void Node::setFlexBasis(double flexBasis)
     YGNodeStyleSetFlexBasis(m_node, flexBasis);
 }
 
+void Node::setFlexBasisPercent(double flexBasis)
+{
+    YGNodeStyleSetFlexBasisPercent(m_node, flexBasis);
+}
+
 void Node::setFlexGrow(double flexGrow)
 {
     YGNodeStyleSetFlexGrow(m_node, flexGrow);
@@ -139,31 +154,61 @@ void Node::setWidth(double width)
     YGNodeStyleSetWidth(m_node, width);
 }
 
+void Node::setWidthPercent(double width)
+{
+    YGNodeStyleSetWidthPercent(m_node, width);
+}
+
 void Node::setHeight(double height)
 {
     YGNodeStyleSetHeight(m_node, height);
 }
 
+void Node::setHeightPercent(double height)
+{
+    YGNodeStyleSetHeightPercent(m_node, height);
+}
+
 void Node::setMinWidth(double minWidth)
 {
     YGNodeStyleSetMinWidth(m_node, minWidth);
 }
 
+void Node::setMinWidthPercent(double minWidth)
+{
+    YGNodeStyleSetMinWidthPercent(m_node, minWidth);
+}
+
 void Node::setMinHeight(double minHeight)
 {
     YGNodeStyleSetMinHeight(m_node, minHeight);
 }
 
+void Node::setMinHeightPercent(double minHeight)
+{
+    YGNodeStyleSetMinHeightPercent(m_node, minHeight);
+}
+
 void Node::setMaxWidth(double maxWidth)
 {
     YGNodeStyleSetMaxWidth(m_node, maxWidth);
 }
 
+void Node::setMaxWidthPercent(double maxWidth)
+{
+    YGNodeStyleSetMaxWidthPercent(m_node, maxWidth);
+}
+
 void Node::setMaxHeight(double maxHeight)
 {
     YGNodeStyleSetMaxHeight(m_node, maxHeight);
 }
 
+void Node::setMaxHeightPercent(double maxHeight)
+{
+    YGNodeStyleSetMaxHeightPercent(m_node, maxHeight);
+}
+
 void Node::setAspectRatio(double aspectRatio)
 {
     YGNodeStyleSetAspectRatio(m_node, aspectRatio);
@@ -179,14 +224,19 @@ void Node::setPadding(int edge, double padding)
     YGNodeStyleSetPadding(m_node, static_cast<YGEdge>(edge), padding);
 }
 
+void Node::setPaddingPercent(int edge, double padding)
+{
+    YGNodeStyleSetPaddingPercent(m_node, static_cast<YGEdge>(edge), padding);
+}
+
 int Node::getPositionType(void) const
 {
     return YGNodeStyleGetPositionType(m_node);
 }
 
-double Node::getPosition(int edge) const
+Value Node::getPosition(int edge) const
 {
-    return YGNodeStyleGetPosition(m_node, static_cast<YGEdge>(edge));
+    return Value::fromYGValue(YGNodeStyleGetPosition(m_node, static_cast<YGEdge>(edge)));
 }
 
 int Node::getAlignContent(void) const
@@ -219,9 +269,9 @@ int Node::getJustifyContent(void) const
     return YGNodeStyleGetJustifyContent(m_node);
 }
 
-double Node::getMargin(int edge) const
+Value Node::getMargin(int edge) const
 {
-    return YGNodeStyleGetMargin(m_node, static_cast<YGEdge>(edge));
+    return Value::fromYGValue(YGNodeStyleGetMargin(m_node, static_cast<YGEdge>(edge)));
 }
 
 int Node::getOverflow(void) const
@@ -229,9 +279,9 @@ int Node::getOverflow(void) const
     return YGNodeStyleGetOverflow(m_node);
 }
 
-double Node::getFlexBasis(void) const
+Value Node::getFlexBasis(void) const
 {
-    return YGNodeStyleGetFlexBasis(m_node);
+    return Value::fromYGValue(YGNodeStyleGetFlexBasis(m_node));
 }
 
 double Node::getFlexGrow(void) const
@@ -244,34 +294,34 @@ double Node::getFlexShrink(void) const
     return YGNodeStyleGetFlexShrink(m_node);
 }
 
-double Node::getWidth(void) const
+Value Node::getWidth(void) const
 {
-    return YGNodeStyleGetWidth(m_node);
+    return Value::fromYGValue(YGNodeStyleGetWidth(m_node));
 }
 
-double Node::getHeight(void) const
+Value Node::getHeight(void) const
 {
-    return YGNodeStyleGetHeight(m_node);
+    return Value::fromYGValue(YGNodeStyleGetHeight(m_node));
 }
 
-double Node::getMinWidth(void) const
+Value Node::getMinWidth(void) const
 {
-    return YGNodeStyleGetMinWidth(m_node);
+    return Value::fromYGValue(YGNodeStyleGetMinWidth(m_node));
 }
 
-double Node::getMinHeight(void) const
+Value Node::getMinHeight(void) const
 {
-    return YGNodeStyleGetMinHeight(m_node);
+    return Value::fromYGValue(YGNodeStyleGetMinHeight(m_node));
 }
 
-double Node::getMaxWidth(void) const
+Value Node::getMaxWidth(void) const
 {
-    return YGNodeStyleGetMaxWidth(m_node);
+    return Value::fromYGValue(YGNodeStyleGetMaxWidth(m_node));
 }
 
-double Node::getMaxHeight(void) const
+Value Node::getMaxHeight(void) const
 {
-    return YGNodeStyleGetMaxHeight(m_node);
+    return Value::fromYGValue(YGNodeStyleGetMaxHeight(m_node));
 }
 
 double Node::getAspectRatio(void) const
@@ -284,9 +334,9 @@ double Node::getBorder(int edge) const
     return YGNodeStyleGetBorder(m_node, static_cast<YGEdge>(edge));
 }
 
-double Node::getPadding(int edge) const
+Value Node::getPadding(int edge) const
 {
-    return YGNodeStyleGetPadding(m_node, static_cast<YGEdge>(edge));
+    return Value::fromYGValue(YGNodeStyleGetPadding(m_node, static_cast<YGEdge>(edge)));
 }
 
 void Node::insertChild(Node * child, unsigned index)

javascript/sources/Node.hh

@@ -17,6 +17,7 @@
 
 #include "./Layout.hh"
 #include "./Size.hh"
+#include "./Value.hh"
 
 class Node {
 
@@ -53,6 +54,7 @@ class Node {
 
     void setPositionType(int positionType);
     void setPosition(int edge, double position);
+    void setPositionPercent(int edge, double position);
 
     void setAlignContent(int alignContent);
     void setAlignItems(int alignItems);
@@ -62,33 +64,42 @@ class Node {
     void setJustifyContent(int justifyContent);
 
     void setMargin(int edge, double margin);
+    void setMarginPercent(int edge, double margin);
 
     void setOverflow(int overflow);
 
     void setFlex(double flex);
     void setFlexBasis(double flexBasis);
+    void setFlexBasisPercent(double flexBasis);
     void setFlexGrow(double flexGrow);
     void setFlexShrink(double flexShrink);
 
     void setWidth(double width);
+    void setWidthPercent(double width);
     void setHeight(double height);
+    void setHeightPercent(double height);
 
     void setMinWidth(double minWidth);
+    void setMinWidthPercent(double minWidth);
     void setMinHeight(double minHeight);
+    void setMinHeightPercent(double minHeight);
 
     void setMaxWidth(double maxWidth);
+    void setMaxWidthPercent(double maxWidth);
     void setMaxHeight(double maxHeight);
+    void setMaxHeightPercent(double maxHeight);
 
     void setAspectRatio(double aspectRatio);
 
     void setBorder(int edge, double border);
 
     void setPadding(int edge, double padding);
+    void setPaddingPercent(int edge, double padding);
 
  public: // Style getters
 
     int getPositionType(void) const;
-    double getPosition(int edge) const;
+    Value getPosition(int edge) const;
 
     int getAlignContent(void) const;
     int getAlignItems(void) const;
@@ -97,28 +108,28 @@ class Node {
     int getFlexWrap(void) const;
     int getJustifyContent(void) const;
 
-    double getMargin(int edge) const;
+    Value getMargin(int edge) const;
 
     int getOverflow(void) const;
 
-    double getFlexBasis(void) const;
+    Value getFlexBasis(void) const;
     double getFlexGrow(void) const;
     double getFlexShrink(void) const;
 
-    double getWidth(void) const;
+    Value getWidth(void) const;
-    double getHeight(void) const;
+    Value getHeight(void) const;
 
-    double getMinWidth(void) const;
+    Value getMinWidth(void) const;
-    double getMinHeight(void) const;
+    Value getMinHeight(void) const;
 
-    double getMaxWidth(void) const;
+    Value getMaxWidth(void) const;
-    double getMaxHeight(void) const;
+    Value getMaxHeight(void) const;
 
     double getAspectRatio(void) const;
 
     double getBorder(int edge) const;
 
-    double getPadding(int edge) const;
+    Value getPadding(int edge) const;
 
  public: // Tree hierarchy mutators
 

javascript/sources/Value.hh

@@ -0,0 +1,31 @@
+#pragma once
+
+#include <yoga/Yoga.h>
+
+struct Value
+{
+    static Value fromYGValue(YGValue const & ygValue)
+    {
+        return Value(static_cast<int>(ygValue.unit), ygValue.value);
+    }
+
+    int unit;
+    double value;
+
+    Value(void)
+    : unit(YGUnitUndefined)
+    , value(0.0)
+    {
+    }
+
+    Value(int unit, double value)
+    : unit(unit)
+    , value(value)
+    {
+    }
+
+    void toJS(nbind::cbOutput expose) const
+    {
+        expose(unit, value);
+    }
+};

javascript/sources/YGEnums.js

@@ -0,0 +1,91 @@
+/**
+ * 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.
+ */
+
+module.exports = {
+
+  FLEX_DIRECTION_COUNT: 4,
+  FLEX_DIRECTION_COLUMN: 0,
+  FLEX_DIRECTION_COLUMN_REVERSE: 1,
+  FLEX_DIRECTION_ROW: 2,
+  FLEX_DIRECTION_ROW_REVERSE: 3,
+
+  MEASURE_MODE_COUNT: 3,
+  MEASURE_MODE_UNDEFINED: 0,
+  MEASURE_MODE_EXACTLY: 1,
+  MEASURE_MODE_AT_MOST: 2,
+
+  PRINT_OPTIONS_COUNT: 3,
+  PRINT_OPTIONS_LAYOUT: 1,
+  PRINT_OPTIONS_STYLE: 2,
+  PRINT_OPTIONS_CHILDREN: 4,
+
+  EDGE_COUNT: 9,
+  EDGE_LEFT: 0,
+  EDGE_TOP: 1,
+  EDGE_RIGHT: 2,
+  EDGE_BOTTOM: 3,
+  EDGE_START: 4,
+  EDGE_END: 5,
+  EDGE_HORIZONTAL: 6,
+  EDGE_VERTICAL: 7,
+  EDGE_ALL: 8,
+
+  POSITION_TYPE_COUNT: 2,
+  POSITION_TYPE_RELATIVE: 0,
+  POSITION_TYPE_ABSOLUTE: 1,
+
+  DIMENSION_COUNT: 2,
+  DIMENSION_WIDTH: 0,
+  DIMENSION_HEIGHT: 1,
+
+  JUSTIFY_COUNT: 5,
+  JUSTIFY_FLEX_START: 0,
+  JUSTIFY_CENTER: 1,
+  JUSTIFY_FLEX_END: 2,
+  JUSTIFY_SPACE_BETWEEN: 3,
+  JUSTIFY_SPACE_AROUND: 4,
+
+  DIRECTION_COUNT: 3,
+  DIRECTION_INHERIT: 0,
+  DIRECTION_LTR: 1,
+  DIRECTION_RTL: 2,
+
+  LOG_LEVEL_COUNT: 5,
+  LOG_LEVEL_ERROR: 0,
+  LOG_LEVEL_WARN: 1,
+  LOG_LEVEL_INFO: 2,
+  LOG_LEVEL_DEBUG: 3,
+  LOG_LEVEL_VERBOSE: 4,
+
+  WRAP_COUNT: 2,
+  WRAP_NO_WRAP: 0,
+  WRAP_WRAP: 1,
+
+  OVERFLOW_COUNT: 3,
+  OVERFLOW_VISIBLE: 0,
+  OVERFLOW_HIDDEN: 1,
+  OVERFLOW_SCROLL: 2,
+
+  EXPERIMENTAL_FEATURE_COUNT: 2,
+  EXPERIMENTAL_FEATURE_ROUNDING: 0,
+  EXPERIMENTAL_FEATURE_WEB_FLEX_BASIS: 1,
+
+  ALIGN_COUNT: 5,
+  ALIGN_AUTO: 0,
+  ALIGN_FLEX_START: 1,
+  ALIGN_CENTER: 2,
+  ALIGN_FLEX_END: 3,
+  ALIGN_STRETCH: 4,
+
+  UNIT_COUNT: 3,
+  UNIT_UNDEFINED: 0,
+  UNIT_PIXEL: 1,
+  UNIT_PERCENT: 2,
+
+};

javascript/sources/entry-common.js

@@ -19,57 +19,11 @@ function patch(prototype, name, fn) {
 
 module.exports = function (bind, lib) {
 
-    let constants = {};
+    let constants = Object.assign({
 
-    constants.ALIGN_AUTO = 0;
+        UNDEFINED: NaN
-    constants.ALIGN_CENTER = 2;
-    constants.ALIGN_FLEX_END = 3;
-    constants.ALIGN_FLEX_START = 1;
-    constants.ALIGN_STRETCH = 4;
 
-    constants.DIRECTION_INHERIT = 0;
+    }, require(`./YGEnums`));
-    constants.DIRECTION_LTR = 1;
-    constants.DIRECTION_RTL = 2;
-
-    constants.EDGE_ALL = 8;
-    constants.EDGE_BOTTOM = 3;
-    constants.EDGE_END = 5;
-    constants.EDGE_HORIZONTAL = 6;
-    constants.EDGE_LEFT = 0;
-    constants.EDGE_RIGHT = 2;
-    constants.EDGE_START = 4;
-    constants.EDGE_TOP = 1;
-    constants.EDGE_VERTICAL = 7;
-
-    constants.FEATURE_ROUNDING = 0;
-    constants.FEATURE_WEB_FLEX_BASIS = 1;
-
-    constants.FLEX_DIRECTION_COLUMN = 0;
-    constants.FLEX_DIRECTION_COLUMN_REVERSE = 1;
-    constants.FLEX_DIRECTION_ROW = 2;
-    constants.FLEX_DIRECTION_ROW_REVERSE = 3;
-
-    constants.JUSTIFY_CENTER = 1;
-    constants.JUSTIFY_FLEX_END = 2;
-    constants.JUSTIFY_FLEX_START = 0;
-    constants.JUSTIFY_SPACE_AROUND = 4;
-    constants.JUSTIFY_SPACE_BETWEEN = 3;
-
-    constants.MEASURE_MODE_UNDEFINED = 0;
-    constants.MEASURE_MODE_EXACTLY = 1;
-    constants.MEASURE_MODE_AT_MOST = 2;
-
-    constants.OVERFLOW_HIDDEN = 1;
-    constants.OVERFLOW_VISIBLE = 0;
-    constants.OVERFLOW_SCROLL = 2;
-
-    constants.POSITION_TYPE_ABSOLUTE = 1;
-    constants.POSITION_TYPE_RELATIVE = 0;
-
-    constants.WRAP_NO_WRAP = 0;
-    constants.WRAP_WRAP = 1;
-
-    constants.UNDEFINED = NaN;
 
     class Layout {
 
@@ -129,6 +83,80 @@ module.exports = function (bind, lib) {
 
     }
 
+    class Value {
+
+        constructor(unit, value) {
+
+            this.unit = unit;
+            this.value = value;
+
+        }
+
+        fromJS(expose) {
+
+            expose(this.unit, this.value);
+
+        }
+
+        toString() {
+
+            switch (this.unit) {
+
+                case constants.UNIT_PIXEL:
+                    return `${this.value}`;
+
+                case constants.UNIT_PERCENT:
+                    return `${this.value}%`;
+
+                default: {
+                    return `${this.value}?`;
+                }
+
+            }
+
+        }
+
+        valueOf() {
+
+            return this.value;
+
+        }
+
+    }
+
+    for (let fnName of [ `setPosition`, `setMargin`, `setFlexBasis`, `setWidth`, `setHeight`, `setMinWidth`, `setMinHeight`, `setMaxWidth`, `setMaxHeight`, `setPadding` ]) {
+
+        let methods = { [constants.UNIT_PIXEL]: lib.Node.prototype[fnName], [constants.UNIT_PERCENT]: lib.Node.prototype[`${fnName}Percent`] };
+
+        if (Object.keys(methods).some(method => methods[method] == null))
+            throw new Error(`Assertion failed; some unit derivates of ${fnName} seem missing`);
+
+        patch(lib.Node.prototype, fnName, function (original, ... args) {
+
+            // We patch all these functions to add support for the following calls:
+            // .setWidth(100) / .setWidth("100%") / .setWidth(.getWidth())
+
+            let value = args.pop();
+            let unit, asNumber;
+
+            if (value instanceof Value) {
+
+                unit = value.unit;
+                asNumber = value.valueOf();
+
+            } else {
+
+                unit = typeof value === `string` && value.endsWith(`%`) ? constants.UNIT_PERCENT : constants.UNIT_PIXEL;
+                asNumber = parseFloat(value);
+
+            }
+
+            return methods[unit].call(this, ... args, asNumber);
+
+        });
+
+    }
+
     patch(lib.Node.prototype, `free`, function () {
 
         // Since we handle the memory allocation ourselves (via lib.Node.create), we also need to handle the deallocation
@@ -187,6 +215,7 @@ module.exports = function (bind, lib) {
 
     bind(`Layout`, Layout);
     bind(`Size`, Size);
+    bind(`Value`, Value);
 
     return Object.assign({
 
@@ -194,6 +223,7 @@ module.exports = function (bind, lib) {
 
         Layout,
         Size,
+        Value,
 
         setExperimentalFeatureEnabled,
         isExperimentalFeatureEnabled,

javascript/sources/nbind.cc

@@ -12,6 +12,7 @@
 #include "./Node.hh"
 #include "./Layout.hh"
 #include "./Size.hh"
+#include "./Value.hh"
 #include "./global.hh"
 
 #define NBIND_DUPLICATE_POINTERS true
@@ -36,6 +37,12 @@ NBIND_CLASS(Layout)
     construct<>();
 }
 
+NBIND_CLASS(Value)
+{
+    construct<>();
+    construct<int, double>();
+}
+
 NBIND_CLASS(Node)
 {
     method(create);
@@ -47,6 +54,7 @@ NBIND_CLASS(Node)
 
     method(setPositionType);
     method(setPosition);
+    method(setPositionPercent);
 
     method(setAlignContent);
     method(setAlignItems);
@@ -56,28 +64,37 @@ NBIND_CLASS(Node)
     method(setJustifyContent);
 
     method(setMargin);
+    method(setMarginPercent);
 
     method(setOverflow);
 
     method(setFlex);
     method(setFlexBasis);
+    method(setFlexBasisPercent);
     method(setFlexGrow);
     method(setFlexShrink);
 
     method(setWidth);
+    method(setWidthPercent);
     method(setHeight);
+    method(setHeightPercent);
 
     method(setMinWidth);
+    method(setMinWidthPercent);
     method(setMinHeight);
+    method(setMinHeightPercent);
 
     method(setMaxWidth);
+    method(setMaxWidthPercent);
     method(setMaxHeight);
+    method(setMaxHeightPercent);
 
     method(setAspectRatio);
 
     method(setBorder);
 
     method(setPadding);
+    method(setPaddingPercent);
 
     method(getPositionType);
     method(getPosition);

javascript/tests/Facebook.Yoga/YGPercentageTest.js

@@ -0,0 +1,967 @@
+/**
+ * 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.
+ */
+
+ // @Generated by gentest/gentest.rb from gentest/fixtures/YGPercentageTest.html
+
+var Yoga = Yoga || require("../../sources/entry-" + process.env.TEST_ENTRY);
+
+it("percentage_width_height", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setWidth("30%");
+  root_child0.setHeight("30%");
+  root.insertChild(root_child0, 0);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(60 === root_child0.getComputedWidth(), "60 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(60 === root_child0.getComputedHeight(), "60 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(140 === root_child0.getComputedLeft(), "140 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(60 === root_child0.getComputedWidth(), "60 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(60 === root_child0.getComputedHeight(), "60 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_position_left_top", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(400);
+  root.setHeight(400);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setPosition(Yoga.EDGE_LEFT, "10%");
+  root_child0.setPosition(Yoga.EDGE_TOP, "20%");
+  root_child0.setWidth("45%");
+  root_child0.setHeight("55%");
+  root.insertChild(root_child0, 0);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(400 === root.getComputedWidth(), "400 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(400 === root.getComputedHeight(), "400 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(40 === root_child0.getComputedLeft(), "40 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(80 === root_child0.getComputedTop(), "80 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(180 === root_child0.getComputedWidth(), "180 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(220 === root_child0.getComputedHeight(), "220 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(400 === root.getComputedWidth(), "400 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(400 === root.getComputedHeight(), "400 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(260 === root_child0.getComputedLeft(), "260 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(80 === root_child0.getComputedTop(), "80 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(180 === root_child0.getComputedWidth(), "180 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(220 === root_child0.getComputedHeight(), "220 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_position_bottom_right", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(500);
+  root.setHeight(500);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setPosition(Yoga.EDGE_RIGHT, "20%");
+  root_child0.setPosition(Yoga.EDGE_BOTTOM, "10%");
+  root_child0.setWidth("55%");
+  root_child0.setHeight("15%");
+  root.insertChild(root_child0, 0);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(500 === root.getComputedWidth(), "500 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(500 === root.getComputedHeight(), "500 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(-100 === root_child0.getComputedLeft(), "-100 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(-50 === root_child0.getComputedTop(), "-50 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(275 === root_child0.getComputedWidth(), "275 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(75 === root_child0.getComputedHeight(), "75 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(500 === root.getComputedWidth(), "500 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(500 === root.getComputedHeight(), "500 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(125 === root_child0.getComputedLeft(), "125 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(-50 === root_child0.getComputedTop(), "-50 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(275 === root_child0.getComputedWidth(), "275 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(75 === root_child0.getComputedHeight(), "75 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("50%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(1);
+  root_child1.setFlexBasis("25%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(125 === root_child0.getComputedWidth(), "125 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(125 === root_child1.getComputedLeft(), "125 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(75 === root_child1.getComputedWidth(), "75 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(75 === root_child0.getComputedLeft(), "75 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(125 === root_child0.getComputedWidth(), "125 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(75 === root_child1.getComputedWidth(), "75 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_cross", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("50%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(1);
+  root_child1.setFlexBasis("25%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(125 === root_child0.getComputedHeight(), "125 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(125 === root_child1.getComputedTop(), "125 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(75 === root_child1.getComputedHeight(), "75 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(125 === root_child0.getComputedHeight(), "125 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(125 === root_child1.getComputedTop(), "125 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(75 === root_child1.getComputedHeight(), "75 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_cross_min_height", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setMinHeight("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(2);
+  root_child1.setMinHeight("10%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(140 === root_child0.getComputedHeight(), "140 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(140 === root_child1.getComputedTop(), "140 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(60 === root_child1.getComputedHeight(), "60 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(140 === root_child0.getComputedHeight(), "140 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(140 === root_child1.getComputedTop(), "140 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(60 === root_child1.getComputedHeight(), "60 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_main_max_height", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("10%");
+  root_child0.setMaxHeight("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("10%");
+  root_child1.setMaxHeight("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(52 === root_child0.getComputedWidth(), "52 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(120 === root_child0.getComputedHeight(), "120 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(52 === root_child1.getComputedLeft(), "52 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(148 === root_child1.getComputedWidth(), "148 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(40 === root_child1.getComputedHeight(), "40 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(148 === root_child0.getComputedLeft(), "148 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(52 === root_child0.getComputedWidth(), "52 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(120 === root_child0.getComputedHeight(), "120 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(148 === root_child1.getComputedWidth(), "148 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(40 === root_child1.getComputedHeight(), "40 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_cross_max_height", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("10%");
+  root_child0.setMaxHeight("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("10%");
+  root_child1.setMaxHeight("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(120 === root_child0.getComputedHeight(), "120 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(120 === root_child1.getComputedTop(), "120 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(40 === root_child1.getComputedHeight(), "40 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(120 === root_child0.getComputedHeight(), "120 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(120 === root_child1.getComputedTop(), "120 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(40 === root_child1.getComputedHeight(), "40 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_main_max_width", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("15%");
+  root_child0.setMaxWidth("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("10%");
+  root_child1.setMaxWidth("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(120 === root_child0.getComputedWidth(), "120 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(120 === root_child1.getComputedLeft(), "120 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(40 === root_child1.getComputedWidth(), "40 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(80 === root_child0.getComputedLeft(), "80 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(120 === root_child0.getComputedWidth(), "120 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(40 === root_child1.getComputedLeft(), "40 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(40 === root_child1.getComputedWidth(), "40 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_cross_max_width", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("10%");
+  root_child0.setMaxWidth("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("15%");
+  root_child1.setMaxWidth("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(120 === root_child0.getComputedWidth(), "120 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(50 === root_child0.getComputedHeight(), "50 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(50 === root_child1.getComputedTop(), "50 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(40 === root_child1.getComputedWidth(), "40 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(150 === root_child1.getComputedHeight(), "150 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(80 === root_child0.getComputedLeft(), "80 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(120 === root_child0.getComputedWidth(), "120 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(50 === root_child0.getComputedHeight(), "50 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(160 === root_child1.getComputedLeft(), "160 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(50 === root_child1.getComputedTop(), "50 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(40 === root_child1.getComputedWidth(), "40 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(150 === root_child1.getComputedHeight(), "150 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_main_min_width", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setFlexDirection(Yoga.FLEX_DIRECTION_ROW);
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("15%");
+  root_child0.setMinWidth("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("10%");
+  root_child1.setMinWidth("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(120 === root_child0.getComputedWidth(), "120 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(120 === root_child1.getComputedLeft(), "120 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(80 === root_child1.getComputedWidth(), "80 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(80 === root_child0.getComputedLeft(), "80 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(120 === root_child0.getComputedWidth(), "120 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(200 === root_child0.getComputedHeight(), "200 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(0 === root_child1.getComputedTop(), "0 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(80 === root_child1.getComputedWidth(), "80 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(200 === root_child1.getComputedHeight(), "200 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_flex_basis_cross_min_width", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("10%");
+  root_child0.setMinWidth("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("15%");
+  root_child1.setMinWidth("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(50 === root_child0.getComputedHeight(), "50 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(50 === root_child1.getComputedTop(), "50 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(150 === root_child1.getComputedHeight(), "150 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(50 === root_child0.getComputedHeight(), "50 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(50 === root_child1.getComputedTop(), "50 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(150 === root_child1.getComputedHeight(), "150 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_multiple_nested_with_padding_margin_and_percentage_values", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(200);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setFlexBasis("10%");
+  root_child0.setMargin(Yoga.EDGE_LEFT, 5);
+  root_child0.setMargin(Yoga.EDGE_TOP, 5);
+  root_child0.setMargin(Yoga.EDGE_RIGHT, 5);
+  root_child0.setMargin(Yoga.EDGE_BOTTOM, 5);
+  root_child0.setPadding(Yoga.EDGE_LEFT, 3);
+  root_child0.setPadding(Yoga.EDGE_TOP, 3);
+  root_child0.setPadding(Yoga.EDGE_RIGHT, 3);
+  root_child0.setPadding(Yoga.EDGE_BOTTOM, 3);
+  root_child0.setMinWidth("60%");
+  root.insertChild(root_child0, 0);
+
+  var root_child0_child0 = Yoga.Node.create();
+  root_child0_child0.setMargin(Yoga.EDGE_LEFT, 5);
+  root_child0_child0.setMargin(Yoga.EDGE_TOP, 5);
+  root_child0_child0.setMargin(Yoga.EDGE_RIGHT, 5);
+  root_child0_child0.setMargin(Yoga.EDGE_BOTTOM, 5);
+  root_child0_child0.setPadding(Yoga.EDGE_LEFT, "3%");
+  root_child0_child0.setPadding(Yoga.EDGE_TOP, "3%");
+  root_child0_child0.setPadding(Yoga.EDGE_RIGHT, "3%");
+  root_child0_child0.setPadding(Yoga.EDGE_BOTTOM, "3%");
+  root_child0_child0.setWidth("50%");
+  root_child0.insertChild(root_child0_child0, 0);
+
+  var root_child0_child0_child0 = Yoga.Node.create();
+  root_child0_child0_child0.setMargin(Yoga.EDGE_LEFT, "5%");
+  root_child0_child0_child0.setMargin(Yoga.EDGE_TOP, "5%");
+  root_child0_child0_child0.setMargin(Yoga.EDGE_RIGHT, "5%");
+  root_child0_child0_child0.setMargin(Yoga.EDGE_BOTTOM, "5%");
+  root_child0_child0_child0.setPadding(Yoga.EDGE_LEFT, 3);
+  root_child0_child0_child0.setPadding(Yoga.EDGE_TOP, 3);
+  root_child0_child0_child0.setPadding(Yoga.EDGE_RIGHT, 3);
+  root_child0_child0_child0.setPadding(Yoga.EDGE_BOTTOM, 3);
+  root_child0_child0_child0.setWidth("45%");
+  root_child0_child0.insertChild(root_child0_child0_child0, 0);
+
+  var root_child1 = Yoga.Node.create();
+  root_child1.setFlexGrow(4);
+  root_child1.setFlexBasis("15%");
+  root_child1.setMinWidth("20%");
+  root.insertChild(root_child1, 1);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(5 === root_child0.getComputedLeft(), "5 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(5 === root_child0.getComputedTop(), "5 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(190 === root_child0.getComputedWidth(), "190 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(48 === root_child0.getComputedHeight(), "48 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(8 === root_child0_child0.getComputedLeft(), "8 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+  console.assert(8 === root_child0_child0.getComputedTop(), "8 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+  console.assert(92 === root_child0_child0.getComputedWidth(), "92 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+  console.assert(25 === root_child0_child0.getComputedHeight(), "25 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+  console.assert(10 === root_child0_child0_child0.getComputedLeft(), "10 === root_child0_child0_child0.getComputedLeft() (" + root_child0_child0_child0.getComputedLeft() + ")");
+  console.assert(10 === root_child0_child0_child0.getComputedTop(), "10 === root_child0_child0_child0.getComputedTop() (" + root_child0_child0_child0.getComputedTop() + ")");
+  console.assert(36 === root_child0_child0_child0.getComputedWidth(), "36 === root_child0_child0_child0.getComputedWidth() (" + root_child0_child0_child0.getComputedWidth() + ")");
+  console.assert(6 === root_child0_child0_child0.getComputedHeight(), "6 === root_child0_child0_child0.getComputedHeight() (" + root_child0_child0_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(58 === root_child1.getComputedTop(), "58 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(142 === root_child1.getComputedHeight(), "142 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(200 === root.getComputedHeight(), "200 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(5 === root_child0.getComputedLeft(), "5 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(5 === root_child0.getComputedTop(), "5 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(190 === root_child0.getComputedWidth(), "190 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(48 === root_child0.getComputedHeight(), "48 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(90 === root_child0_child0.getComputedLeft(), "90 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+  console.assert(8 === root_child0_child0.getComputedTop(), "8 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+  console.assert(92 === root_child0_child0.getComputedWidth(), "92 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+  console.assert(25 === root_child0_child0.getComputedHeight(), "25 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+  console.assert(46 === root_child0_child0_child0.getComputedLeft(), "46 === root_child0_child0_child0.getComputedLeft() (" + root_child0_child0_child0.getComputedLeft() + ")");
+  console.assert(10 === root_child0_child0_child0.getComputedTop(), "10 === root_child0_child0_child0.getComputedTop() (" + root_child0_child0_child0.getComputedTop() + ")");
+  console.assert(36 === root_child0_child0_child0.getComputedWidth(), "36 === root_child0_child0_child0.getComputedWidth() (" + root_child0_child0_child0.getComputedWidth() + ")");
+  console.assert(6 === root_child0_child0_child0.getComputedHeight(), "6 === root_child0_child0_child0.getComputedHeight() (" + root_child0_child0_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child1.getComputedLeft(), "0 === root_child1.getComputedLeft() (" + root_child1.getComputedLeft() + ")");
+  console.assert(58 === root_child1.getComputedTop(), "58 === root_child1.getComputedTop() (" + root_child1.getComputedTop() + ")");
+  console.assert(200 === root_child1.getComputedWidth(), "200 === root_child1.getComputedWidth() (" + root_child1.getComputedWidth() + ")");
+  console.assert(142 === root_child1.getComputedHeight(), "142 === root_child1.getComputedHeight() (" + root_child1.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_margin_should_calculate_based_only_on_width", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(100);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setMargin(Yoga.EDGE_LEFT, "10%");
+  root_child0.setMargin(Yoga.EDGE_TOP, "10%");
+  root_child0.setMargin(Yoga.EDGE_RIGHT, "10%");
+  root_child0.setMargin(Yoga.EDGE_BOTTOM, "10%");
+  root.insertChild(root_child0, 0);
+
+  var root_child0_child0 = Yoga.Node.create();
+  root_child0_child0.setWidth(10);
+  root_child0_child0.setHeight(10);
+  root_child0.insertChild(root_child0_child0, 0);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(20 === root_child0.getComputedLeft(), "20 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(20 === root_child0.getComputedTop(), "20 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(160 === root_child0.getComputedWidth(), "160 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(60 === root_child0.getComputedHeight(), "60 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0_child0.getComputedLeft(), "0 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0_child0.getComputedTop(), "0 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+  console.assert(10 === root_child0_child0.getComputedWidth(), "10 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+  console.assert(10 === root_child0_child0.getComputedHeight(), "10 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(20 === root_child0.getComputedLeft(), "20 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(20 === root_child0.getComputedTop(), "20 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(160 === root_child0.getComputedWidth(), "160 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(60 === root_child0.getComputedHeight(), "60 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(150 === root_child0_child0.getComputedLeft(), "150 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0_child0.getComputedTop(), "0 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+  console.assert(10 === root_child0_child0.getComputedWidth(), "10 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+  console.assert(10 === root_child0_child0.getComputedHeight(), "10 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_padding_should_calculate_based_only_on_width", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(100);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setFlexGrow(1);
+  root_child0.setPadding(Yoga.EDGE_LEFT, "10%");
+  root_child0.setPadding(Yoga.EDGE_TOP, "10%");
+  root_child0.setPadding(Yoga.EDGE_RIGHT, "10%");
+  root_child0.setPadding(Yoga.EDGE_BOTTOM, "10%");
+  root.insertChild(root_child0, 0);
+
+  var root_child0_child0 = Yoga.Node.create();
+  root_child0_child0.setWidth(10);
+  root_child0_child0.setHeight(10);
+  root_child0.insertChild(root_child0_child0, 0);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(100 === root_child0.getComputedHeight(), "100 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(20 === root_child0_child0.getComputedLeft(), "20 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+  console.assert(20 === root_child0_child0.getComputedTop(), "20 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+  console.assert(10 === root_child0_child0.getComputedWidth(), "10 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+  console.assert(10 === root_child0_child0.getComputedHeight(), "10 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(0 === root_child0.getComputedLeft(), "0 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(0 === root_child0.getComputedTop(), "0 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(200 === root_child0.getComputedWidth(), "200 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(100 === root_child0.getComputedHeight(), "100 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  console.assert(170 === root_child0_child0.getComputedLeft(), "170 === root_child0_child0.getComputedLeft() (" + root_child0_child0.getComputedLeft() + ")");
+  console.assert(20 === root_child0_child0.getComputedTop(), "20 === root_child0_child0.getComputedTop() (" + root_child0_child0.getComputedTop() + ")");
+  console.assert(10 === root_child0_child0.getComputedWidth(), "10 === root_child0_child0.getComputedWidth() (" + root_child0_child0.getComputedWidth() + ")");
+  console.assert(10 === root_child0_child0.getComputedHeight(), "10 === root_child0_child0.getComputedHeight() (" + root_child0_child0.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});
+it("percentage_absolute_position", function () {
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, true);
+
+  var root = Yoga.Node.create();
+  root.setWidth(200);
+  root.setHeight(100);
+
+  var root_child0 = Yoga.Node.create();
+  root_child0.setPositionType(Yoga.POSITION_TYPE_ABSOLUTE);
+  root_child0.setPosition(Yoga.EDGE_LEFT, "30%");
+  root_child0.setPosition(Yoga.EDGE_TOP, "10%");
+  root_child0.setWidth(10);
+  root_child0.setHeight(10);
+  root.insertChild(root_child0, 0);
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_LTR);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(60 === root_child0.getComputedLeft(), "60 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(10 === root_child0.getComputedTop(), "10 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(10 === root_child0.getComputedWidth(), "10 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(10 === root_child0.getComputedHeight(), "10 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  root.calculateLayout(Yoga.UNDEFINED, Yoga.UNDEFINED, Yoga.DIRECTION_RTL);
+
+  console.assert(0 === root.getComputedLeft(), "0 === root.getComputedLeft() (" + root.getComputedLeft() + ")");
+  console.assert(0 === root.getComputedTop(), "0 === root.getComputedTop() (" + root.getComputedTop() + ")");
+  console.assert(200 === root.getComputedWidth(), "200 === root.getComputedWidth() (" + root.getComputedWidth() + ")");
+  console.assert(100 === root.getComputedHeight(), "100 === root.getComputedHeight() (" + root.getComputedHeight() + ")");
+
+  console.assert(60 === root_child0.getComputedLeft(), "60 === root_child0.getComputedLeft() (" + root_child0.getComputedLeft() + ")");
+  console.assert(10 === root_child0.getComputedTop(), "10 === root_child0.getComputedTop() (" + root_child0.getComputedTop() + ")");
+  console.assert(10 === root_child0.getComputedWidth(), "10 === root_child0.getComputedWidth() (" + root_child0.getComputedWidth() + ")");
+  console.assert(10 === root_child0.getComputedHeight(), "10 === root_child0.getComputedHeight() (" + root_child0.getComputedHeight() + ")");
+
+  if (typeof root !== "undefined")
+    root.freeRecursive();
+
+  (typeof gc !== "undefined") && gc();
+  console.assert(0 === Yoga.getInstanceCount(), "0 === Yoga.getInstanceCount() (" + Yoga.getInstanceCount() + ")");
+
+  Yoga.setExperimentalFeatureEnabled(Yoga.FEATURE_ROUNDING, false);
+});