Merge remote-tracking branch 'origin/5.7' into 5.8

Change-Id: I0cb01e653bf640a929c26c771eebedc9e6656b14

40 files changed, 1153 insertions, 519 deletions

diff --git a/Source/JavaScriptCore/disassembler/udis86/ud_opcode.py b/Source/JavaScriptCore/disassembler/udis86/ud_opcode.py
index f82738062..20ecb7fe5 100644
--- a/Source/JavaScriptCore/disassembler/udis86/ud_opcode.py
+++ b/Source/JavaScriptCore/disassembler/udis86/ud_opcode.py
@@ -115,9 +115,9 @@ class UdOpcodeTables:
             '/mod'   : lambda v: '00' if v == '!11' else '01',
             # Mode extensions:
             # (16, 32, 64) => (00, 01, 02)
-            '/o'     : lambda v: "%02x" % (int(v) / 32),
-            '/a'     : lambda v: "%02x" % (int(v) / 32),
-            '/m'     : lambda v: "%02x" % (int(v) / 32),
+            '/o'     : lambda v: "%02x" % (int(v) // 32),
+            '/a'     : lambda v: "%02x" % (int(v) // 32),
+            '/m'     : lambda v: "%02x" % (int(v) // 32),
             '/sse'   : lambda v: UdOpcodeTables.OpcExtIndex['sse'][v]
         }
 
diff --git a/Source/WebCore/bridge/qt/qt_runtime.cpp b/Source/WebCore/bridge/qt/qt_runtime.cpp
index 58259ff3e..cc1c19cf9 100644
--- a/Source/WebCore/bridge/qt/qt_runtime.cpp
+++ b/Source/WebCore/bridge/qt/qt_runtime.cpp
@@ -1577,7 +1577,12 @@ void QtConnectionObject::execute(void** argv)
         args[i] = convertQVariantToValue(m_context, m_rootObject, QVariant(argType, argv[i+1]), ignoredException);
     }
 
-    JSObjectCallAsFunction(m_context, m_receiverFunction, m_receiver, argc, args.data(), 0);
+    JSValueRef call_exception = 0;
+    ExecState* exec = toJS(m_context);
+    JSObjectCallAsFunction(m_context, m_receiverFunction, m_receiver, argc, args.data(), &call_exception);
+    if (call_exception) {
+        WebCore::reportException(exec, toJS(exec, call_exception));
+    }
 }
 
 bool QtConnectionObject::match(JSContextRef context, QObject* sender, int signalIndex, JSObjectRef receiver, JSObjectRef receiverFunction)
diff --git a/Source/WebCore/css/BasicShapeFunctions.cpp b/Source/WebCore/css/BasicShapeFunctions.cpp
index c5885095e..a99739a78 100644
--- a/Source/WebCore/css/BasicShapeFunctions.cpp
+++ b/Source/WebCore/css/BasicShapeFunctions.cpp
@@ -38,7 +38,7 @@
 
 namespace WebCore {
 
-PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
+PassRefPtr<CSSValue> valueForBasicShape(const RenderStyle* style, const BasicShape* basicShape)
 {
     RefPtr<CSSBasicShape> basicShapeValue;
     switch (basicShape->type()) {
@@ -46,12 +46,12 @@ PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
         const BasicShapeRectangle* rectangle = static_cast<const BasicShapeRectangle*>(basicShape);
         RefPtr<CSSBasicShapeRectangle> rectangleValue = CSSBasicShapeRectangle::create();
 
-        rectangleValue->setX(cssValuePool().createValue(rectangle->x()));
-        rectangleValue->setY(cssValuePool().createValue(rectangle->y()));
-        rectangleValue->setWidth(cssValuePool().createValue(rectangle->width()));
-        rectangleValue->setHeight(cssValuePool().createValue(rectangle->height()));
-        rectangleValue->setRadiusX(cssValuePool().createValue(rectangle->cornerRadiusX()));
-        rectangleValue->setRadiusY(cssValuePool().createValue(rectangle->cornerRadiusY()));
+        rectangleValue->setX(cssValuePool().createValue(rectangle->x(), style));
+        rectangleValue->setY(cssValuePool().createValue(rectangle->y(), style));
+        rectangleValue->setWidth(cssValuePool().createValue(rectangle->width(), style));
+        rectangleValue->setHeight(cssValuePool().createValue(rectangle->height(), style));
+        rectangleValue->setRadiusX(cssValuePool().createValue(rectangle->cornerRadiusX(), style));
+        rectangleValue->setRadiusY(cssValuePool().createValue(rectangle->cornerRadiusY(), style));
 
         basicShapeValue = rectangleValue.release();
         break;
@@ -60,9 +60,9 @@ PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
         const BasicShapeCircle* circle = static_cast<const BasicShapeCircle*>(basicShape);
         RefPtr<CSSBasicShapeCircle> circleValue = CSSBasicShapeCircle::create();
 
-        circleValue->setCenterX(cssValuePool().createValue(circle->centerX()));
-        circleValue->setCenterY(cssValuePool().createValue(circle->centerY()));
-        circleValue->setRadius(cssValuePool().createValue(circle->radius()));
+        circleValue->setCenterX(cssValuePool().createValue(circle->centerX(), style));
+        circleValue->setCenterY(cssValuePool().createValue(circle->centerY(), style));
+        circleValue->setRadius(cssValuePool().createValue(circle->radius(), style));
 
         basicShapeValue = circleValue.release();
         break;
@@ -71,10 +71,10 @@ PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
         const BasicShapeEllipse* ellipse = static_cast<const BasicShapeEllipse*>(basicShape);
         RefPtr<CSSBasicShapeEllipse> ellipseValue = CSSBasicShapeEllipse::create();
 
-        ellipseValue->setCenterX(cssValuePool().createValue(ellipse->centerX()));
-        ellipseValue->setCenterY(cssValuePool().createValue(ellipse->centerY()));
-        ellipseValue->setRadiusX(cssValuePool().createValue(ellipse->radiusX()));
-        ellipseValue->setRadiusY(cssValuePool().createValue(ellipse->radiusY()));
+        ellipseValue->setCenterX(cssValuePool().createValue(ellipse->centerX(), style));
+        ellipseValue->setCenterY(cssValuePool().createValue(ellipse->centerY(), style));
+        ellipseValue->setRadiusX(cssValuePool().createValue(ellipse->radiusX(), style));
+        ellipseValue->setRadiusY(cssValuePool().createValue(ellipse->radiusY(), style));
 
         basicShapeValue = ellipseValue.release();
         break;
@@ -86,7 +86,7 @@ PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
         polygonValue->setWindRule(polygon->windRule());
         const Vector<Length>& values = polygon->values();
         for (unsigned i = 0; i < values.size(); i += 2)
-            polygonValue->appendPoint(cssValuePool().createValue(values.at(i)), cssValuePool().createValue(values.at(i + 1)));
+            polygonValue->appendPoint(cssValuePool().createValue(values.at(i), style), cssValuePool().createValue(values.at(i + 1), style));
 
         basicShapeValue = polygonValue.release();
         break;
@@ -95,12 +95,12 @@ PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
         const BasicShapeInsetRectangle* rectangle = static_cast<const BasicShapeInsetRectangle*>(basicShape);
         RefPtr<CSSBasicShapeInsetRectangle> rectangleValue = CSSBasicShapeInsetRectangle::create();
 
-        rectangleValue->setTop(cssValuePool().createValue(rectangle->top()));
-        rectangleValue->setRight(cssValuePool().createValue(rectangle->right()));
-        rectangleValue->setBottom(cssValuePool().createValue(rectangle->bottom()));
-        rectangleValue->setLeft(cssValuePool().createValue(rectangle->left()));
-        rectangleValue->setRadiusX(cssValuePool().createValue(rectangle->cornerRadiusX()));
-        rectangleValue->setRadiusY(cssValuePool().createValue(rectangle->cornerRadiusY()));
+        rectangleValue->setTop(cssValuePool().createValue(rectangle->top(), style));
+        rectangleValue->setRight(cssValuePool().createValue(rectangle->right(), style));
+        rectangleValue->setBottom(cssValuePool().createValue(rectangle->bottom(), style));
+        rectangleValue->setLeft(cssValuePool().createValue(rectangle->left(), style));
+        rectangleValue->setRadiusX(cssValuePool().createValue(rectangle->cornerRadiusX(), style));
+        rectangleValue->setRadiusY(cssValuePool().createValue(rectangle->cornerRadiusY(), style));
 
         basicShapeValue = rectangleValue.release();
         break;
@@ -113,7 +113,7 @@ PassRefPtr<CSSValue> valueForBasicShape(const BasicShape* basicShape)
 
 static Length convertToLength(const RenderStyle* style, const RenderStyle* rootStyle, CSSPrimitiveValue* value)
 {
-    return value->convertToLength<FixedIntegerConversion | FixedFloatConversion | PercentConversion | ViewportPercentageConversion>(style, rootStyle, style->effectiveZoom());
+    return value->convertToLength<FixedIntegerConversion | FixedFloatConversion | PercentConversion | CalculatedConversion | ViewportPercentageConversion>(style, rootStyle, style->effectiveZoom());
 }
 
 PassRefPtr<BasicShape> basicShapeForValue(const RenderStyle* style, const RenderStyle* rootStyle, const CSSBasicShape* basicShapeValue)
diff --git a/Source/WebCore/css/BasicShapeFunctions.h b/Source/WebCore/css/BasicShapeFunctions.h
index 9bbc7c762..ddf7659a2 100644
--- a/Source/WebCore/css/BasicShapeFunctions.h
+++ b/Source/WebCore/css/BasicShapeFunctions.h
@@ -39,7 +39,7 @@ class CSSBasicShape;
 class CSSValue;
 class RenderStyle;
 
-PassRefPtr<CSSValue> valueForBasicShape(const BasicShape*);
+PassRefPtr<CSSValue> valueForBasicShape(const RenderStyle*, const BasicShape*);
 PassRefPtr<BasicShape> basicShapeForValue(const RenderStyle*, const RenderStyle* rootStyle, const CSSBasicShape*);
 
 }
diff --git a/Source/WebCore/css/CSSCalculationValue.cpp b/Source/WebCore/css/CSSCalculationValue.cpp
index dca177991..9864abd64 100644
--- a/Source/WebCore/css/CSSCalculationValue.cpp
+++ b/Source/WebCore/css/CSSCalculationValue.cpp
@@ -31,10 +31,12 @@
 #include "config.h"
 #include "CSSCalculationValue.h"
 
+#include "CSSPrimitiveValueMappings.h"
 #include "CSSValueList.h"
 #include "Length.h"
 #include "StyleResolver.h"
 
+#include <wtf/MathExtras.h>
 #include <wtf/OwnPtr.h>
 #include <wtf/PassOwnPtr.h>
 #include <wtf/text/StringBuilder.h>
@@ -55,8 +57,6 @@ static CalculationCategory unitCategory(CSSPrimitiveValue::UnitTypes type)
     case CSSPrimitiveValue::CSS_NUMBER:
     case CSSPrimitiveValue::CSS_PARSER_INTEGER:
         return CalcNumber;
-    case CSSPrimitiveValue::CSS_PERCENTAGE:
-        return CalcPercent;
     case CSSPrimitiveValue::CSS_EMS:
     case CSSPrimitiveValue::CSS_EXS:
     case CSSPrimitiveValue::CSS_PX:
@@ -68,6 +68,19 @@ static CalculationCategory unitCategory(CSSPrimitiveValue::UnitTypes type)
     case CSSPrimitiveValue::CSS_REMS:
     case CSSPrimitiveValue::CSS_CHS:
         return CalcLength;
+    case CSSPrimitiveValue::CSS_PERCENTAGE:
+        return CalcPercent;
+    case CSSPrimitiveValue::CSS_DEG:
+    case CSSPrimitiveValue::CSS_RAD:
+    case CSSPrimitiveValue::CSS_GRAD:
+    case CSSPrimitiveValue::CSS_TURN:
+        return CalcAngle;
+    case CSSPrimitiveValue::CSS_MS:
+    case CSSPrimitiveValue::CSS_S:
+        return CalcTime;
+    case CSSPrimitiveValue::CSS_HZ:
+    case CSSPrimitiveValue::CSS_KHZ:
+        return CalcFrequency;
 #if ENABLE(CSS_VARIABLES)
     case CSSPrimitiveValue::CSS_VARIABLE_NAME:
         return CalcVariable;
@@ -77,6 +90,72 @@ static CalculationCategory unitCategory(CSSPrimitiveValue::UnitTypes type)
     }
 }
 
+static bool hasDoubleValue(CSSPrimitiveValue::UnitTypes type)
+{
+    switch (type) {
+    case CSSPrimitiveValue::CSS_NUMBER:
+    case CSSPrimitiveValue::CSS_PARSER_INTEGER:
+    case CSSPrimitiveValue::CSS_PERCENTAGE:
+    case CSSPrimitiveValue::CSS_EMS:
+    case CSSPrimitiveValue::CSS_EXS:
+    case CSSPrimitiveValue::CSS_CHS:
+    case CSSPrimitiveValue::CSS_REMS:
+    case CSSPrimitiveValue::CSS_PX:
+    case CSSPrimitiveValue::CSS_CM:
+    case CSSPrimitiveValue::CSS_MM:
+    case CSSPrimitiveValue::CSS_IN:
+    case CSSPrimitiveValue::CSS_PT:
+    case CSSPrimitiveValue::CSS_PC:
+    case CSSPrimitiveValue::CSS_DEG:
+    case CSSPrimitiveValue::CSS_RAD:
+    case CSSPrimitiveValue::CSS_GRAD:
+    case CSSPrimitiveValue::CSS_MS:
+    case CSSPrimitiveValue::CSS_S:
+    case CSSPrimitiveValue::CSS_HZ:
+    case CSSPrimitiveValue::CSS_KHZ:
+    case CSSPrimitiveValue::CSS_DIMENSION:
+    case CSSPrimitiveValue::CSS_VW:
+    case CSSPrimitiveValue::CSS_VH:
+    case CSSPrimitiveValue::CSS_VMIN:
+    case CSSPrimitiveValue::CSS_VMAX:
+    case CSSPrimitiveValue::CSS_DPPX:
+    case CSSPrimitiveValue::CSS_DPI:
+    case CSSPrimitiveValue::CSS_DPCM:
+        return true;
+    case CSSPrimitiveValue::CSS_UNKNOWN:
+    case CSSPrimitiveValue::CSS_STRING:
+    case CSSPrimitiveValue::CSS_URI:
+    case CSSPrimitiveValue::CSS_IDENT:
+    case CSSPrimitiveValue::CSS_ATTR:
+    case CSSPrimitiveValue::CSS_COUNTER:
+    case CSSPrimitiveValue::CSS_RECT:
+    case CSSPrimitiveValue::CSS_RGBCOLOR:
+    case CSSPrimitiveValue::CSS_PAIR:
+    case CSSPrimitiveValue::CSS_UNICODE_RANGE:
+    case CSSPrimitiveValue::CSS_PARSER_OPERATOR:
+    case CSSPrimitiveValue::CSS_PARSER_HEXCOLOR:
+    case CSSPrimitiveValue::CSS_PARSER_IDENTIFIER:
+    case CSSPrimitiveValue::CSS_TURN:
+    case CSSPrimitiveValue::CSS_COUNTER_NAME:
+    case CSSPrimitiveValue::CSS_SHAPE:
+    case CSSPrimitiveValue::CSS_QUAD:
+    case CSSPrimitiveValue::CSS_CALC:
+    case CSSPrimitiveValue::CSS_CALC_PERCENTAGE_WITH_NUMBER:
+    case CSSPrimitiveValue::CSS_CALC_PERCENTAGE_WITH_LENGTH:
+#if ENABLE(CSS_VARIABLES)
+    case CSSPrimitiveValue::CSS_VARIABLE_NAME:
+#endif
+    case CSSPrimitiveValue::CSS_PROPERTY_ID:
+    case CSSPrimitiveValue::CSS_VALUE_ID:
+#if ENABLE(DASHBOARD_SUPPORT)
+    case CSSPrimitiveValue::CSS_DASHBOARD_REGION:
+#endif
+        return false;
+    };
+    ASSERT_NOT_REACHED();
+    return false;
+}
+
 static String buildCssText(const String& expression)
 {
     StringBuilder result;
@@ -87,7 +166,7 @@ static String buildCssText(const String& expression)
     result.append(expression);
     if (expressionHasSingleTerm)
         result.append(')');
-    return result.toString(); 
+    return result.toString();
 }
 
 String CSSCalcValue::customCssText() const
@@ -115,10 +194,10 @@ bool CSSCalcValue::hasVariableReference() const
 double CSSCalcValue::clampToPermittedRange(double value) const
 {
     return m_nonNegative && value < 0 ? 0 : value;
-}    
-    
-double CSSCalcValue::doubleValue() const 
-{ 
+}
+
+double CSSCalcValue::doubleValue() const
+{
     return clampToPermittedRange(m_expression->doubleValue());
 }
 
@@ -126,20 +205,27 @@ double CSSCalcValue::computeLengthPx(const RenderStyle* currentStyle, const Rend
 {
     return clampToPermittedRange(m_expression->computeLengthPx(currentStyle, rootStyle, multiplier, computingFontSize));
 }
-    
-CSSCalcExpressionNode::~CSSCalcExpressionNode() 
+
+CSSCalcExpressionNode::~CSSCalcExpressionNode()
 {
 }
-    
+
 class CSSCalcPrimitiveValue : public CSSCalcExpressionNode {
     WTF_MAKE_FAST_ALLOCATED;
 public:
 
-    static PassRefPtr<CSSCalcPrimitiveValue> create(CSSPrimitiveValue* value, bool isInteger)
+    static PassRefPtr<CSSCalcPrimitiveValue> create(PassRefPtr<CSSPrimitiveValue> value, bool isInteger)
     {
         return adoptRef(new CSSCalcPrimitiveValue(value, isInteger));
     }
-    
+
+    static PassRefPtr<CSSCalcPrimitiveValue> create(double value, CSSPrimitiveValue::UnitTypes type, bool isInteger)
+    {
+        if (std::isnan(value) || std::isinf(value))
+            return 0;
+        return adoptRef(new CSSCalcPrimitiveValue(CSSPrimitiveValue::create(value, type).get(), isInteger));
+    }
+
     virtual bool isZero() const
     {
         return !m_value->getDoubleValue();
@@ -155,7 +241,7 @@ public:
     {
         return m_value->customSerializeResolvingVariables(variables);
     }
-    
+
     virtual bool hasVariableReference() const
     {
         return m_value->isVariableName();
@@ -170,39 +256,36 @@ public:
         case CalcLength:
             return adoptPtr(new CalcExpressionNumber(m_value->computeLength<float>(style, rootStyle, zoom)));
         case CalcPercent:
-        case CalcPercentLength:
-            return adoptPtr(new CalcExpressionLength(StyleResolver::convertToFloatLength(m_value.get(), style, rootStyle, zoom)));
+        case CalcPercentLength: {
+            CSSPrimitiveValue* primitiveValue = m_value.get();
+            return adoptPtr(new CalcExpressionLength(primitiveValue
+                ? primitiveValue->convertToLength<FixedFloatConversion | PercentConversion | FractionConversion>(style, rootStyle, zoom)
+                : Length(Undefined)));
+        }
         // Only types that could be part of a Length expression can be converted
         // to a CalcExpressionNode. CalcPercentNumber makes no sense as a Length.
         case CalcPercentNumber:
+        case CalcAngle:
+        case CalcTime:
+        case CalcFrequency:
 #if ENABLE(CSS_VARIABLES)
         case CalcVariable:
 #endif
         case CalcOther:
             ASSERT_NOT_REACHED();
         }
+        ASSERT_NOT_REACHED();
         return nullptr;
     }
 
     virtual double doubleValue() const
     {
-        switch (m_category) {
-        case CalcNumber:
-        case CalcPercent:                
+        if (hasDoubleValue(primitiveType()))
             return m_value->getDoubleValue();
-        case CalcLength:
-        case CalcPercentLength:
-        case CalcPercentNumber:
-#if ENABLE(CSS_VARIABLES)
-        case CalcVariable:
-#endif
-        case CalcOther:
-            ASSERT_NOT_REACHED();
-            break;
-        }
+        ASSERT_NOT_REACHED();
         return 0;
     }
-    
+
     virtual double computeLengthPx(const RenderStyle* currentStyle, const RenderStyle* rootStyle, double multiplier, bool computingFontSize) const
     {
         switch (m_category) {
@@ -213,6 +296,9 @@ public:
             return m_value->getDoubleValue();
         case CalcPercentLength:
         case CalcPercentNumber:
+        case CalcAngle:
+        case CalcTime:
+        case CalcFrequency:
 #if ENABLE(CSS_VARIABLES)
         case CalcVariable:
 #endif
@@ -220,7 +306,8 @@ public:
             ASSERT_NOT_REACHED();
             break;
         }
-        return 0;        
+        ASSERT_NOT_REACHED();
+        return 0;
     }
 
     virtual bool equals(const CSSCalcExpressionNode& other) const
@@ -232,9 +319,13 @@ public:
     }
 
     virtual Type type() const { return CssCalcPrimitiveValue; }
-    
+    virtual CSSPrimitiveValue::UnitTypes primitiveType() const
+    {
+        return CSSPrimitiveValue::UnitTypes(m_value->primitiveType());
+    }
+
 private:
-    explicit CSSCalcPrimitiveValue(CSSPrimitiveValue* value, bool isInteger)
+    explicit CSSCalcPrimitiveValue(PassRefPtr<CSSPrimitiveValue> value, bool isInteger)
         : CSSCalcExpressionNode(unitCategory((CSSPrimitiveValue::UnitTypes)value->primitiveType()), isInteger)
         , m_value(value)
     {
@@ -243,21 +334,21 @@ private:
     RefPtr<CSSPrimitiveValue> m_value;
 };
 
-static const CalculationCategory addSubtractResult[CalcOther][CalcOther] = {
-    { CalcNumber,        CalcOther,         CalcPercentNumber, CalcPercentNumber, CalcOther },
-    { CalcOther,         CalcLength,        CalcPercentLength, CalcOther,         CalcPercentLength },
-    { CalcPercentNumber, CalcPercentLength, CalcPercent,       CalcPercentNumber, CalcPercentLength },
-    { CalcPercentNumber, CalcOther,         CalcPercentNumber, CalcPercentNumber, CalcOther },
-    { CalcOther,         CalcPercentLength, CalcPercentLength, CalcOther,         CalcPercentLength },
-};    
+static const CalculationCategory addSubtractResult[CalcAngle][CalcAngle] = {
+//    CalcNumber         CalcLength         CalcPercent        CalcPercentNumber  CalcPercentLength
+    { CalcNumber,        CalcOther,         CalcPercentNumber, CalcPercentNumber, CalcOther }, //         CalcNumber
+    { CalcOther,         CalcLength,        CalcPercentLength, CalcOther,         CalcPercentLength }, // CalcLength
+    { CalcPercentNumber, CalcPercentLength, CalcPercent,       CalcPercentNumber, CalcPercentLength }, // CalcPercent
+    { CalcPercentNumber, CalcOther,         CalcPercentNumber, CalcPercentNumber, CalcOther }, //         CalcPercentNumber
+    { CalcOther,         CalcPercentLength, CalcPercentLength, CalcOther,         CalcPercentLength }, // CalcPercentLength
+};
 
 static CalculationCategory determineCategory(const CSSCalcExpressionNode& leftSide, const CSSCalcExpressionNode& rightSide, CalcOperator op)
 {
     CalculationCategory leftCategory = leftSide.category();
     CalculationCategory rightCategory = rightSide.category();
-
-    if (leftCategory == CalcOther || rightCategory == CalcOther)
-        return CalcOther;
+    ASSERT(leftCategory < CalcOther);
+    ASSERT(rightCategory < CalcOther);
 
 #if ENABLE(CSS_VARIABLES)
     if (leftCategory == CalcVariable || rightCategory == CalcVariable)
@@ -266,10 +357,14 @@ static CalculationCategory determineCategory(const CSSCalcExpressionNode& leftSi
 
     switch (op) {
     case CalcAdd:
-    case CalcSubtract:             
-        return addSubtractResult[leftCategory][rightCategory];
+    case CalcSubtract:
+        if (leftCategory < CalcAngle && rightCategory < CalcAngle)
+            return addSubtractResult[leftCategory][rightCategory];
+        if (leftCategory == rightCategory)
+            return leftCategory;
+        return CalcOther;
     case CalcMultiply:
-        if (leftCategory != CalcNumber && rightCategory != CalcNumber) 
+        if (leftCategory != CalcNumber && rightCategory != CalcNumber)
             return CalcOther;
         return leftCategory == CalcNumber ? rightCategory : leftCategory;
     case CalcDivide:
@@ -277,18 +372,26 @@ static CalculationCategory determineCategory(const CSSCalcExpressionNode& leftSi
             return CalcOther;
         return leftCategory;
     }
-    
+
     ASSERT_NOT_REACHED();
     return CalcOther;
 }
 
+static bool isIntegerResult(const CSSCalcExpressionNode* leftSide, const CSSCalcExpressionNode* rightSide, CalcOperator op)
+{
+    // Performs W3C spec's type checking for calc integers.
+    // http://www.w3.org/TR/css3-values/#calc-type-checking
+    return op != CalcDivide && leftSide->isInteger() && rightSide->isInteger();
+}
+
 class CSSCalcBinaryOperation : public CSSCalcExpressionNode {
 
 public:
-    static PassRefPtr<CSSCalcBinaryOperation> create(PassRefPtr<CSSCalcExpressionNode> leftSide, PassRefPtr<CSSCalcExpressionNode> rightSide, CalcOperator op)
+    static PassRefPtr<CSSCalcExpressionNode> create(PassRefPtr<CSSCalcExpressionNode> leftSide, PassRefPtr<CSSCalcExpressionNode> rightSide, CalcOperator op)
     {
-        ASSERT(leftSide->category() != CalcOther && rightSide->category() != CalcOther);
-        
+        ASSERT(leftSide->category() < CalcOther);
+        ASSERT(rightSide->category() < CalcOther);
+
         CalculationCategory newCategory = determineCategory(*leftSide, *rightSide, op);
 
         if (newCategory == CalcOther)
@@ -296,7 +399,65 @@ public:
 
         return adoptRef(new CSSCalcBinaryOperation(leftSide, rightSide, op, newCategory));
     }
-    
+
+    static PassRefPtr<CSSCalcExpressionNode> createSimplified(PassRefPtr<CSSCalcExpressionNode> leftSide, PassRefPtr<CSSCalcExpressionNode> rightSide, CalcOperator op)
+    {
+        CalculationCategory leftCategory = leftSide->category();
+        CalculationCategory rightCategory = rightSide->category();
+        ASSERT(leftCategory < CalcOther);
+        ASSERT(rightCategory < CalcOther);
+
+        bool isInteger = isIntegerResult(leftSide.get(), rightSide.get(), op);
+
+        // Simplify numbers.
+        if (leftCategory == CalcNumber && rightCategory == CalcNumber) {
+            CSSPrimitiveValue::UnitTypes evaluationType = isInteger ? CSSPrimitiveValue::CSS_PARSER_INTEGER : CSSPrimitiveValue::CSS_NUMBER;
+            return CSSCalcPrimitiveValue::create(evaluateOperator(leftSide->doubleValue(), rightSide->doubleValue(), op), evaluationType, isInteger);
+        }
+
+        // Simplify addition and subtraction between same types.
+        if (op == CalcAdd || op == CalcSubtract) {
+            if (leftCategory == rightSide->category()) {
+                CSSPrimitiveValue::UnitTypes leftType = leftSide->primitiveType();
+                if (hasDoubleValue(leftType)) {
+                    CSSPrimitiveValue::UnitTypes rightType = rightSide->primitiveType();
+                    if (leftType == rightType)
+                        return CSSCalcPrimitiveValue::create(evaluateOperator(leftSide->doubleValue(), rightSide->doubleValue(), op), leftType, isInteger);
+                    CSSPrimitiveValue::UnitCategory leftUnitCategory = CSSPrimitiveValue::unitCategory(leftType);
+                    if (leftUnitCategory != CSSPrimitiveValue::UOther && leftUnitCategory == CSSPrimitiveValue::unitCategory(rightType)) {
+                        CSSPrimitiveValue::UnitTypes canonicalType = CSSPrimitiveValue::canonicalUnitTypeForCategory(leftUnitCategory);
+                        if (canonicalType != CSSPrimitiveValue::CSS_UNKNOWN) {
+                            double leftValue = leftSide->doubleValue() * CSSPrimitiveValue::conversionToCanonicalUnitsScaleFactor(leftType);
+                            double rightValue = rightSide->doubleValue() * CSSPrimitiveValue::conversionToCanonicalUnitsScaleFactor(rightType);
+                            return CSSCalcPrimitiveValue::create(evaluateOperator(leftValue, rightValue, op), canonicalType, isInteger);
+                        }
+                    }
+                }
+            }
+        } else {
+            // Simplify multiplying or dividing by a number for simplifiable types.
+            ASSERT(op == CalcMultiply || op == CalcDivide);
+            CSSCalcExpressionNode* numberSide = getNumberSide(leftSide.get(), rightSide.get());
+            if (!numberSide)
+                return create(leftSide, rightSide, op);
+            if (numberSide == leftSide && op == CalcDivide)
+                return 0;
+            CSSCalcExpressionNode* otherSide = leftSide == numberSide ? rightSide.get() : leftSide.get();
+
+            double number = numberSide->doubleValue();
+            if (std::isnan(number) || std::isinf(number))
+                return 0;
+            if (op == CalcDivide && !number)
+                return 0;
+
+            CSSPrimitiveValue::UnitTypes otherType = otherSide->primitiveType();
+            if (hasDoubleValue(otherType))
+                return CSSCalcPrimitiveValue::create(evaluateOperator(otherSide->doubleValue(), number, op), otherType, isInteger);
+        }
+
+        return create(leftSide, rightSide, op);
+    }
+
     virtual bool isZero() const
     {
         return !doubleValue();
@@ -313,11 +474,11 @@ public:
         return adoptPtr(new CalcExpressionBinaryOperation(left.release(), right.release(), m_operator));
     }
 
-    virtual double doubleValue() const 
+    virtual double doubleValue() const
     {
         return evaluate(m_leftSide->doubleValue(), m_rightSide->doubleValue());
     }
-    
+
     virtual double computeLengthPx(const RenderStyle* currentStyle, const RenderStyle* rootStyle, double multiplier, bool computingFontSize) const
     {
         const double leftValue = m_leftSide->computeLengthPx(currentStyle, rootStyle, multiplier, computingFontSize);
@@ -335,8 +496,8 @@ public:
         result.append(' ');
         result.append(rightExpression);
         result.append(')');
-    
-        return result.toString();  
+
+        return result.toString();
     }
 
     virtual String customCssText() const
@@ -369,18 +530,70 @@ public:
 
     virtual Type type() const { return CssCalcBinaryOperation; }
 
+    virtual CSSPrimitiveValue::UnitTypes primitiveType() const
+    {
+        switch (m_category) {
+        case CalcNumber:
+            ASSERT(m_leftSide->category() == CalcNumber && m_rightSide->category() == CalcNumber);
+            if (m_isInteger)
+                return CSSPrimitiveValue::CSS_PARSER_INTEGER;
+            return CSSPrimitiveValue::CSS_NUMBER;
+        case CalcLength:
+        case CalcPercent: {
+            if (m_leftSide->category() == CalcNumber)
+                return m_rightSide->primitiveType();
+            if (m_rightSide->category() == CalcNumber)
+                return m_leftSide->primitiveType();
+            CSSPrimitiveValue::UnitTypes leftType = m_leftSide->primitiveType();
+            if (leftType == m_rightSide->primitiveType())
+                return leftType;
+            return CSSPrimitiveValue::CSS_UNKNOWN;
+        }
+#if ENABLE(CSS_VARIABLES)
+        case CalcVariable:
+            return CSSPrimitiveValue::CSS_VARIABLE_NAME;
+#endif
+        case CalcAngle:
+            return CSSPrimitiveValue::CSS_DEG;
+        case CalcTime:
+            return CSSPrimitiveValue::CSS_MS;
+        case CalcFrequency:
+            return CSSPrimitiveValue::CSS_HZ;
+        case CalcPercentLength:
+        case CalcPercentNumber:
+        case CalcOther:
+            return CSSPrimitiveValue::CSS_UNKNOWN;
+        }
+        ASSERT_NOT_REACHED();
+        return CSSPrimitiveValue::CSS_UNKNOWN;
+    }
+
 private:
     CSSCalcBinaryOperation(PassRefPtr<CSSCalcExpressionNode> leftSide, PassRefPtr<CSSCalcExpressionNode> rightSide, CalcOperator op, CalculationCategory category)
-        : CSSCalcExpressionNode(category, leftSide->isInteger() && rightSide->isInteger())
+        : CSSCalcExpressionNode(category, isIntegerResult(leftSide.get(), rightSide.get(), op))
         , m_leftSide(leftSide)
         , m_rightSide(rightSide)
         , m_operator(op)
     {
     }
-    
-    double evaluate(double leftValue, double rightValue) const
+
+    static CSSCalcExpressionNode* getNumberSide(CSSCalcExpressionNode* leftSide, CSSCalcExpressionNode* rightSide)
+    {
+        if (leftSide->category() == CalcNumber)
+            return leftSide;
+        if (rightSide->category() == CalcNumber)
+            return rightSide;
+        return 0;
+    }
+
+    double evaluate(double leftSide, double rightSide) const
+    {
+        return evaluateOperator(leftSide, rightSide, m_operator);
+    }
+
+    static double evaluateOperator(double leftValue, double rightValue, CalcOperator op)
     {
-        switch (m_operator) {
+        switch (op) {
         case CalcAdd:
             return leftValue + rightValue;
         case CalcSubtract:
@@ -394,7 +607,7 @@ private:
         }
         return 0;
     }
-    
+
     const RefPtr<CSSCalcExpressionNode> m_leftSide;
     const RefPtr<CSSCalcExpressionNode> m_rightSide;
     const CalcOperator m_operator;
@@ -449,7 +662,7 @@ private:
         if (!value || !value->isPrimitiveValue())
             return false;
 
-        CSSPrimitiveValue* primitiveValue = static_cast<CSSPrimitiveValue*>(value.get());
+        CSSPrimitiveValue* primitiveValue = toCSSPrimitiveValue(value.get());
         result->value = CSSCalcPrimitiveValue::create(primitiveValue, parserValue->isInt);
 
         ++*index;
@@ -459,8 +672,8 @@ private:
     bool parseValueTerm(CSSParserValueList* tokens, int depth, unsigned* index, Value* result)
     {
         if (checkDepthAndIndex(&depth, *index, tokens) != OK)
-            return false;    
-        
+            return false;
+
         if (operatorValue(tokens, *index) == '(') {
             unsigned currentIndex = *index + 1;
             if (!parseValueExpression(tokens, depth, &currentIndex, result))
@@ -478,7 +691,7 @@ private:
     bool parseValueMultiplicativeExpression(CSSParserValueList* tokens, int depth, unsigned* index, Value* result)
     {
         if (checkDepthAndIndex(&depth, *index, tokens) != OK)
-            return false;    
+            return false;
 
         if (!parseValueTerm(tokens, depth, index, result))
             return false;
@@ -493,7 +706,7 @@ private:
             if (!parseValueTerm(tokens, depth, index, &rhs))
                 return false;
 
-            result->value = CSSCalcBinaryOperation::create(result->value, rhs.value, static_cast<CalcOperator>(operatorCharacter));
+            result->value = CSSCalcBinaryOperation::createSimplified(result->value, rhs.value, static_cast<CalcOperator>(operatorCharacter));
             if (!result->value)
                 return false;
         }
@@ -505,7 +718,7 @@ private:
     bool parseAdditiveValueExpression(CSSParserValueList* tokens, int depth, unsigned* index, Value* result)
     {
         if (checkDepthAndIndex(&depth, *index, tokens) != OK)
-            return false;    
+            return false;
 
         if (!parseValueMultiplicativeExpression(tokens, depth, index, result))
             return false;
@@ -520,7 +733,7 @@ private:
             if (!parseValueMultiplicativeExpression(tokens, depth, index, &rhs))
                 return false;
 
-            result->value = CSSCalcBinaryOperation::create(result->value, rhs.value, static_cast<CalcOperator>(operatorCharacter));
+            result->value = CSSCalcBinaryOperation::createSimplified(result->value, rhs.value, static_cast<CalcOperator>(operatorCharacter));
             if (!result->value)
                 return false;
         }
@@ -535,16 +748,96 @@ private:
     }
 };
 
+PassRefPtr<CSSCalcExpressionNode> CSSCalcValue::createExpressionNode(PassRefPtr<CSSPrimitiveValue> value, bool isInteger)
+{
+    return CSSCalcPrimitiveValue::create(value, isInteger);
+}
+
+PassRefPtr<CSSCalcExpressionNode> CSSCalcValue::createExpressionNode(PassRefPtr<CSSCalcExpressionNode> leftSide, PassRefPtr<CSSCalcExpressionNode> rightSide, CalcOperator op)
+{
+    return CSSCalcBinaryOperation::create(leftSide, rightSide, op);
+}
+
+PassRefPtr<CSSCalcExpressionNode> CSSCalcValue::createExpressionNode(const CalcExpressionNode* node, const RenderStyle* style)
+{
+    switch (node->type()) {
+    case CalcExpressionNodeNumber: {
+        float value = toCalcExpressionNumber(node)->value();
+        return createExpressionNode(CSSPrimitiveValue::create(value, CSSPrimitiveValue::CSS_NUMBER), value == trunc(value));
+    }
+    case CalcExpressionNodeLength:
+        return createExpressionNode(toCalcExpressionLength(node)->length(), style);
+    case CalcExpressionNodeBinaryOperation: {
+        const CalcExpressionBinaryOperation* binaryNode = toCalcExpressionBinaryOperation(node);
+        return createExpressionNode(createExpressionNode(binaryNode->leftSide(), style), createExpressionNode(binaryNode->rightSide(), style), binaryNode->getOperator());
+    }
+    case CalcExpressionNodeBlendLength: {
+        // FIXME: (http://webkit.org/b/122036) Create a CSSCalcExpressionNode equivalent of CalcExpressionBlendLength.
+        const CalcExpressionBlendLength* blendNode = toCalcExpressionBlendLength(node);
+        const double progress = blendNode->progress();
+        const bool isInteger = !progress || (progress == 1);
+        return createExpressionNode(
+            createExpressionNode(
+                createExpressionNode(blendNode->from(), style),
+                createExpressionNode(CSSPrimitiveValue::create(1 - progress, CSSPrimitiveValue::CSS_NUMBER), isInteger),
+                CalcMultiply),
+            createExpressionNode(
+                createExpressionNode(blendNode->to(), style),
+                createExpressionNode(CSSPrimitiveValue::create(progress, CSSPrimitiveValue::CSS_NUMBER), isInteger),
+                CalcMultiply),
+            CalcAdd);
+    }
+    case CalcExpressionNodeUndefined:
+        ASSERT_NOT_REACHED();
+        return 0;
+    }
+    ASSERT_NOT_REACHED();
+    return 0;
+}
+
+PassRefPtr<CSSCalcExpressionNode> CSSCalcValue::createExpressionNode(const Length& length, const RenderStyle* style)
+{
+    switch (length.type()) {
+    case Percent:
+    case ViewportPercentageWidth:
+    case ViewportPercentageHeight:
+    case ViewportPercentageMin:
+    case ViewportPercentageMax:
+    case Fixed:
+        return createExpressionNode(CSSPrimitiveValue::create(length, style), length.value() == trunc(length.value()));
+    case Calculated:
+        return createExpressionNode(length.calculationValue()->expression(), style);
+    case Auto:
+    case Intrinsic:
+    case MinIntrinsic:
+    case MinContent:
+    case MaxContent:
+    case FillAvailable:
+    case FitContent:
+    case Relative:
+    case Undefined:
+        ASSERT_NOT_REACHED();
+        return 0;
+    }
+    ASSERT_NOT_REACHED();
+    return 0;
+}
+
 PassRefPtr<CSSCalcValue> CSSCalcValue::create(CSSParserString name, CSSParserValueList* parserValueList, CalculationPermittedValueRange range)
-{    
-    CSSCalcExpressionNodeParser parser;    
+{
+    CSSCalcExpressionNodeParser parser;
     RefPtr<CSSCalcExpressionNode> expression;
-    
+
     if (equalIgnoringCase(name, "calc(") || equalIgnoringCase(name, "-webkit-calc("))
-        expression = parser.parseCalc(parserValueList);    
-    // FIXME calc (http://webkit.org/b/16662) Add parsing for min and max here
+        expression = parser.parseCalc(parserValueList);
+    // FIXME: calc (http://webkit.org/b/16662) Add parsing for min and max here
 
     return expression ? adoptRef(new CSSCalcValue(expression, range)) : 0;
 }
 
+PassRefPtr<CSSCalcValue> CSSCalcValue::create(PassRefPtr<CSSCalcExpressionNode> expression, CalculationPermittedValueRange range)
+{
+    return adoptRef(new CSSCalcValue(expression, range));
+}
+
 } // namespace WebCore
diff --git a/Source/WebCore/css/CSSCalculationValue.h b/Source/WebCore/css/CSSCalculationValue.h
index 266e8f76c..27ff176f1 100644
--- a/Source/WebCore/css/CSSCalculationValue.h
+++ b/Source/WebCore/css/CSSCalculationValue.h
@@ -32,6 +32,7 @@
 #define CSSCalculationValue_h
 
 #include "CSSParserValues.h"
+#include "CSSPrimitiveValue.h"
 #include "CSSValue.h"
 #include "CalculationValue.h"
 #include <wtf/PassOwnPtr.h>
@@ -42,9 +43,10 @@ namespace WebCore {
 
 class CSSParserValueList;
 class CSSValueList;
-class RenderStyle;
 class CalculationValue;
 class CalcExpressionNode;
+class RenderStyle;
+struct Length;
 
 enum CalculationCategory {
     CalcNumber = 0,
@@ -52,12 +54,15 @@ enum CalculationCategory {
     CalcPercent,
     CalcPercentNumber,
     CalcPercentLength,
+    CalcAngle,
+    CalcTime,
+    CalcFrequency,
 #if ENABLE(CSS_VARIABLES)
     CalcVariable,
 #endif
     CalcOther
 };
-    
+
 class CSSCalcExpressionNode : public RefCounted<CSSCalcExpressionNode> {
 public:
     enum Type {
@@ -67,7 +72,7 @@ public:
 
     virtual ~CSSCalcExpressionNode() = 0;
     virtual bool isZero() const = 0;
-    virtual PassOwnPtr<CalcExpressionNode> toCalcValue(const RenderStyle*, const RenderStyle* rootStyle, double zoom = 1.0) const = 0;    
+    virtual PassOwnPtr<CalcExpressionNode> toCalcValue(const RenderStyle*, const RenderStyle* rootStyle, double zoom = 1.0) const = 0;
     virtual double doubleValue() const = 0;
     virtual double computeLengthPx(const RenderStyle* currentStyle, const RenderStyle* rootStyle, double multiplier = 1.0, bool computingFontSize = false) const = 0;
     virtual String customCssText() const = 0;
@@ -78,56 +83,84 @@ public:
     virtual bool equals(const CSSCalcExpressionNode& other) const { return m_category == other.m_category && m_isInteger == other.m_isInteger; }
     virtual Type type() const = 0;
 
-    CalculationCategory category() const { return m_category; }    
+    CalculationCategory category() const { return m_category; }
+    virtual CSSPrimitiveValue::UnitTypes primitiveType() const = 0;
     bool isInteger() const { return m_isInteger; }
-    
+
 protected:
     CSSCalcExpressionNode(CalculationCategory category, bool isInteger)
         : m_category(category)
         , m_isInteger(isInteger)
     {
     }
-    
+
     CalculationCategory m_category;
     bool m_isInteger;
 };
-        
+
 class CSSCalcValue : public CSSValue {
 public:
     static PassRefPtr<CSSCalcValue> create(CSSParserString name, CSSParserValueList*, CalculationPermittedValueRange);
-    static PassRefPtr<CSSCalcValue> create(CalculationValue*);
+    static PassRefPtr<CSSCalcValue> create(PassRefPtr<CSSCalcExpressionNode>, CalculationPermittedValueRange = CalculationRangeAll);
+    static PassRefPtr<CSSCalcValue> create(const CalculationValue* value, const RenderStyle* style) { return adoptRef(new CSSCalcValue(value, style)); }
+
+    static PassRefPtr<CSSCalcExpressionNode> createExpressionNode(PassRefPtr<CSSPrimitiveValue>, bool isInteger = false);
+    static PassRefPtr<CSSCalcExpressionNode> createExpressionNode(PassRefPtr<CSSCalcExpressionNode>, PassRefPtr<CSSCalcExpressionNode>, CalcOperator);
+    static PassRefPtr<CSSCalcExpressionNode> createExpressionNode(const CalcExpressionNode*, const RenderStyle*);
+    static PassRefPtr<CSSCalcExpressionNode> createExpressionNode(const Length&, const RenderStyle*);
 
     PassRefPtr<CalculationValue> toCalcValue(const RenderStyle* style, const RenderStyle* rootStyle, double zoom = 1.0) const
     {
         return CalculationValue::create(m_expression->toCalcValue(style, rootStyle, zoom), m_nonNegative ? CalculationRangeNonNegative : CalculationRangeAll);
     }
     CalculationCategory category() const { return m_expression->category(); }
-    bool isInt() const { return m_expression->isInteger(); }    
+    bool isInt() const { return m_expression->isInteger(); }
     double doubleValue() const;
     bool isNegative() const { return m_expression->doubleValue() < 0; }
+    CalculationPermittedValueRange permittedValueRange() { return m_nonNegative ? CalculationRangeNonNegative : CalculationRangeAll; }
     double computeLengthPx(const RenderStyle* currentStyle, const RenderStyle* rootStyle, double multiplier = 1.0, bool computingFontSize = false) const;
-        
+
+    CSSCalcExpressionNode* expressionNode() const { return m_expression.get(); }
+
     String customCssText() const;
     bool equals(const CSSCalcValue&) const;
 #if ENABLE(CSS_VARIABLES)
     String customSerializeResolvingVariables(const HashMap<AtomicString, String>&) const;
     bool hasVariableReference() const;
 #endif
-    
-private:    
+
+private:
     CSSCalcValue(PassRefPtr<CSSCalcExpressionNode> expression, CalculationPermittedValueRange range)
         : CSSValue(CalculationClass)
         , m_expression(expression)
         , m_nonNegative(range == CalculationRangeNonNegative)
     {
     }
-    
+    CSSCalcValue(const CalculationValue* value, const RenderStyle* style)
+        : CSSValue(CalculationClass)
+        , m_expression(createExpressionNode(value->expression(), style))
+        , m_nonNegative(value->isNonNegative())
+    {
+    }
+
     double clampToPermittedRange(double) const;
 
     const RefPtr<CSSCalcExpressionNode> m_expression;
     const bool m_nonNegative;
 };
-    
+
+inline CSSCalcValue* toCSSCalcValue(CSSValue* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->isCalculationValue());
+    return static_cast<CSSCalcValue*>(value);
+}
+
+inline const CSSCalcValue* toCSSCalcValue(const CSSValue* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->isCalculationValue());
+    return static_cast<const CSSCalcValue*>(value);
+}
+
 } // namespace WebCore
 
 #endif // CSSCalculationValue_h
diff --git a/Source/WebCore/css/CSSComputedStyleDeclaration.cpp b/Source/WebCore/css/CSSComputedStyleDeclaration.cpp
index f645ace2c..f4c25e435 100644
--- a/Source/WebCore/css/CSSComputedStyleDeclaration.cpp
+++ b/Source/WebCore/css/CSSComputedStyleDeclaration.cpp
@@ -276,15 +276,15 @@ static const CSSPropertyID computedProperties[] = {
 #if ENABLE(CSS_FILTERS)
     CSSPropertyWebkitFilter,
 #endif
-    CSSPropertyWebkitAlignContent,
-    CSSPropertyWebkitAlignItems,
-    CSSPropertyWebkitAlignSelf,
-    CSSPropertyWebkitFlexBasis,
-    CSSPropertyWebkitFlexGrow,
-    CSSPropertyWebkitFlexShrink,
-    CSSPropertyWebkitFlexDirection,
-    CSSPropertyWebkitFlexWrap,
-    CSSPropertyWebkitJustifyContent,
+    CSSPropertyAlignContent,
+    CSSPropertyAlignItems,
+    CSSPropertyAlignSelf,
+    CSSPropertyFlexBasis,
+    CSSPropertyFlexGrow,
+    CSSPropertyFlexShrink,
+    CSSPropertyFlexDirection,
+    CSSPropertyFlexWrap,
+    CSSPropertyJustifyContent,
     CSSPropertyWebkitFontKerning,
     CSSPropertyWebkitFontSmoothing,
     CSSPropertyWebkitFontVariantLigatures,
@@ -330,7 +330,7 @@ static const CSSPropertyID computedProperties[] = {
     CSSPropertyWebkitMaskRepeat,
     CSSPropertyWebkitMaskSize,
     CSSPropertyWebkitNbspMode,
-    CSSPropertyWebkitOrder,
+    CSSPropertyOrder,
 #if ENABLE(ACCELERATED_OVERFLOW_SCROLLING)
     CSSPropertyWebkitOverflowScrolling,
 #endif
@@ -1958,11 +1958,11 @@ PassRefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propert
             return cssValuePool().createValue(style->display());
         case CSSPropertyEmptyCells:
             return cssValuePool().createValue(style->emptyCells());
-        case CSSPropertyWebkitAlignContent:
+        case CSSPropertyAlignContent:
             return cssValuePool().createValue(style->alignContent());
-        case CSSPropertyWebkitAlignItems:
+        case CSSPropertyAlignItems:
             return cssValuePool().createValue(style->alignItems());
-        case CSSPropertyWebkitAlignSelf:
+        case CSSPropertyAlignSelf:
             if (style->alignSelf() == AlignAuto) {
                 Node* parent = styledNode->parentNode();
                 if (parent && parent->computedStyle())
@@ -1970,23 +1970,23 @@ PassRefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propert
                 return cssValuePool().createValue(AlignStretch);
             }
             return cssValuePool().createValue(style->alignSelf());
-        case CSSPropertyWebkitFlex:
-            return getCSSPropertyValuesForShorthandProperties(webkitFlexShorthand());
-        case CSSPropertyWebkitFlexBasis:
+        case CSSPropertyFlex:
+            return getCSSPropertyValuesForShorthandProperties(flexShorthand());
+        case CSSPropertyFlexBasis:
             return cssValuePool().createValue(style->flexBasis());
-        case CSSPropertyWebkitFlexDirection:
+        case CSSPropertyFlexDirection:
             return cssValuePool().createValue(style->flexDirection());
-        case CSSPropertyWebkitFlexFlow:
-            return getCSSPropertyValuesForShorthandProperties(webkitFlexFlowShorthand());
-        case CSSPropertyWebkitFlexGrow:
+        case CSSPropertyFlexFlow:
+            return getCSSPropertyValuesForShorthandProperties(flexFlowShorthand());
+        case CSSPropertyFlexGrow:
             return cssValuePool().createValue(style->flexGrow());
-        case CSSPropertyWebkitFlexShrink:
+        case CSSPropertyFlexShrink:
             return cssValuePool().createValue(style->flexShrink());
-        case CSSPropertyWebkitFlexWrap:
+        case CSSPropertyFlexWrap:
             return cssValuePool().createValue(style->flexWrap());
-        case CSSPropertyWebkitJustifyContent:
+        case CSSPropertyJustifyContent:
             return cssValuePool().createValue(style->justifyContent());
-        case CSSPropertyWebkitOrder:
+        case CSSPropertyOrder:
             return cssValuePool().createValue(style->order(), CSSPrimitiveValue::CSS_NUMBER);
         case CSSPropertyFloat:
             if (style->display() != NONE && style->hasOutOfFlowPosition())
@@ -2707,7 +2707,7 @@ PassRefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propert
         case CSSPropertyWebkitClipPath:
             if (ClipPathOperation* operation = style->clipPath()) {
                 if (operation->getOperationType() == ClipPathOperation::SHAPE)
-                    return valueForBasicShape(static_cast<ShapeClipPathOperation*>(operation)->basicShape());
+                    return valueForBasicShape(style.get(), static_cast<ShapeClipPathOperation*>(operation)->basicShape());
 #if ENABLE(SVG)
                 else if (operation->getOperationType() == ClipPathOperation::REFERENCE) {
                     ReferenceClipPathOperation* referenceOperation = static_cast<ReferenceClipPathOperation*>(operation);
@@ -2750,7 +2750,7 @@ PassRefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propert
                 return cssValuePool().createIdentifierValue(CSSValueNone);
             }
             ASSERT(style->shapeInside()->type() == ShapeValue::Shape);
-            return valueForBasicShape(style->shapeInside()->shape());
+            return valueForBasicShape(style.get(), style->shapeInside()->shape());
         case CSSPropertyWebkitShapeOutside:
             if (!style->shapeOutside())
                 return cssValuePool().createIdentifierValue(CSSValueAuto);
@@ -2760,7 +2760,7 @@ PassRefPtr<CSSValue> ComputedStyleExtractor::propertyValue(CSSPropertyID propert
                 return cssValuePool().createIdentifierValue(CSSValueNone);
             }
             ASSERT(style->shapeOutside()->type() == ShapeValue::Shape);
-            return valueForBasicShape(style->shapeOutside()->shape());
+            return valueForBasicShape(style.get(), style->shapeOutside()->shape());
 #endif
 #if ENABLE(CSS_FILTERS)
         case CSSPropertyWebkitFilter:
diff --git a/Source/WebCore/css/CSSParser.cpp b/Source/WebCore/css/CSSParser.cpp
index 54fd5e238..eabbd5024 100644
--- a/Source/WebCore/css/CSSParser.cpp
+++ b/Source/WebCore/css/CSSParser.cpp
@@ -703,7 +703,7 @@ static inline bool isValidKeywordPropertyAndValue(CSSPropertyID propertyId, int
         // inline | block | list-item | run-in | inline-block | table |
         // inline-table | table-row-group | table-header-group | table-footer-group | table-row |
         // table-column-group | table-column | table-cell | table-caption | -webkit-box | -webkit-inline-box | none | inherit
-        // -webkit-flex | -webkit-inline-flex | -webkit-grid | -webkit-inline-grid
+        // flex | -webkit-flex | inline-flex | -webkit-inline-flex | -webkit-grid | -webkit-inline-grid
         if ((valueID >= CSSValueInline && valueID <= CSSValueWebkitInlineFlex) || valueID == CSSValueNone)
             return true;
         if (parserContext.isCSSGridLayoutEnabled && (valueID == CSSValueWebkitGrid || valueID == CSSValueWebkitInlineGrid))
@@ -872,27 +872,27 @@ static inline bool isValidKeywordPropertyAndValue(CSSPropertyID propertyId, int
         if (valueID == CSSValueSrgb || valueID == CSSValueDefault)
             return true;
         break;
-    case CSSPropertyWebkitAlignContent:
+    case CSSPropertyAlignContent:
          if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueSpaceBetween || valueID == CSSValueSpaceAround || valueID == CSSValueStretch)
              return true;
          break;
-    case CSSPropertyWebkitAlignItems:
+    case CSSPropertyAlignItems:
         if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
             return true;
         break;
-    case CSSPropertyWebkitAlignSelf:
+    case CSSPropertyAlignSelf:
         if (valueID == CSSValueAuto || valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
             return true;
         break;
-    case CSSPropertyWebkitFlexDirection:
+    case CSSPropertyFlexDirection:
         if (valueID == CSSValueRow || valueID == CSSValueRowReverse || valueID == CSSValueColumn || valueID == CSSValueColumnReverse)
             return true;
         break;
-    case CSSPropertyWebkitFlexWrap:
+    case CSSPropertyFlexWrap:
         if (valueID == CSSValueNowrap || valueID == CSSValueWrap || valueID == CSSValueWrapReverse)
              return true;
         break;
-    case CSSPropertyWebkitJustifyContent:
+    case CSSPropertyJustifyContent:
         if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueSpaceBetween || valueID == CSSValueSpaceAround)
             return true;
         break;
@@ -1119,12 +1119,12 @@ static inline bool isKeywordPropertyID(CSSPropertyID propertyId)
     case CSSPropertyWebkitColumnBreakBefore:
     case CSSPropertyWebkitColumnBreakInside:
     case CSSPropertyWebkitColumnRuleStyle:
-    case CSSPropertyWebkitAlignContent:
-    case CSSPropertyWebkitAlignItems:
-    case CSSPropertyWebkitAlignSelf:
-    case CSSPropertyWebkitFlexDirection:
-    case CSSPropertyWebkitFlexWrap:
-    case CSSPropertyWebkitJustifyContent:
+    case CSSPropertyAlignContent:
+    case CSSPropertyAlignItems:
+    case CSSPropertyAlignSelf:
+    case CSSPropertyFlexDirection:
+    case CSSPropertyFlexWrap:
+    case CSSPropertyJustifyContent:
     case CSSPropertyWebkitFontKerning:
     case CSSPropertyWebkitFontSmoothing:
     case CSSPropertyWebkitHyphens:
@@ -1609,6 +1609,13 @@ bool CSSParser::validCalculationUnit(CSSParserValue* value, Units unitflags, Rel
 
     bool b = false;
     switch (m_parsedCalculation->category()) {
+    case CalcNumber:
+        b = (unitflags & FNumber);
+        if (!b && (unitflags & FInteger) && m_parsedCalculation->isInt())
+            b = true;
+        if (b && mustBeNonNegative && m_parsedCalculation->isNegative())
+            b = false;
+        break;
     case CalcLength:
         b = (unitflags & FLength);
         break;
@@ -1617,19 +1624,21 @@ bool CSSParser::validCalculationUnit(CSSParserValue* value, Units unitflags, Rel
         if (b && mustBeNonNegative && m_parsedCalculation->isNegative())
             b = false;
         break;
-    case CalcNumber:
-        b = (unitflags & FNumber);
-        if (!b && (unitflags & FInteger) && m_parsedCalculation->isInt())
-            b = true;
-        if (b && mustBeNonNegative && m_parsedCalculation->isNegative())
-            b = false;
-        break;
     case CalcPercentLength:
         b = (unitflags & FPercent) && (unitflags & FLength);
         break;
     case CalcPercentNumber:
         b = (unitflags & FPercent) && (unitflags & FNumber);
         break;
+    case CalcAngle:
+        b = (unitflags & FAngle);
+        break;
+    case CalcTime:
+        b = (unitflags & FTime);
+        break;
+    case CalcFrequency:
+        b = (unitflags & FFrequency);
+        break;
 #if ENABLE(CSS_VARIABLES)
     case CalcVariable:
         b = true;
@@ -2500,28 +2509,28 @@ bool CSSParser::parseValue(CSSPropertyID propId, bool important)
             validPrimitive = true;
         break;
 #endif
-    case CSSPropertyWebkitFlex: {
+    case CSSPropertyFlex: {
         ShorthandScope scope(this, propId);
         if (id == CSSValueNone) {
-            addProperty(CSSPropertyWebkitFlexGrow, cssValuePool().createValue(0, CSSPrimitiveValue::CSS_NUMBER), important);
-            addProperty(CSSPropertyWebkitFlexShrink, cssValuePool().createValue(0, CSSPrimitiveValue::CSS_NUMBER), important);
-            addProperty(CSSPropertyWebkitFlexBasis, cssValuePool().createIdentifierValue(CSSValueAuto), important);
+            addProperty(CSSPropertyFlexGrow, cssValuePool().createValue(0, CSSPrimitiveValue::CSS_NUMBER), important);
+            addProperty(CSSPropertyFlexShrink, cssValuePool().createValue(0, CSSPrimitiveValue::CSS_NUMBER), important);
+            addProperty(CSSPropertyFlexBasis, cssValuePool().createIdentifierValue(CSSValueAuto), important);
             return true;
         }
         return parseFlex(m_valueList.get(), important);
     }
-    case CSSPropertyWebkitFlexBasis:
+    case CSSPropertyFlexBasis:
         // FIXME: Support intrinsic dimensions too.
         if (id == CSSValueAuto)
             validPrimitive = true;
         else
             validPrimitive = (!id && validUnit(value, FLength | FPercent | FNonNeg));
         break;
-    case CSSPropertyWebkitFlexGrow:
-    case CSSPropertyWebkitFlexShrink:
+    case CSSPropertyFlexGrow:
+    case CSSPropertyFlexShrink:
         validPrimitive = validUnit(value, FNumber | FNonNeg);
         break;
-    case CSSPropertyWebkitOrder:
+    case CSSPropertyOrder:
         if (validUnit(value, FInteger, CSSStrictMode)) {
             // We restrict the smallest value to int min + 2 because we use int min and int min + 1 as special values in a hash set.
             parsedValue = cssValuePool().createValue(max(static_cast<double>(std::numeric_limits<int>::min() + 2), value->fValue),
@@ -2874,8 +2883,8 @@ bool CSSParser::parseValue(CSSPropertyID propId, bool important)
     case CSSPropertyPadding:
         // <padding-width>{1,4} | inherit
         return parse4Values(propId, paddingShorthand().properties(), important);
-    case CSSPropertyWebkitFlexFlow:
-        return parseShorthand(propId, webkitFlexFlowShorthand(), important);
+    case CSSPropertyFlexFlow:
+        return parseShorthand(propId, flexFlowShorthand(), important);
     case CSSPropertyFont:
         // [ [ 'font-style' || 'font-variant' || 'font-weight' ]? 'font-size' [ / 'line-height' ]?
         // 'font-family' ] | caption | icon | menu | message-box | small-caption | status-bar | inherit
@@ -3047,12 +3056,12 @@ bool CSSParser::parseValue(CSSPropertyID propId, bool important)
     case CSSPropertyWebkitColumnBreakBefore:
     case CSSPropertyWebkitColumnBreakInside:
     case CSSPropertyWebkitColumnRuleStyle:
-    case CSSPropertyWebkitAlignContent:
-    case CSSPropertyWebkitAlignItems:
-    case CSSPropertyWebkitAlignSelf:
-    case CSSPropertyWebkitFlexDirection:
-    case CSSPropertyWebkitFlexWrap:
-    case CSSPropertyWebkitJustifyContent:
+    case CSSPropertyAlignContent:
+    case CSSPropertyAlignItems:
+    case CSSPropertyAlignSelf:
+    case CSSPropertyFlexDirection:
+    case CSSPropertyFlexWrap:
+    case CSSPropertyJustifyContent:
     case CSSPropertyWebkitFontKerning:
     case CSSPropertyWebkitFontSmoothing:
     case CSSPropertyWebkitHyphens:
@@ -6598,9 +6607,9 @@ bool CSSParser::parseFlex(CSSParserValueList* args, bool important)
     if (!flexBasis)
         flexBasis = cssValuePool().createValue(0, CSSPrimitiveValue::CSS_PX);
 
-    addProperty(CSSPropertyWebkitFlexGrow, cssValuePool().createValue(clampToFloat(flexGrow), CSSPrimitiveValue::CSS_NUMBER), important);
-    addProperty(CSSPropertyWebkitFlexShrink, cssValuePool().createValue(clampToFloat(flexShrink), CSSPrimitiveValue::CSS_NUMBER), important);
-    addProperty(CSSPropertyWebkitFlexBasis, flexBasis, important);
+    addProperty(CSSPropertyFlexGrow, cssValuePool().createValue(clampToFloat(flexGrow), CSSPrimitiveValue::CSS_NUMBER), important);
+    addProperty(CSSPropertyFlexShrink, cssValuePool().createValue(clampToFloat(flexShrink), CSSPrimitiveValue::CSS_NUMBER), important);
+    addProperty(CSSPropertyFlexBasis, flexBasis, important);
     return true;
 }
 
diff --git a/Source/WebCore/css/CSSPrimitiveValue.cpp b/Source/WebCore/css/CSSPrimitiveValue.cpp
index f3902c7be..32f0121b6 100644
--- a/Source/WebCore/css/CSSPrimitiveValue.cpp
+++ b/Source/WebCore/css/CSSPrimitiveValue.cpp
@@ -52,7 +52,7 @@
 using namespace WTF;
 
 namespace WebCore {
-    
+
 // Max/min values for CSS, needs to slightly smaller/larger than the true max/min values to allow for rounding without overflowing.
 // Subtract two (rather than one) to allow for values to be converted to float and back without exceeding the LayoutUnit::max.
 const int maxValueForCssLength = INT_MAX / kFixedPointDenominator - 2;
@@ -132,46 +132,46 @@ static inline bool isValidCSSUnitTypeForDoubleConversion(CSSPrimitiveValue::Unit
     return false;
 }
 
-static CSSPrimitiveValue::UnitCategory unitCategory(CSSPrimitiveValue::UnitTypes type)
+CSSPrimitiveValue::UnitCategory CSSPrimitiveValue::unitCategory(CSSPrimitiveValue::UnitTypes type)
 {
     // Here we violate the spec (http://www.w3.org/TR/DOM-Level-2-Style/css.html#CSS-CSSPrimitiveValue) and allow conversions
     // between CSS_PX and relative lengths (see cssPixelsPerInch comment in CSSHelper.h for the topic treatment).
     switch (type) {
-    case CSSPrimitiveValue::CSS_NUMBER:
-        return CSSPrimitiveValue::UNumber;
-    case CSSPrimitiveValue::CSS_PERCENTAGE:
-        return CSSPrimitiveValue::UPercent;
-    case CSSPrimitiveValue::CSS_PX:
-    case CSSPrimitiveValue::CSS_CM:
-    case CSSPrimitiveValue::CSS_MM:
-    case CSSPrimitiveValue::CSS_IN:
-    case CSSPrimitiveValue::CSS_PT:
-    case CSSPrimitiveValue::CSS_PC:
-        return CSSPrimitiveValue::ULength;
-    case CSSPrimitiveValue::CSS_MS:
-    case CSSPrimitiveValue::CSS_S:
-        return CSSPrimitiveValue::UTime;
-    case CSSPrimitiveValue::CSS_DEG:
-    case CSSPrimitiveValue::CSS_RAD:
-    case CSSPrimitiveValue::CSS_GRAD:
-    case CSSPrimitiveValue::CSS_TURN:
-        return CSSPrimitiveValue::UAngle;
-    case CSSPrimitiveValue::CSS_HZ:
-    case CSSPrimitiveValue::CSS_KHZ:
-        return CSSPrimitiveValue::UFrequency;
-    case CSSPrimitiveValue::CSS_VW:
-    case CSSPrimitiveValue::CSS_VH:
-    case CSSPrimitiveValue::CSS_VMIN:
-    case CSSPrimitiveValue::CSS_VMAX:
-        return CSSPrimitiveValue::UViewportPercentageLength;
+    case CSS_NUMBER:
+        return UNumber;
+    case CSS_PERCENTAGE:
+        return UPercent;
+    case CSS_PX:
+    case CSS_CM:
+    case CSS_MM:
+    case CSS_IN:
+    case CSS_PT:
+    case CSS_PC:
+        return ULength;
+    case CSS_MS:
+    case CSS_S:
+        return UTime;
+    case CSS_DEG:
+    case CSS_RAD:
+    case CSS_GRAD:
+    case CSS_TURN:
+        return UAngle;
+    case CSS_HZ:
+    case CSS_KHZ:
+        return UFrequency;
+    case CSS_VW:
+    case CSS_VH:
+    case CSS_VMIN:
+    case CSS_VMAX:
+        return UViewportPercentageLength;
 #if ENABLE(CSS_IMAGE_RESOLUTION) || ENABLE(RESOLUTION_MEDIA_QUERY)
-    case CSSPrimitiveValue::CSS_DPPX:
-    case CSSPrimitiveValue::CSS_DPI:
-    case CSSPrimitiveValue::CSS_DPCM:
-        return CSSPrimitiveValue::UResolution;
+    case CSS_DPPX:
+    case CSS_DPI:
+    case CSS_DPCM:
+        return UResolution;
 #endif
     default:
-        return CSSPrimitiveValue::UOther;
+        return UOther;
     }
 }
 
@@ -182,25 +182,31 @@ static CSSTextCache& cssTextCache()
     return cache;
 }
 
-unsigned short CSSPrimitiveValue::primitiveType() const 
+unsigned short CSSPrimitiveValue::primitiveType() const
 {
     if (m_primitiveUnitType == CSS_PROPERTY_ID || m_primitiveUnitType == CSS_VALUE_ID)
         return CSS_IDENT;
 
     if (m_primitiveUnitType != CSSPrimitiveValue::CSS_CALC)
-        return m_primitiveUnitType; 
-    
+        return m_primitiveUnitType;
+
     switch (m_value.calc->category()) {
     case CalcNumber:
         return CSSPrimitiveValue::CSS_NUMBER;
-    case CalcPercent:
-        return CSSPrimitiveValue::CSS_PERCENTAGE;
     case CalcLength:
         return CSSPrimitiveValue::CSS_PX;
+    case CalcPercent:
+        return CSSPrimitiveValue::CSS_PERCENTAGE;
     case CalcPercentNumber:
         return CSSPrimitiveValue::CSS_CALC_PERCENTAGE_WITH_NUMBER;
     case CalcPercentLength:
         return CSSPrimitiveValue::CSS_CALC_PERCENTAGE_WITH_LENGTH;
+    case CalcAngle:
+        return CSSPrimitiveValue::CSS_DEG;
+    case CalcTime:
+        return CSSPrimitiveValue::CSS_MS;
+    case CalcFrequency:
+        return CSSPrimitiveValue::CSS_HZ;
 #if ENABLE(CSS_VARIABLES)
     case CalcVariable:
         return CSSPrimitiveValue::CSS_UNKNOWN; // The type of a calculation containing a variable cannot be known until the value of the variable is determined.
@@ -285,65 +291,102 @@ CSSPrimitiveValue::CSSPrimitiveValue(RGBA32 color)
 CSSPrimitiveValue::CSSPrimitiveValue(const Length& length)
     : CSSValue(PrimitiveClass)
 {
+    init(length);
+}
+
+CSSPrimitiveValue::CSSPrimitiveValue(const Length& length, const RenderStyle* style)
+    : CSSValue(PrimitiveClass)
+{
     switch (length.type()) {
-        case Auto:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueAuto;
-            break;
-        case WebCore::Fixed:
-            m_primitiveUnitType = CSS_PX;
-            m_value.num = length.value();
-            break;
-        case Intrinsic:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueIntrinsic;
-            break;
-        case MinIntrinsic:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueMinIntrinsic;
-            break;
-        case MinContent:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueWebkitMinContent;
-            break;
-        case MaxContent:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueWebkitMaxContent;
-            break;
-        case FillAvailable:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueWebkitFillAvailable;
-            break;
-        case FitContent:
-            m_primitiveUnitType = CSS_VALUE_ID;
-            m_value.valueID = CSSValueWebkitFitContent;
-            break;
-        case Percent:
-            m_primitiveUnitType = CSS_PERCENTAGE;
-            ASSERT(std::isfinite(length.percent()));
-            m_value.num = length.percent();
-            break;
-        case ViewportPercentageWidth:
-            m_primitiveUnitType = CSS_VW;
-            m_value.num = length.viewportPercentageLength();
-            break;
-        case ViewportPercentageHeight:
-            m_primitiveUnitType = CSS_VH;
-            m_value.num = length.viewportPercentageLength();
-            break;
-        case ViewportPercentageMin:
-            m_primitiveUnitType = CSS_VMIN;
-            m_value.num = length.viewportPercentageLength();
-            break;
-        case ViewportPercentageMax:
-            m_primitiveUnitType = CSS_VMAX;
-            m_value.num = length.viewportPercentageLength();
-            break;
-        case Calculated:
-        case Relative:
-        case Undefined:
-            ASSERT_NOT_REACHED();
-            break;
+    case Auto:
+    case Intrinsic:
+    case MinIntrinsic:
+    case MinContent:
+    case MaxContent:
+    case FillAvailable:
+    case FitContent:
+    case Percent:
+    case ViewportPercentageWidth:
+    case ViewportPercentageHeight:
+    case ViewportPercentageMin:
+    case ViewportPercentageMax:
+        init(length);
+        return;
+    case Fixed:
+        m_primitiveUnitType = CSS_PX;
+        m_value.num = adjustFloatForAbsoluteZoom(length.value(), style);
+        return;
+    case Calculated:
+        init(CSSCalcValue::create(length.calculationValue().get(), style));
+        return;
+    case Relative:
+    case Undefined:
+        ASSERT_NOT_REACHED();
+        break;
+    }
+}
+
+void CSSPrimitiveValue::init(const Length& length)
+{
+    switch (length.type()) {
+    case Auto:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueAuto;
+        break;
+    case WebCore::Fixed:
+        m_primitiveUnitType = CSS_PX;
+        m_value.num = length.value();
+        break;
+    case Intrinsic:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueIntrinsic;
+        break;
+    case MinIntrinsic:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueMinIntrinsic;
+        break;
+    case MinContent:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueWebkitMinContent;
+        break;
+    case MaxContent:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueWebkitMaxContent;
+        break;
+    case FillAvailable:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueWebkitFillAvailable;
+        break;
+    case FitContent:
+        m_primitiveUnitType = CSS_VALUE_ID;
+        m_value.valueID = CSSValueWebkitFitContent;
+        break;
+    case Percent:
+        m_primitiveUnitType = CSS_PERCENTAGE;
+        ASSERT(std::isfinite(length.percent()));
+        m_value.num = length.percent();
+        break;
+    case ViewportPercentageWidth:
+        m_primitiveUnitType = CSS_VW;
+        m_value.num = length.viewportPercentageLength();
+        break;
+    case ViewportPercentageHeight:
+        m_primitiveUnitType = CSS_VH;
+        m_value.num = length.viewportPercentageLength();
+        break;
+    case ViewportPercentageMin:
+        m_primitiveUnitType = CSS_VMIN;
+        m_value.num = length.viewportPercentageLength();
+        break;
+    case ViewportPercentageMax:
+        m_primitiveUnitType = CSS_VMAX;
+        m_value.num = length.viewportPercentageLength();
+        break;
+    case Calculated:
+    case Relative:
+    case Undefined:
+        ASSERT_NOT_REACHED();
+        break;
     }
 }
 
@@ -552,57 +595,63 @@ double CSSPrimitiveValue::computeLengthDouble(const RenderStyle* style, const Re
     if (m_primitiveUnitType == CSS_CALC)
         // The multiplier and factor is applied to each value in the calc expression individually
         return m_value.calc->computeLengthPx(style, rootStyle, multiplier, computingFontSize);
-        
+
     double factor;
 
     switch (primitiveType()) {
-        case CSS_EMS:
-            factor = computingFontSize ? style->fontDescription().specifiedSize() : style->fontDescription().computedSize();
-            break;
-        case CSS_EXS:
-            // FIXME: We have a bug right now where the zoom will be applied twice to EX units.
-            // We really need to compute EX using fontMetrics for the original specifiedSize and not use
-            // our actual constructed rendering font.
-            if (style->fontMetrics().hasXHeight())
-                factor = style->fontMetrics().xHeight();
-            else
-                factor = (computingFontSize ? style->fontDescription().specifiedSize() : style->fontDescription().computedSize()) / 2.0;
-            break;
-        case CSS_REMS:
-            if (rootStyle)
-                factor = computingFontSize ? rootStyle->fontDescription().specifiedSize() : rootStyle->fontDescription().computedSize();
-            else
-                factor = 1.0;
-            break;
-        case CSS_CHS:
-            factor = style->fontMetrics().zeroWidth();
-            break;
-        case CSS_PX:
+    case CSS_EMS:
+        factor = computingFontSize ? style->fontDescription().specifiedSize() : style->fontDescription().computedSize();
+        break;
+    case CSS_EXS:
+        // FIXME: We have a bug right now where the zoom will be applied twice to EX units.
+        // We really need to compute EX using fontMetrics for the original specifiedSize and not use
+        // our actual constructed rendering font.
+        if (style->fontMetrics().hasXHeight())
+            factor = style->fontMetrics().xHeight();
+        else
+            factor = (computingFontSize ? style->fontDescription().specifiedSize() : style->fontDescription().computedSize()) / 2.0;
+        break;
+    case CSS_REMS:
+        if (rootStyle)
+            factor = computingFontSize ? rootStyle->fontDescription().specifiedSize() : rootStyle->fontDescription().computedSize();
+        else
             factor = 1.0;
-            break;
-        case CSS_CM:
-            factor = cssPixelsPerInch / 2.54; // (2.54 cm/in)
-            break;
-        case CSS_MM:
-            factor = cssPixelsPerInch / 25.4;
-            break;
-        case CSS_IN:
-            factor = cssPixelsPerInch;
-            break;
-        case CSS_PT:
-            factor = cssPixelsPerInch / 72.0;
-            break;
-        case CSS_PC:
-            // 1 pc == 12 pt
-            factor = cssPixelsPerInch * 12.0 / 72.0;
-            break;
-        case CSS_CALC_PERCENTAGE_WITH_LENGTH:
-        case CSS_CALC_PERCENTAGE_WITH_NUMBER:
-            ASSERT_NOT_REACHED();
-            return -1.0;
-        default:
-            ASSERT_NOT_REACHED();
-            return -1.0;
+        break;
+    case CSS_CHS:
+        factor = style->fontMetrics().zeroWidth();
+        break;
+    case CSS_PX:
+        factor = 1.0;
+        break;
+    case CSS_CM:
+        factor = cssPixelsPerInch / 2.54; // (2.54 cm/in)
+        break;
+    case CSS_MM:
+        factor = cssPixelsPerInch / 25.4;
+        break;
+    case CSS_IN:
+        factor = cssPixelsPerInch;
+        break;
+    case CSS_PT:
+        factor = cssPixelsPerInch / 72.0;
+        break;
+    case CSS_PC:
+        // 1 pc == 12 pt
+        factor = cssPixelsPerInch * 12.0 / 72.0;
+        break;
+    case CSS_CALC_PERCENTAGE_WITH_LENGTH:
+    case CSS_CALC_PERCENTAGE_WITH_NUMBER:
+        ASSERT_NOT_REACHED();
+        return -1.0;
+    case CSS_VH:
+    case CSS_VW:
+    case CSS_VMAX:
+    case CSS_VMIN:
+        factor = 1.0;
+        break;
+    default:
+        ASSERT_NOT_REACHED();
+        return -1.0;
     }
 
     // We do not apply the zoom factor when we are computing the value of the font-size property. The zooming
@@ -623,53 +672,53 @@ void CSSPrimitiveValue::setFloatValue(unsigned short, double, ExceptionCode& ec)
     ec = NO_MODIFICATION_ALLOWED_ERR;
 }
 
-static double conversionToCanonicalUnitsScaleFactor(unsigned short unitType)
+double CSSPrimitiveValue::conversionToCanonicalUnitsScaleFactor(unsigned short unitType)
 {
     double factor = 1.0;
     // FIXME: the switch can be replaced by an array of scale factors.
     switch (unitType) {
-        // These are "canonical" units in their respective categories.
-        case CSSPrimitiveValue::CSS_PX:
-        case CSSPrimitiveValue::CSS_DEG:
-        case CSSPrimitiveValue::CSS_MS:
-        case CSSPrimitiveValue::CSS_HZ:
-            break;
-        case CSSPrimitiveValue::CSS_CM:
-            factor = cssPixelsPerInch / 2.54; // (2.54 cm/in)
-            break;
-        case CSSPrimitiveValue::CSS_DPCM:
-            factor = 2.54 / cssPixelsPerInch; // (2.54 cm/in)
-            break;
-        case CSSPrimitiveValue::CSS_MM:
-            factor = cssPixelsPerInch / 25.4;
-            break;
-        case CSSPrimitiveValue::CSS_IN:
-            factor = cssPixelsPerInch;
-            break;
-        case CSSPrimitiveValue::CSS_DPI:
-            factor = 1 / cssPixelsPerInch;
-            break;
-        case CSSPrimitiveValue::CSS_PT:
-            factor = cssPixelsPerInch / 72.0;
-            break;
-        case CSSPrimitiveValue::CSS_PC:
-            factor = cssPixelsPerInch * 12.0 / 72.0; // 1 pc == 12 pt
-            break;
-        case CSSPrimitiveValue::CSS_RAD:
-            factor = 180 / piDouble;
-            break;
-        case CSSPrimitiveValue::CSS_GRAD:
-            factor = 0.9;
-            break;
-        case CSSPrimitiveValue::CSS_TURN:
-            factor = 360;
-            break;
-        case CSSPrimitiveValue::CSS_S:
-        case CSSPrimitiveValue::CSS_KHZ:
-            factor = 1000;
-            break;
-        default:
-            break;
+    // These are "canonical" units in their respective categories.
+    case CSS_PX:
+    case CSS_DEG:
+    case CSS_MS:
+    case CSS_HZ:
+        break;
+    case CSS_CM:
+        factor = cssPixelsPerInch / 2.54; // (2.54 cm/in)
+        break;
+    case CSS_DPCM:
+        factor = 2.54 / cssPixelsPerInch; // (2.54 cm/in)
+        break;
+    case CSS_MM:
+        factor = cssPixelsPerInch / 25.4;
+        break;
+    case CSS_IN:
+        factor = cssPixelsPerInch;
+        break;
+    case CSS_DPI:
+        factor = 1 / cssPixelsPerInch;
+        break;
+    case CSS_PT:
+        factor = cssPixelsPerInch / 72.0;
+        break;
+    case CSS_PC:
+        factor = cssPixelsPerInch * 12.0 / 72.0; // 1 pc == 12 pt
+        break;
+    case CSS_RAD:
+        factor = 180 / piDouble;
+        break;
+    case CSS_GRAD:
+        factor = 0.9;
+        break;
+    case CSS_TURN:
+        factor = 360;
+        break;
+    case CSS_S:
+    case CSS_KHZ:
+        factor = 1000;
+        break;
+    default:
+        break;
     }
 
     return factor;
@@ -696,7 +745,7 @@ double CSSPrimitiveValue::getDoubleValue(unsigned short unitType) const
 }
 
 double CSSPrimitiveValue::getDoubleValue() const
-{ 
+{
     return m_primitiveUnitType != CSS_CALC ? m_value.num : m_value.calc->doubleValue();
 }
 
@@ -790,20 +839,20 @@ String CSSPrimitiveValue::getStringValue(ExceptionCode& ec) const
 {
     ec = 0;
     switch (m_primitiveUnitType) {
-        case CSS_STRING:
-        case CSS_ATTR:
-        case CSS_URI:
+    case CSS_STRING:
+    case CSS_ATTR:
+    case CSS_URI:
 #if ENABLE(CSS_VARIABLES)
-        case CSS_VARIABLE_NAME:
+    case CSS_VARIABLE_NAME:
 #endif
-            return m_value.string;
-        case CSS_VALUE_ID:
-            return valueName(m_value.valueID);
-        case CSS_PROPERTY_ID:
-            return propertyName(m_value.propertyID);
-        default:
-            ec = INVALID_ACCESS_ERR;
-            break;
+        return m_value.string;
+    case CSS_VALUE_ID:
+        return valueName(m_value.valueID);
+    case CSS_PROPERTY_ID:
+        return propertyName(m_value.propertyID);
+    default:
+        ec = INVALID_ACCESS_ERR;
+        break;
     }
 
     return String();
@@ -812,19 +861,19 @@ String CSSPrimitiveValue::getStringValue(ExceptionCode& ec) const
 String CSSPrimitiveValue::getStringValue() const
 {
     switch (m_primitiveUnitType) {
-        case CSS_STRING:
-        case CSS_ATTR:
-        case CSS_URI:
+    case CSS_STRING:
+    case CSS_ATTR:
+    case CSS_URI:
 #if ENABLE(CSS_VARIABLES)
-        case CSS_VARIABLE_NAME:
+    case CSS_VARIABLE_NAME:
 #endif
-            return m_value.string;
-        case CSS_VALUE_ID:
-            return valueName(m_value.valueID);
-        case CSS_PROPERTY_ID:
-            return propertyName(m_value.propertyID);
-        default:
-            break;
+        return m_value.string;
+    case CSS_VALUE_ID:
+        return valueName(m_value.valueID);
+    case CSS_PROPERTY_ID:
+        return propertyName(m_value.propertyID);
+    default:
+        break;
     }
 
     return String();
diff --git a/Source/WebCore/css/CSSPrimitiveValue.h b/Source/WebCore/css/CSSPrimitiveValue.h
index 28ae4e882..9ccb1eeb3 100644
--- a/Source/WebCore/css/CSSPrimitiveValue.h
+++ b/Source/WebCore/css/CSSPrimitiveValue.h
@@ -154,6 +154,7 @@ public:
 #endif
         UOther
     };
+    static UnitCategory unitCategory(CSSPrimitiveValue::UnitTypes);
 
     bool isAngle() const
     {
@@ -202,8 +203,12 @@ public:
     bool isVariableName() const { return primitiveType() == CSS_VARIABLE_NAME; }
 #endif
     bool isViewportPercentageLength() const { return m_primitiveUnitType >= CSS_VW && m_primitiveUnitType <= CSS_VMAX; }
+    bool isViewportPercentageWidth() const { return m_primitiveUnitType == CSS_VW; }
+    bool isViewportPercentageHeight() const { return m_primitiveUnitType == CSS_VH; }
+    bool isViewportPercentageMax() const { return m_primitiveUnitType == CSS_VMAX; }
+    bool isViewportPercentageMin() const { return m_primitiveUnitType == CSS_VMIN; }
     bool isValueID() const { return m_primitiveUnitType == CSS_VALUE_ID; }
-    
+
     static PassRefPtr<CSSPrimitiveValue> createIdentifier(CSSValueID valueID) { return adoptRef(new CSSPrimitiveValue(valueID)); }
     static PassRefPtr<CSSPrimitiveValue> createIdentifier(CSSPropertyID propertyID) { return adoptRef(new CSSPrimitiveValue(propertyID)); }
     static PassRefPtr<CSSPrimitiveValue> createParserOperator(int parserOperator) { return adoptRef(new CSSPrimitiveValue(parserOperator)); }
@@ -211,6 +216,7 @@ public:
     static PassRefPtr<CSSPrimitiveValue> createColor(unsigned rgbValue) { return adoptRef(new CSSPrimitiveValue(rgbValue)); }
     static PassRefPtr<CSSPrimitiveValue> create(double value, UnitTypes type) { return adoptRef(new CSSPrimitiveValue(value, type)); }
     static PassRefPtr<CSSPrimitiveValue> create(const String& value, UnitTypes type) { return adoptRef(new CSSPrimitiveValue(value, type)); }
+    static PassRefPtr<CSSPrimitiveValue> create(const Length& value, const RenderStyle* style) { return adoptRef(new CSSPrimitiveValue(value, style)); }
 
     template<typename T> static PassRefPtr<CSSPrimitiveValue> create(T value)
     {
@@ -310,7 +316,7 @@ public:
 #endif
 
     CSSBasicShape* getShapeValue() const { return m_primitiveUnitType != CSS_SHAPE ? 0 : m_value.shape; }
-    
+
     CSSCalcValue* cssCalcValue() const { return m_primitiveUnitType != CSS_CALC ? 0 : m_value.calc; }
 
     CSSPropertyID getPropertyID() const { return m_primitiveUnitType == CSS_PROPERTY_ID ? m_value.propertyID : CSSPropertyInvalid; }
@@ -329,12 +335,15 @@ public:
     void addSubresourceStyleURLs(ListHashSet<KURL>&, const StyleSheetContents*) const;
 
     Length viewportPercentageLength() const;
-    
+
     PassRefPtr<CSSPrimitiveValue> cloneForCSSOM() const;
     void setCSSOMSafe() { m_isCSSOMSafe = true; }
 
     bool equals(const CSSPrimitiveValue&) const;
 
+    static UnitTypes canonicalUnitTypeForCategory(UnitCategory);
+    static double conversionToCanonicalUnitsScaleFactor(unsigned short unitType);
+
 private:
     CSSPrimitiveValue(CSSValueID);
     CSSPrimitiveValue(CSSPropertyID);
@@ -342,6 +351,7 @@ private:
     CSSPrimitiveValue(int parserOperator);
     CSSPrimitiveValue(unsigned color); // RGB value
     CSSPrimitiveValue(const Length&);
+    CSSPrimitiveValue(const Length&, const RenderStyle*);
     CSSPrimitiveValue(const String&, UnitTypes);
     CSSPrimitiveValue(double, UnitTypes);
 
@@ -362,8 +372,7 @@ private:
     static void create(unsigned); // compile-time guard
     template<typename T> operator T*(); // compile-time guard
 
-    static UnitTypes canonicalUnitTypeForCategory(UnitCategory category);
-
+    void init(const Length&);
     void init(PassRefPtr<Counter>);
     void init(PassRefPtr<Rect>);
     void init(PassRefPtr<Pair>);
@@ -392,6 +401,18 @@ private:
     } m_value;
 };
 
+inline CSSPrimitiveValue* toCSSPrimitiveValue(CSSValue* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->isPrimitiveValue());
+    return static_cast<CSSPrimitiveValue*>(value);
+}
+
+inline const CSSPrimitiveValue* toCSSPrimitiveValue(const CSSValue* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->isPrimitiveValue());
+    return static_cast<const CSSPrimitiveValue*>(value);
+}
+
 } // namespace WebCore
 
 #endif // CSSPrimitiveValue_h
diff --git a/Source/WebCore/css/CSSPrimitiveValueMappings.h b/Source/WebCore/css/CSSPrimitiveValueMappings.h
index b331504d7..c6273d7e7 100644
--- a/Source/WebCore/css/CSSPrimitiveValueMappings.h
+++ b/Source/WebCore/css/CSSPrimitiveValueMappings.h
@@ -1289,10 +1289,12 @@ template<> inline CSSPrimitiveValue::CSSPrimitiveValue(EDisplay e)
         m_value.valueID = CSSValueWebkitInlineBox;
         break;
     case FLEX:
-        m_value.valueID = CSSValueWebkitFlex;
+    case WEBKIT_FLEX:
+        m_value.valueID = CSSValueFlex;
         break;
     case INLINE_FLEX:
-        m_value.valueID = CSSValueWebkitInlineFlex;
+    case WEBKIT_INLINE_FLEX:
+        m_value.valueID = CSSValueInlineFlex;
         break;
     case GRID:
         m_value.valueID = CSSValueWebkitGrid;
@@ -1313,6 +1315,10 @@ template<> inline CSSPrimitiveValue::operator EDisplay() const
 
     EDisplay display = static_cast<EDisplay>(m_value.valueID - CSSValueInline);
     ASSERT(display >= INLINE && display <= NONE);
+    if (display == WEBKIT_FLEX)
+        return FLEX;
+    if (display == WEBKIT_INLINE_FLEX)
+        return INLINE_FLEX;
     return display;
 }
 
diff --git a/Source/WebCore/css/CSSProperty.cpp b/Source/WebCore/css/CSSProperty.cpp
index 13a4d7e7f..63a4edfb7 100644
--- a/Source/WebCore/css/CSSProperty.cpp
+++ b/Source/WebCore/css/CSSProperty.cpp
@@ -573,18 +573,18 @@ bool CSSProperty::isInheritedProperty(CSSPropertyID propertyID)
 #if ENABLE(CSS_COMPOSITING)
     case CSSPropertyWebkitBlendMode:
 #endif
-    case CSSPropertyWebkitAlignContent:
-    case CSSPropertyWebkitAlignItems:
-    case CSSPropertyWebkitAlignSelf:
-    case CSSPropertyWebkitFlex:
-    case CSSPropertyWebkitFlexBasis:
-    case CSSPropertyWebkitFlexDirection:
-    case CSSPropertyWebkitFlexFlow:
-    case CSSPropertyWebkitFlexGrow:
-    case CSSPropertyWebkitFlexShrink:
-    case CSSPropertyWebkitFlexWrap:
-    case CSSPropertyWebkitJustifyContent:
-    case CSSPropertyWebkitOrder:
+    case CSSPropertyAlignContent:
+    case CSSPropertyAlignItems:
+    case CSSPropertyAlignSelf:
+    case CSSPropertyFlex:
+    case CSSPropertyFlexBasis:
+    case CSSPropertyFlexDirection:
+    case CSSPropertyFlexFlow:
+    case CSSPropertyFlexGrow:
+    case CSSPropertyFlexShrink:
+    case CSSPropertyFlexWrap:
+    case CSSPropertyJustifyContent:
+    case CSSPropertyOrder:
     case CSSPropertyWebkitFontSizeDelta:
     case CSSPropertyWebkitGridAutoColumns:
     case CSSPropertyWebkitGridAutoFlow:
diff --git a/Source/WebCore/css/CSSPropertyNames.in b/Source/WebCore/css/CSSPropertyNames.in
index 358ee2cbb..bc6f7066b 100644
--- a/Source/WebCore/css/CSSPropertyNames.in
+++ b/Source/WebCore/css/CSSPropertyNames.in
@@ -287,17 +287,28 @@ z-index
 #if defined(ENABLE_CSS_FILTERS) && ENABLE_CSS_FILTERS
 -webkit-filter
 #endif
--webkit-align-content
--webkit-align-items
--webkit-align-self
--webkit-flex
--webkit-flex-basis
--webkit-flex-direction
--webkit-flex-flow
--webkit-flex-grow
--webkit-flex-shrink
--webkit-flex-wrap
--webkit-justify-content
+align-content
+-webkit-align-content = align-content
+align-items
+-webkit-align-items = align-items
+align-self
+-webkit-align-self = align-self
+flex
+-webkit-flex = flex
+flex-basis
+-webkit-flex-basis = flex-basis
+flex-direction
+-webkit-flex-direction = flex-direction
+flex-flow
+-webkit-flex-flow = flex-flow
+flex-grow
+-webkit-flex-grow = flex-grow
+flex-shrink
+-webkit-flex-shrink = flex-shrink
+flex-wrap
+-webkit-flex-wrap = flex-wrap
+justify-content
+-webkit-justify-content = justify-content
 -webkit-font-size-delta
 -webkit-grid-auto-columns
 -webkit-grid-auto-rows
@@ -363,7 +374,8 @@ z-index
 -webkit-min-logical-width
 -webkit-min-logical-height
 -webkit-nbsp-mode
--webkit-order
+order
+-webkit-order = order
 -webkit-padding-after
 -webkit-padding-before
 -webkit-padding-end
diff --git a/Source/WebCore/css/CSSValueKeywords.in b/Source/WebCore/css/CSSValueKeywords.in
index 679e736bf..dc7b34c26 100644
--- a/Source/WebCore/css/CSSValueKeywords.in
+++ b/Source/WebCore/css/CSSValueKeywords.in
@@ -341,7 +341,9 @@ table-cell
 table-caption
 -webkit-box
 -webkit-inline-box
+flex
 -webkit-flex
+inline-flex
 -webkit-inline-flex
 -webkit-grid
 -webkit-inline-grid
diff --git a/Source/WebCore/css/CSSValuePool.h b/Source/WebCore/css/CSSValuePool.h
index 421d74d6e..e2ceb6e4c 100644
--- a/Source/WebCore/css/CSSValuePool.h
+++ b/Source/WebCore/css/CSSValuePool.h
@@ -31,9 +31,9 @@
 #include "CSSPrimitiveValue.h"
 #include "CSSPropertyNames.h"
 #include "CSSValueKeywords.h"
-#include <wtf/text/AtomicStringHash.h>
 #include <wtf/HashMap.h>
 #include <wtf/RefPtr.h>
+#include <wtf/text/AtomicStringHash.h>
 
 namespace WebCore {
 
@@ -52,6 +52,7 @@ public:
     PassRefPtr<CSSPrimitiveValue> createColorValue(unsigned rgbValue);
     PassRefPtr<CSSPrimitiveValue> createValue(double value, CSSPrimitiveValue::UnitTypes);
     PassRefPtr<CSSPrimitiveValue> createValue(const String& value, CSSPrimitiveValue::UnitTypes type) { return CSSPrimitiveValue::create(value, type); }
+    PassRefPtr<CSSPrimitiveValue> createValue(const Length& value, const RenderStyle* style) { return CSSPrimitiveValue::create(value, style); }
     template<typename T> static PassRefPtr<CSSPrimitiveValue> createValue(T value) { return CSSPrimitiveValue::create(value); }
 
     void drain();
diff --git a/Source/WebCore/css/DeprecatedStyleBuilder.cpp b/Source/WebCore/css/DeprecatedStyleBuilder.cpp
index 68bb3bcb7..66c5036d1 100644
--- a/Source/WebCore/css/DeprecatedStyleBuilder.cpp
+++ b/Source/WebCore/css/DeprecatedStyleBuilder.cpp
@@ -31,6 +31,7 @@
 #include "CSSAspectRatioValue.h"
 #include "CSSCalculationValue.h"
 #include "CSSCursorImageValue.h"
+#include "CSSPrimitiveValue.h"
 #include "CSSPrimitiveValueMappings.h"
 #include "CSSToStyleMap.h"
 #include "CSSValueList.h"
@@ -612,7 +613,18 @@ public:
                 if (originalLength >= 1.0)
                     length = 1.0;
             }
-
+            if (primitiveValue->isViewportPercentageLength()) { 
+                int viewPortHeight = styleResolver->document()->renderView()->viewportSize().height() * length / 100.0f;
+                int viewPortWidth = styleResolver->document()->renderView()->viewportSize().width() * length / 100.0f;
+                if (primitiveValue->isViewportPercentageHeight())
+                    length = viewPortHeight;
+                else if (primitiveValue->isViewportPercentageWidth())
+                    length = viewPortWidth;
+                else if (primitiveValue->isViewportPercentageMax())
+                    length = max(viewPortWidth, viewPortHeight);
+                else if (primitiveValue->isViewportPercentageMin())
+                    length = min(viewPortWidth, viewPortHeight);
+            }
         } else {
             ASSERT_NOT_REACHED();
             length = 0;
@@ -2257,17 +2269,17 @@ DeprecatedStyleBuilder::DeprecatedStyleBuilder()
 #if ENABLE(CURSOR_VISIBILITY)
     setPropertyHandler(CSSPropertyWebkitCursorVisibility, ApplyPropertyDefault<CursorVisibility, &RenderStyle::cursorVisibility, CursorVisibility, &RenderStyle::setCursorVisibility, CursorVisibility, &RenderStyle::initialCursorVisibility>::createHandler());
 #endif
-    setPropertyHandler(CSSPropertyWebkitAlignContent, ApplyPropertyDefault<EAlignContent, &RenderStyle::alignContent, EAlignContent, &RenderStyle::setAlignContent, EAlignContent, &RenderStyle::initialAlignContent>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitAlignItems, ApplyPropertyDefault<EAlignItems, &RenderStyle::alignItems, EAlignItems, &RenderStyle::setAlignItems, EAlignItems, &RenderStyle::initialAlignItems>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitAlignSelf, ApplyPropertyDefault<EAlignItems, &RenderStyle::alignSelf, EAlignItems, &RenderStyle::setAlignSelf, EAlignItems, &RenderStyle::initialAlignSelf>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitFlexBasis, ApplyPropertyLength<&RenderStyle::flexBasis, &RenderStyle::setFlexBasis, &RenderStyle::initialFlexBasis, AutoEnabled>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitFlexDirection, ApplyPropertyDefault<EFlexDirection, &RenderStyle::flexDirection, EFlexDirection, &RenderStyle::setFlexDirection, EFlexDirection, &RenderStyle::initialFlexDirection>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitFlexGrow, ApplyPropertyDefault<float, &RenderStyle::flexGrow, float, &RenderStyle::setFlexGrow, float, &RenderStyle::initialFlexGrow>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitFlexShrink, ApplyPropertyDefault<float, &RenderStyle::flexShrink, float, &RenderStyle::setFlexShrink, float, &RenderStyle::initialFlexShrink>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitFlexWrap, ApplyPropertyDefault<EFlexWrap, &RenderStyle::flexWrap, EFlexWrap, &RenderStyle::setFlexWrap, EFlexWrap, &RenderStyle::initialFlexWrap>::createHandler());
+    setPropertyHandler(CSSPropertyAlignContent, ApplyPropertyDefault<EAlignContent, &RenderStyle::alignContent, EAlignContent, &RenderStyle::setAlignContent, EAlignContent, &RenderStyle::initialAlignContent>::createHandler());
+    setPropertyHandler(CSSPropertyAlignItems, ApplyPropertyDefault<EAlignItems, &RenderStyle::alignItems, EAlignItems, &RenderStyle::setAlignItems, EAlignItems, &RenderStyle::initialAlignItems>::createHandler());
+    setPropertyHandler(CSSPropertyAlignSelf, ApplyPropertyDefault<EAlignItems, &RenderStyle::alignSelf, EAlignItems, &RenderStyle::setAlignSelf, EAlignItems, &RenderStyle::initialAlignSelf>::createHandler());
+    setPropertyHandler(CSSPropertyFlexBasis, ApplyPropertyLength<&RenderStyle::flexBasis, &RenderStyle::setFlexBasis, &RenderStyle::initialFlexBasis, AutoEnabled>::createHandler());
+    setPropertyHandler(CSSPropertyFlexDirection, ApplyPropertyDefault<EFlexDirection, &RenderStyle::flexDirection, EFlexDirection, &RenderStyle::setFlexDirection, EFlexDirection, &RenderStyle::initialFlexDirection>::createHandler());
+    setPropertyHandler(CSSPropertyFlexGrow, ApplyPropertyDefault<float, &RenderStyle::flexGrow, float, &RenderStyle::setFlexGrow, float, &RenderStyle::initialFlexGrow>::createHandler());
+    setPropertyHandler(CSSPropertyFlexShrink, ApplyPropertyDefault<float, &RenderStyle::flexShrink, float, &RenderStyle::setFlexShrink, float, &RenderStyle::initialFlexShrink>::createHandler());
+    setPropertyHandler(CSSPropertyFlexWrap, ApplyPropertyDefault<EFlexWrap, &RenderStyle::flexWrap, EFlexWrap, &RenderStyle::setFlexWrap, EFlexWrap, &RenderStyle::initialFlexWrap>::createHandler());
     setPropertyHandler(CSSPropertyWebkitGridAutoFlow, ApplyPropertyDefault<GridAutoFlow, &RenderStyle::gridAutoFlow, GridAutoFlow, &RenderStyle::setGridAutoFlow, GridAutoFlow, &RenderStyle::initialGridAutoFlow>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitJustifyContent, ApplyPropertyDefault<EJustifyContent, &RenderStyle::justifyContent, EJustifyContent, &RenderStyle::setJustifyContent, EJustifyContent, &RenderStyle::initialJustifyContent>::createHandler());
-    setPropertyHandler(CSSPropertyWebkitOrder, ApplyPropertyDefault<int, &RenderStyle::order, int, &RenderStyle::setOrder, int, &RenderStyle::initialOrder>::createHandler());
+    setPropertyHandler(CSSPropertyJustifyContent, ApplyPropertyDefault<EJustifyContent, &RenderStyle::justifyContent, EJustifyContent, &RenderStyle::setJustifyContent, EJustifyContent, &RenderStyle::initialJustifyContent>::createHandler());
+    setPropertyHandler(CSSPropertyOrder, ApplyPropertyDefault<int, &RenderStyle::order, int, &RenderStyle::setOrder, int, &RenderStyle::initialOrder>::createHandler());
 #if ENABLE(CSS_REGIONS)
     setPropertyHandler(CSSPropertyWebkitFlowFrom, ApplyPropertyString<MapNoneToNull, &RenderStyle::regionThread, &RenderStyle::setRegionThread, &RenderStyle::initialRegionThread>::createHandler());
     setPropertyHandler(CSSPropertyWebkitFlowInto, ApplyPropertyString<MapNoneToNull, &RenderStyle::flowThread, &RenderStyle::setFlowThread, &RenderStyle::initialFlowThread>::createHandler());
diff --git a/Source/WebCore/css/StylePropertySet.cpp b/Source/WebCore/css/StylePropertySet.cpp
index 75785bc04..a7e3555f8 100644
--- a/Source/WebCore/css/StylePropertySet.cpp
+++ b/Source/WebCore/css/StylePropertySet.cpp
@@ -160,10 +160,10 @@ String StylePropertySet::getPropertyValue(CSSPropertyID propertyID) const
         return getShorthandValue(webkitColumnRuleShorthand());
     case CSSPropertyWebkitColumns:
         return getShorthandValue(webkitColumnsShorthand());
-    case CSSPropertyWebkitFlex:
-        return getShorthandValue(webkitFlexShorthand());
-    case CSSPropertyWebkitFlexFlow:
-        return getShorthandValue(webkitFlexFlowShorthand());
+    case CSSPropertyFlex:
+        return getShorthandValue(flexShorthand());
+    case CSSPropertyFlexFlow:
+        return getShorthandValue(flexFlowShorthand());
     case CSSPropertyWebkitGridColumn:
         return getShorthandValue(webkitGridColumnShorthand());
     case CSSPropertyWebkitGridRow:
@@ -886,14 +886,14 @@ String StylePropertySet::asText() const
         case CSSPropertyWebkitAnimationFillMode:
             shorthandPropertyID = CSSPropertyWebkitAnimation;
             break;
-        case CSSPropertyWebkitFlexDirection:
-        case CSSPropertyWebkitFlexWrap:
-            shorthandPropertyID = CSSPropertyWebkitFlexFlow;
+        case CSSPropertyFlexDirection:
+        case CSSPropertyFlexWrap:
+            shorthandPropertyID = CSSPropertyFlexFlow;
             break;
-        case CSSPropertyWebkitFlexBasis:
-        case CSSPropertyWebkitFlexGrow:
-        case CSSPropertyWebkitFlexShrink:
-            shorthandPropertyID = CSSPropertyWebkitFlex;
+        case CSSPropertyFlexBasis:
+        case CSSPropertyFlexGrow:
+        case CSSPropertyFlexShrink:
+            shorthandPropertyID = CSSPropertyFlex;
             break;
         case CSSPropertyWebkitMaskPositionX:
         case CSSPropertyWebkitMaskPositionY:
diff --git a/Source/WebCore/css/StylePropertyShorthand.cpp b/Source/WebCore/css/StylePropertyShorthand.cpp
index ca4e8b2fa..be3001bf7 100644
--- a/Source/WebCore/css/StylePropertyShorthand.cpp
+++ b/Source/WebCore/css/StylePropertyShorthand.cpp
@@ -344,18 +344,18 @@ const StylePropertyShorthand& webkitColumnRuleShorthand()
     return webkitColumnRuleLonghands;
 }
 
-const StylePropertyShorthand& webkitFlexFlowShorthand()
+const StylePropertyShorthand& flexFlowShorthand()
 {
-    static const CSSPropertyID flexFlowProperties[] = { CSSPropertyWebkitFlexDirection, CSSPropertyWebkitFlexWrap };
-    DEFINE_STATIC_LOCAL(StylePropertyShorthand, webkitFlexFlowLonghands, (flexFlowProperties, WTF_ARRAY_LENGTH(flexFlowProperties)));
-    return webkitFlexFlowLonghands;
+    static const CSSPropertyID flexFlowProperties[] = { CSSPropertyFlexDirection, CSSPropertyFlexWrap };
+    DEFINE_STATIC_LOCAL(StylePropertyShorthand, flexFlowLonghands, (flexFlowProperties, WTF_ARRAY_LENGTH(flexFlowProperties)));
+    return flexFlowLonghands;
 }
 
-const StylePropertyShorthand& webkitFlexShorthand()
+const StylePropertyShorthand& flexShorthand()
 {
-    static const CSSPropertyID flexProperties[] = { CSSPropertyWebkitFlexGrow, CSSPropertyWebkitFlexShrink, CSSPropertyWebkitFlexBasis };
-    DEFINE_STATIC_LOCAL(StylePropertyShorthand, webkitFlexLonghands, (flexProperties, WTF_ARRAY_LENGTH(flexProperties)));
-    return webkitFlexLonghands;
+    static const CSSPropertyID flexProperties[] = { CSSPropertyFlexGrow, CSSPropertyFlexShrink, CSSPropertyFlexBasis };
+    DEFINE_STATIC_LOCAL(StylePropertyShorthand, flexLonghands, (flexProperties, WTF_ARRAY_LENGTH(flexProperties)));
+    return flexLonghands;
 }
 
 const StylePropertyShorthand& webkitMarginCollapseShorthand()
@@ -532,10 +532,10 @@ const StylePropertyShorthand& shorthandForProperty(CSSPropertyID propertyID)
         return webkitColumnsShorthand();
     case CSSPropertyWebkitColumnRule:
         return webkitColumnRuleShorthand();
-    case CSSPropertyWebkitFlex:
-        return webkitFlexShorthand();
-    case CSSPropertyWebkitFlexFlow:
-        return webkitFlexFlowShorthand();
+    case CSSPropertyFlex:
+        return flexShorthand();
+    case CSSPropertyFlexFlow:
+        return flexFlowShorthand();
     case CSSPropertyWebkitGridColumn:
         return webkitGridColumnShorthand();
     case CSSPropertyWebkitGridRow:
diff --git a/Source/WebCore/css/StylePropertyShorthand.h b/Source/WebCore/css/StylePropertyShorthand.h
index 2ae93563a..bcf0f03ec 100644
--- a/Source/WebCore/css/StylePropertyShorthand.h
+++ b/Source/WebCore/css/StylePropertyShorthand.h
@@ -75,6 +75,8 @@ const StylePropertyShorthand& borderStyleShorthand();
 const StylePropertyShorthand& borderTopShorthand();
 const StylePropertyShorthand& borderWidthShorthand();
 const StylePropertyShorthand& listStyleShorthand();
+const StylePropertyShorthand& flexFlowShorthand();
+const StylePropertyShorthand& flexShorthand();
 const StylePropertyShorthand& fontShorthand();
 const StylePropertyShorthand& marginShorthand();
 const StylePropertyShorthand& outlineShorthand();
@@ -89,8 +91,6 @@ const StylePropertyShorthand& webkitBorderEndShorthand();
 const StylePropertyShorthand& webkitBorderStartShorthand();
 const StylePropertyShorthand& webkitColumnsShorthand();
 const StylePropertyShorthand& webkitColumnRuleShorthand();
-const StylePropertyShorthand& webkitFlexFlowShorthand();
-const StylePropertyShorthand& webkitFlexShorthand();
 const StylePropertyShorthand& webkitGridColumnShorthand();
 const StylePropertyShorthand& webkitGridRowShorthand();
 const StylePropertyShorthand& webkitMarginCollapseShorthand();
diff --git a/Source/WebCore/css/StyleResolver.cpp b/Source/WebCore/css/StyleResolver.cpp
index 2a09d30ba..b3f0cd5b1 100644
--- a/Source/WebCore/css/StyleResolver.cpp
+++ b/Source/WebCore/css/StyleResolver.cpp
@@ -1260,6 +1260,7 @@ static EDisplay equivalentBlockDisplay(EDisplay display, bool isFloating, bool s
     case TABLE:
     case BOX:
     case FLEX:
+    case WEBKIT_FLEX:
     case GRID:
         return display;
 
@@ -1273,6 +1274,7 @@ static EDisplay equivalentBlockDisplay(EDisplay display, bool isFloating, bool s
     case INLINE_BOX:
         return BOX;
     case INLINE_FLEX:
+    case WEBKIT_INLINE_FLEX:
         return FLEX;
     case INLINE_GRID:
         return GRID;
@@ -2439,8 +2441,8 @@ void StyleResolver::applyProperty(CSSPropertyID id, CSSValue* value)
     case CSSPropertyWebkitBorderRadius:
     case CSSPropertyWebkitColumns:
     case CSSPropertyWebkitColumnRule:
-    case CSSPropertyWebkitFlex:
-    case CSSPropertyWebkitFlexFlow:
+    case CSSPropertyFlex:
+    case CSSPropertyFlexFlow:
     case CSSPropertyWebkitGridColumn:
     case CSSPropertyWebkitGridRow:
     case CSSPropertyWebkitMarginCollapse:
@@ -3012,16 +3014,16 @@ void StyleResolver::applyProperty(CSSPropertyID id, CSSValue* value)
 #if ENABLE(CURSOR_VISIBILITY)
     case CSSPropertyWebkitCursorVisibility:
 #endif
-    case CSSPropertyWebkitAlignContent:
-    case CSSPropertyWebkitAlignItems:
-    case CSSPropertyWebkitAlignSelf:
-    case CSSPropertyWebkitFlexBasis:
-    case CSSPropertyWebkitFlexDirection:
-    case CSSPropertyWebkitFlexGrow:
-    case CSSPropertyWebkitFlexShrink:
-    case CSSPropertyWebkitFlexWrap:
-    case CSSPropertyWebkitJustifyContent:
-    case CSSPropertyWebkitOrder:
+    case CSSPropertyAlignContent:
+    case CSSPropertyAlignItems:
+    case CSSPropertyAlignSelf:
+    case CSSPropertyFlexBasis:
+    case CSSPropertyFlexDirection:
+    case CSSPropertyFlexGrow:
+    case CSSPropertyFlexShrink:
+    case CSSPropertyFlexWrap:
+    case CSSPropertyJustifyContent:
+    case CSSPropertyOrder:
 #if ENABLE(CSS_REGIONS)
     case CSSPropertyWebkitFlowFrom:
     case CSSPropertyWebkitFlowInto:
diff --git a/Source/WebCore/page/animation/CSSPropertyAnimation.cpp b/Source/WebCore/page/animation/CSSPropertyAnimation.cpp
index a3d8ef8c8..197490195 100644
--- a/Source/WebCore/page/animation/CSSPropertyAnimation.cpp
+++ b/Source/WebCore/page/animation/CSSPropertyAnimation.cpp
@@ -927,7 +927,8 @@ private:
 
 class PropertyWrapperFlex : public AnimationPropertyWrapperBase {
 public:
-    PropertyWrapperFlex() : AnimationPropertyWrapperBase(CSSPropertyWebkitFlex)
+    PropertyWrapperFlex()
+        : AnimationPropertyWrapperBase(CSSPropertyFlex)
     {
     }
 
diff --git a/Source/WebCore/platform/CalculationValue.h b/Source/WebCore/platform/CalculationValue.h
index 72543ff60..3dcbf1b78 100644
--- a/Source/WebCore/platform/CalculationValue.h
+++ b/Source/WebCore/platform/CalculationValue.h
@@ -59,7 +59,7 @@ enum CalcExpressionNodeType {
     CalcExpressionNodeBinaryOperation,
     CalcExpressionNodeBlendLength,
 };
-        
+
 class CalcExpressionNode {
     WTF_MAKE_FAST_ALLOCATED;
 public:
@@ -67,37 +67,40 @@ public:
         : m_type(CalcExpressionNodeUndefined)
     {
     }
-    
+
     virtual ~CalcExpressionNode()
     {
     }
-    
+
     virtual float evaluate(float maxValue) const = 0;
     virtual bool operator==(const CalcExpressionNode&) const = 0;
 
     CalcExpressionNodeType type() const { return m_type; }
-    
+
 protected:
     CalcExpressionNodeType m_type;
 };
-    
+
 class CalculationValue : public RefCounted<CalculationValue> {
 public:
     static PassRefPtr<CalculationValue> create(PassOwnPtr<CalcExpressionNode> value, CalculationPermittedValueRange);
     float evaluate(float maxValue) const;
 
-    bool operator==(const CalculationValue& o) const 
-    { 
+    bool operator==(const CalculationValue& o) const
+    {
         return *(m_value.get()) == *(o.m_value.get());
     }
-    
+
+    bool isNonNegative() const { return m_isNonNegative; }
+    const CalcExpressionNode* expression() const { return m_value.get(); }
+
 private:
     CalculationValue(PassOwnPtr<CalcExpressionNode> value, CalculationPermittedValueRange range)
         : m_value(value)
         , m_isNonNegative(range == CalculationRangeNonNegative)
     {
     }
-    
+
     OwnPtr<CalcExpressionNode> m_value;
     bool m_isNonNegative;
 };
@@ -115,20 +118,28 @@ public:
         return m_value == o.m_value;
     }
 
-    virtual bool operator==(const CalcExpressionNode& o) const
+    virtual bool operator==(const CalcExpressionNode& o) const OVERRIDE
     {
         return type() == o.type() && *this == static_cast<const CalcExpressionNumber&>(o);
     }
-    
-    virtual float evaluate(float) const 
+
+    virtual float evaluate(float) const OVERRIDE
     {
         return m_value;
     }
-    
+
+    float value() const { return m_value; }
+
 private:
     float m_value;
 };
 
+inline const CalcExpressionNumber* toCalcExpressionNumber(const CalcExpressionNode* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->type() == CalcExpressionNodeNumber);
+    return static_cast<const CalcExpressionNumber*>(value);
+}
+
 class CalcExpressionLength : public CalcExpressionNode {
 public:
     explicit CalcExpressionLength(Length length)
@@ -141,21 +152,29 @@ public:
     {
         return m_length == o.m_length;
     }
-    
-    virtual bool operator==(const CalcExpressionNode& o) const
+
+    virtual bool operator==(const CalcExpressionNode& o) const OVERRIDE
     {
         return type() == o.type() && *this == static_cast<const CalcExpressionLength&>(o);
     }
-    
-    virtual float evaluate(float maxValue) const
+
+    virtual float evaluate(float maxValue) const OVERRIDE
     {
         return floatValueForLength(m_length, maxValue);
     }
-    
+
+    const Length& length() const { return m_length; }
+
 private:
     Length m_length;
 };
 
+inline const CalcExpressionLength* toCalcExpressionLength(const CalcExpressionNode* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->type() == CalcExpressionNodeLength);
+    return static_cast<const CalcExpressionLength*>(value);
+}
+
 class CalcExpressionBinaryOperation : public CalcExpressionNode {
 public:
     CalcExpressionBinaryOperation(PassOwnPtr<CalcExpressionNode> leftSide, PassOwnPtr<CalcExpressionNode> rightSide, CalcOperator op)
@@ -171,13 +190,16 @@ public:
         return m_operator == o.m_operator && *m_leftSide == *o.m_leftSide && *m_rightSide == *o.m_rightSide;
     }
 
-    virtual bool operator==(const CalcExpressionNode& o) const
+    virtual bool operator==(const CalcExpressionNode& o) const OVERRIDE
     {
         return type() == o.type() && *this == static_cast<const CalcExpressionBinaryOperation&>(o);
     }
-    
-    
-    virtual float evaluate(float) const;
+
+    virtual float evaluate(float) const OVERRIDE;
+
+    const CalcExpressionNode* leftSide() const { return m_leftSide.get(); }
+    const CalcExpressionNode* rightSide() const { return m_rightSide.get(); }
+    CalcOperator getOperator() const { return m_operator; }
 
 private:
     OwnPtr<CalcExpressionNode> m_leftSide;
@@ -185,6 +207,12 @@ private:
     CalcOperator m_operator;
 };
 
+inline const CalcExpressionBinaryOperation* toCalcExpressionBinaryOperation(const CalcExpressionNode* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->type() == CalcExpressionNodeBinaryOperation);
+    return static_cast<const CalcExpressionBinaryOperation*>(value);
+}
+
 class CalcExpressionBlendLength : public CalcExpressionNode {
 public:
     CalcExpressionBlendLength(Length from, Length to, float progress)
@@ -194,28 +222,38 @@ public:
     {
         m_type = CalcExpressionNodeBlendLength;
     }
-    
+
     bool operator==(const CalcExpressionBlendLength& o) const
     {
         return m_progress == o.m_progress && m_from == o.m_from && m_to == o.m_to;
     }
-    
-    virtual bool operator==(const CalcExpressionNode& o) const
+
+    virtual bool operator==(const CalcExpressionNode& o) const OVERRIDE
     {
         return type() == o.type() && *this == static_cast<const CalcExpressionBlendLength&>(o);
     }
-    
-    virtual float evaluate(float maxValue) const
+
+    virtual float evaluate(float maxValue) const OVERRIDE
     {
         return (1.0f - m_progress) * floatValueForLength(m_from, maxValue) + m_progress * floatValueForLength(m_to, maxValue);
     }
-    
-private:  
+
+    const Length& from() const { return m_from; }
+    const Length& to() const { return m_to; }
+    float progress() const { return m_progress; }
+
+private:
     Length m_from;
     Length m_to;
     float m_progress;
 };
-    
+
+inline const CalcExpressionBlendLength* toCalcExpressionBlendLength(const CalcExpressionNode* value)
+{
+    ASSERT_WITH_SECURITY_IMPLICATION(!value || value->type() == CalcExpressionNodeBlendLength);
+    return static_cast<const CalcExpressionBlendLength*>(value);
+}
+
 } // namespace WebCore
 
 #endif // CalculationValue_h
diff --git a/Source/WebCore/platform/graphics/qt/GraphicsContextQt.cpp b/Source/WebCore/platform/graphics/qt/GraphicsContextQt.cpp
index 65b93535a..b11e05d8b 100644
--- a/Source/WebCore/platform/graphics/qt/GraphicsContextQt.cpp
+++ b/Source/WebCore/platform/graphics/qt/GraphicsContextQt.cpp
@@ -356,6 +356,7 @@ void GraphicsContext::platformInit(PlatformGraphicsContext* painter)
     QPen pen(painter->pen());
     pen.setColor(strokeColor());
     pen.setJoinStyle(toQtLineJoin(MiterJoin));
+    pen.setCapStyle(Qt::FlatCap);
     painter->setPen(pen);
 }
 
diff --git a/Source/WebCore/platform/network/qt/QNetworkReplyHandler.cpp b/Source/WebCore/platform/network/qt/QNetworkReplyHandler.cpp
index e07bc76a9..4a2121907 100644
--- a/Source/WebCore/platform/network/qt/QNetworkReplyHandler.cpp
+++ b/Source/WebCore/platform/network/qt/QNetworkReplyHandler.cpp
@@ -601,7 +601,8 @@ void QNetworkReplyHandler::sendResponseIfNeeded()
     int statusCode = m_replyWrapper->reply()->attribute(QNetworkRequest::HttpStatusCodeAttribute).toInt();
 
     if (url.protocolIsInHTTPFamily()) {
-        String suggestedFilename = filenameFromHTTPContentDisposition(QString::fromLatin1(m_replyWrapper->reply()->rawHeader("Content-Disposition")));
+        QByteArray contentDisposition = m_replyWrapper->reply()->rawHeader("Content-Disposition");
+        String suggestedFilename = filenameFromHTTPContentDisposition(String(contentDisposition.constData(), contentDisposition.size()));
 
         if (!suggestedFilename.isEmpty())
             response.setSuggestedFilename(suggestedFilename);
@@ -626,7 +627,7 @@ void QNetworkReplyHandler::sendResponseIfNeeded()
 
         // Add remaining headers.
         foreach (const QNetworkReply::RawHeaderPair& pair, m_replyWrapper->reply()->rawHeaderPairs())
-            response.setHTTPHeaderField(QString::fromLatin1(pair.first), QString::fromLatin1(pair.second));
+            response.setHTTPHeaderField(String(pair.first.constData(), pair.first.size()), String(pair.second.constData(), pair.second.size()));
     }
 
     QUrl redirection = m_replyWrapper->reply()->attribute(QNetworkRequest::RedirectionTargetAttribute).toUrl();
diff --git a/Source/WebCore/platform/network/qt/ResourceRequestQt.cpp b/Source/WebCore/platform/network/qt/ResourceRequestQt.cpp
index 46229027e..83c50062d 100644
--- a/Source/WebCore/platform/network/qt/ResourceRequestQt.cpp
+++ b/Source/WebCore/platform/network/qt/ResourceRequestQt.cpp
@@ -89,6 +89,13 @@ static void resolveBlobUrl(const QUrl& url, QUrl& resolvedUrl)
 }
 #endif
 
+static inline QByteArray stringToByteArray(const String& string)
+{
+    if (string.is8Bit())
+        return QByteArray(reinterpret_cast<const char*>(string.characters8()), string.length());
+    return QString(string).toLatin1();
+}
+
 QNetworkRequest ResourceRequest::toNetworkRequest(NetworkingContext *context) const
 {
     QNetworkRequest request;
@@ -105,14 +112,13 @@ QNetworkRequest ResourceRequest::toNetworkRequest(NetworkingContext *context) co
     const HTTPHeaderMap &headers = httpHeaderFields();
     for (HTTPHeaderMap::const_iterator it = headers.begin(), end = headers.end();
          it != end; ++it) {
-        QByteArray name = QString(it->key).toLatin1();
-        QByteArray value = QString(it->value).toLatin1();
+        QByteArray name = stringToByteArray(it->key);
         // QNetworkRequest::setRawHeader() would remove the header if the value is null
         // Make sure to set an empty header instead of null header.
-        if (!value.isNull())
-            request.setRawHeader(name, value);
+        if (!it->value.isNull())
+            request.setRawHeader(name, stringToByteArray(it->value));
         else
-            request.setRawHeader(name, "");
+            request.setRawHeader(name, QByteArrayLiteral(""));
     }
 
     // Make sure we always have an Accept header; some sites require this to
diff --git a/Source/WebCore/platform/qt/QStyleFacade.h b/Source/WebCore/platform/qt/QStyleFacade.h
index fe7ead1d0..25d3a7dce 100644
--- a/Source/WebCore/platform/qt/QStyleFacade.h
+++ b/Source/WebCore/platform/qt/QStyleFacade.h
@@ -38,6 +38,8 @@ class QStyleFacadeOption;
 class QStyleFacade {
 public:
     enum ButtonSubElement {
+        CheckBoxIndicator,
+        RadioButtonIndicator,
         PushButtonLayoutItem,
         PushButtonContents
     };
diff --git a/Source/WebCore/platform/qt/RenderThemeQStyle.cpp b/Source/WebCore/platform/qt/RenderThemeQStyle.cpp
index 999c670c4..9f3d50a2d 100644
--- a/Source/WebCore/platform/qt/RenderThemeQStyle.cpp
+++ b/Source/WebCore/platform/qt/RenderThemeQStyle.cpp
@@ -62,6 +62,20 @@ namespace WebCore {
 
 using namespace HTMLNames;
 
+static QStyleFacade::ButtonSubElement indicatorSubElement(QStyleFacade::ButtonType part)
+{
+    switch (part) {
+    case QStyleFacade::CheckBox:
+        return QStyleFacade::CheckBoxIndicator;
+    case QStyleFacade::RadioButton:
+        return QStyleFacade::RadioButtonIndicator;
+    default:
+        break;
+    }
+    ASSERT_NOT_REACHED();
+    return QStyleFacade::CheckBoxIndicator;
+}
+
 QSharedPointer<StylePainter> RenderThemeQStyle::getStylePainter(const PaintInfo& paintInfo)
 {
     return QSharedPointer<StylePainter>(new StylePainterQStyle(this, paintInfo, /*RenderObject*/0));
@@ -139,6 +153,11 @@ void RenderThemeQStyle::setPaletteFromPageClientIfExists(QPalette& palette) cons
         palette = pageClient->palette();
 }
 
+QRect RenderThemeQStyle::indicatorRect(QStyleFacade::ButtonType part, const QRect& originalRect) const
+{
+    return m_qStyle->buttonSubElementRect(indicatorSubElement(part), QStyleFacade::State_Small, originalRect);
+}
+
 QRect RenderThemeQStyle::inflateButtonRect(const QRect& originalRect) const
 {
     QRect layoutRect = m_qStyle->buttonSubElementRect(QStyleFacade::PushButtonLayoutItem, QStyleFacade::State_Small, originalRect);
@@ -153,6 +172,29 @@ QRect RenderThemeQStyle::inflateButtonRect(const QRect& originalRect) const
     return originalRect;
 }
 
+template<typename T>
+static void inflateCheckBoxRectImpl(T& originalRect, const QRect& rect)
+{
+    if (!rect.isNull()) {
+        int dx = static_cast<int>((rect.width() - originalRect.width()) / 2);
+        originalRect.setX(originalRect.x() - dx);
+        originalRect.setWidth(rect.width());
+        int dy = static_cast<int>((rect.height() - originalRect.height()) / 2);
+        originalRect.setY(originalRect.y() - dy);
+        originalRect.setHeight(rect.height());
+    }
+}
+
+void RenderThemeQStyle::computeControlRect(QStyleFacade::ButtonType part, QRect& originalRect) const
+{
+    inflateCheckBoxRectImpl(originalRect, indicatorRect(part, originalRect));
+}
+
+void RenderThemeQStyle::computeControlRect(QStyleFacade::ButtonType part, IntRect& originalRect) const
+{
+    inflateCheckBoxRectImpl(originalRect, indicatorRect(part, originalRect));
+}
+
 int extendFixedPadding(Length oldPadding, int padding) {
     if (oldPadding.isFixed()) {
         return std::max(oldPadding.intValue(), padding);
@@ -306,10 +348,13 @@ bool RenderThemeQStyle::paintButton(RenderObject* o, const PaintInfo& i, const I
     if (p.appearance == PushButtonPart || p.appearance == ButtonPart) {
         p.styleOption.rect = inflateButtonRect(p.styleOption.rect);
         p.paintButton(QStyleFacade::PushButton);
-    } else if (p.appearance == RadioPart)
+    } else if (p.appearance == RadioPart) {
+        computeControlRect(QStyleFacade::RadioButton, p.styleOption.rect);
         p.paintButton(QStyleFacade::RadioButton);
-    else if (p.appearance == CheckboxPart)
+    } else if (p.appearance == CheckboxPart) {
+        computeControlRect(QStyleFacade::CheckBox, p.styleOption.rect);
         p.paintButton(QStyleFacade::CheckBox);
+    }
 
     return false;
 }
diff --git a/Source/WebCore/platform/qt/RenderThemeQStyle.h b/Source/WebCore/platform/qt/RenderThemeQStyle.h
index 6027f16e5..781e066ae 100644
--- a/Source/WebCore/platform/qt/RenderThemeQStyle.h
+++ b/Source/WebCore/platform/qt/RenderThemeQStyle.h
@@ -22,7 +22,6 @@
 #ifndef RenderThemeQStyle_h
 #define RenderThemeQStyle_h
 
-#include "QStyleFacade.h"
 #include "RenderThemeQt.h"
 
 namespace WebCore {
@@ -96,6 +95,8 @@ protected:
     virtual QSharedPointer<StylePainter> getStylePainter(const PaintInfo&);
 
     virtual QRect inflateButtonRect(const QRect& originalRect) const;
+    void computeControlRect(QStyleFacade::ButtonType, QRect& originalRect) const OVERRIDE;
+    void computeControlRect(QStyleFacade::ButtonType, IntRect& originalRect) const OVERRIDE;
 
     virtual void setPopupPadding(RenderStyle*) const;
 
@@ -108,6 +109,8 @@ private:
 
     void setPaletteFromPageClientIfExists(QPalette&) const;
 
+    QRect indicatorRect(QStyleFacade::ButtonType part, const QRect& originalRect) const;
+
 #ifdef Q_OS_MAC
     int m_buttonFontPixelSize;
 #endif
diff --git a/Source/WebCore/platform/qt/RenderThemeQt.cpp b/Source/WebCore/platform/qt/RenderThemeQt.cpp
index 8a6232ea9..9bb1b5139 100644
--- a/Source/WebCore/platform/qt/RenderThemeQt.cpp
+++ b/Source/WebCore/platform/qt/RenderThemeQt.cpp
@@ -211,12 +211,22 @@ QRect RenderThemeQt::inflateButtonRect(const QRect& originalRect) const
     return originalRect;
 }
 
+void RenderThemeQt::computeControlRect(QStyleFacade::ButtonType, QRect&) const
+{
+}
+
+void RenderThemeQt::computeControlRect(QStyleFacade::ButtonType, IntRect&) const
+{
+}
+
 void RenderThemeQt::adjustRepaintRect(const RenderObject* o, IntRect& rect)
 {
     switch (o->style()->appearance()) {
     case CheckboxPart:
+        computeControlRect(QStyleFacade::CheckBox, rect);
         break;
     case RadioPart:
+        computeControlRect(QStyleFacade::RadioButton, rect);
         break;
     case PushButtonPart:
     case ButtonPart: {
diff --git a/Source/WebCore/platform/qt/RenderThemeQt.h b/Source/WebCore/platform/qt/RenderThemeQt.h
index 7d464d7ec..fb021f3d0 100644
--- a/Source/WebCore/platform/qt/RenderThemeQt.h
+++ b/Source/WebCore/platform/qt/RenderThemeQt.h
@@ -22,6 +22,7 @@
 #ifndef RenderThemeQt_h
 #define RenderThemeQt_h
 
+#include "QStyleFacade.h"
 #include "RenderTheme.h"
 
 #include <QBrush>
@@ -168,6 +169,8 @@ protected:
     virtual String fileListNameForWidth(const FileList*, const Font&, int width, bool multipleFilesAllowed) const OVERRIDE;
 
     virtual QRect inflateButtonRect(const QRect& originalRect) const;
+    virtual void computeControlRect(QStyleFacade::ButtonType, QRect& originalRect) const;
+    virtual void computeControlRect(QStyleFacade::ButtonType, IntRect& originalRect) const;
 
     virtual void setPopupPadding(RenderStyle*) const = 0;
 
diff --git a/Source/WebCore/rendering/RenderObject.cpp b/Source/WebCore/rendering/RenderObject.cpp
index b93764828..655b79122 100644
--- a/Source/WebCore/rendering/RenderObject.cpp
+++ b/Source/WebCore/rendering/RenderObject.cpp
@@ -230,6 +230,8 @@ RenderObject* RenderObject::createObject(Element* element, RenderStyle* style)
         return new (arena) RenderDeprecatedFlexibleBox(element);
     case FLEX:
     case INLINE_FLEX:
+    case WEBKIT_FLEX:
+    case WEBKIT_INLINE_FLEX:
         return new (arena) RenderFlexibleBox(element);
     case GRID:
     case INLINE_GRID:
diff --git a/Source/WebCore/rendering/style/RenderStyleConstants.h b/Source/WebCore/rendering/style/RenderStyleConstants.h
index 830612e57..ef61f68c4 100644
--- a/Source/WebCore/rendering/style/RenderStyleConstants.h
+++ b/Source/WebCore/rendering/style/RenderStyleConstants.h
@@ -443,7 +443,7 @@ enum EDisplay {
     TABLE_HEADER_GROUP, TABLE_FOOTER_GROUP, TABLE_ROW,
     TABLE_COLUMN_GROUP, TABLE_COLUMN, TABLE_CELL,
     TABLE_CAPTION, BOX, INLINE_BOX,
-    FLEX, INLINE_FLEX,
+    FLEX, WEBKIT_FLEX, INLINE_FLEX, WEBKIT_INLINE_FLEX,
     GRID, INLINE_GRID,
     NONE
 };
diff --git a/Source/WebKit/qt/Api/qwebsettings.cpp b/Source/WebKit/qt/Api/qwebsettings.cpp
index 363f58f78..d3a864262 100644
--- a/Source/WebKit/qt/Api/qwebsettings.cpp
+++ b/Source/WebKit/qt/Api/qwebsettings.cpp
@@ -455,7 +455,7 @@ QWebSettings* QWebSettings::globalSettings()
     \value PrivateBrowsingEnabled Private browsing prevents WebKit from
         recording visited pages in the history and storing web page icons. This is disabled by default.
     \value JavascriptCanOpenWindows Specifies whether JavaScript programs
-        can open new windows. This is disabled by default.
+        can open popup windows without user interaction. This is disabled by default.
     \value JavascriptCanCloseWindows Specifies whether JavaScript programs
         can close windows. This is disabled by default.
     \value JavascriptCanAccessClipboard Specifies whether JavaScript programs
diff --git a/Source/WebKit/qt/WidgetSupport/QStyleFacadeImp.cpp b/Source/WebKit/qt/WidgetSupport/QStyleFacadeImp.cpp
index 6881d9d74..e36b5bd20 100644
--- a/Source/WebKit/qt/WidgetSupport/QStyleFacadeImp.cpp
+++ b/Source/WebKit/qt/WidgetSupport/QStyleFacadeImp.cpp
@@ -163,6 +163,8 @@ QRect QStyleFacadeImp::buttonSubElementRect(QStyleFacade::ButtonSubElement butto
 
     QStyle::SubElement subElement = QStyle::SE_CustomBase;
     switch (buttonElement) {
+    case CheckBoxIndicator: subElement = QStyle::SE_CheckBoxIndicator; break;
+    case RadioButtonIndicator: subElement = QStyle::SE_RadioButtonIndicator; break;
     case PushButtonLayoutItem: subElement = QStyle::SE_PushButtonLayoutItem; break;
     case PushButtonContents: subElement = QStyle::SE_PushButtonContents; break;
     default: ASSERT_NOT_REACHED();
diff --git a/Source/WebKit/qt/WidgetSupport/QtFallbackWebPopup.cpp b/Source/WebKit/qt/WidgetSupport/QtFallbackWebPopup.cpp
index 61ddacaa8..e6c83197e 100644
--- a/Source/WebKit/qt/WidgetSupport/QtFallbackWebPopup.cpp
+++ b/Source/WebKit/qt/WidgetSupport/QtFallbackWebPopup.cpp
@@ -71,6 +71,9 @@ void QtFallbackWebPopup::show(const QWebSelectData& data)
         m_combo->setGeometry(QRect(rect.left(), rect.top(), rect.width(), m_combo->sizeHint().height()));
     }
 
+    // adjust the size of combo box to the longest name
+    m_combo->adjustSize();
+
     m_combo->showPopupAtCursorPosition();
 }
 
diff --git a/Source/WebKit/qt/declarative/experimental/experimental.pri b/Source/WebKit/qt/declarative/experimental/experimental.pri
index b81e4220c..ed3d21b1f 100644
--- a/Source/WebKit/qt/declarative/experimental/experimental.pri
+++ b/Source/WebKit/qt/declarative/experimental/experimental.pri
@@ -11,9 +11,11 @@ TARGET.module_name = QtWebKit/experimental
 
 CONFIG += plugin
 
-cpqmldir.files = $${_PRO_FILE_PWD_}/qmldir
-cpqmldir.path = $${ROOT_BUILD_DIR}/imports/$${TARGET.module_name}
-COPIES += cpqmldir
+!debug_and_release|!build_all|CONFIG(release, debug|release) {
+    cpqmldir.files = $${_PRO_FILE_PWD_}/qmldir
+    cpqmldir.path = $${ROOT_BUILD_DIR}/imports/$${TARGET.module_name}
+    COPIES += cpqmldir
+}
 
 qtConfig(reduce_exports):CONFIG += hide_symbols
 
diff --git a/Source/WebKit/qt/declarative/public.pri b/Source/WebKit/qt/declarative/public.pri
index 01a8341c9..6c3c2d404 100644
--- a/Source/WebKit/qt/declarative/public.pri
+++ b/Source/WebKit/qt/declarative/public.pri
@@ -11,9 +11,11 @@ TARGET.module_name = QtWebKit
 
 CONFIG += plugin
 
-cpqmldir.files = $${_PRO_FILE_PWD_}/qmldir
-cpqmldir.path = $${ROOT_BUILD_DIR}/imports/$${TARGET.module_name}
-COPIES += cpqmldir
+!debug_and_release|!build_all|CONFIG(release, debug|release) {
+    cpqmldir.files = $${_PRO_FILE_PWD_}/qmldir
+    cpqmldir.path = $${ROOT_BUILD_DIR}/imports/$${TARGET.module_name}
+    COPIES += cpqmldir
+}
 
 qtConfig(reduce_exports):CONFIG += hide_symbols
 
diff --git a/Source/WebKit/qt/docs/qtwebkit.qdoc b/Source/WebKit/qt/docs/qtwebkit.qdoc
index f8f22fbd9..f72d39a32 100644
--- a/Source/WebKit/qt/docs/qtwebkit.qdoc
+++ b/Source/WebKit/qt/docs/qtwebkit.qdoc
@@ -175,7 +175,7 @@
     \endtable
 
     \table
-    \header \li Mac OS X
+    \header \li \macos
     \row \li
     \list
     \li \c{Library/Internet Plug-Ins} in the user's home directory
diff --git a/Source/WebKit/qt/tests/qobjectbridge/tst_qobjectbridge.cpp b/Source/WebKit/qt/tests/qobjectbridge/tst_qobjectbridge.cpp
index 52e6422b1..18d82625c 100644
--- a/Source/WebKit/qt/tests/qobjectbridge/tst_qobjectbridge.cpp
+++ b/Source/WebKit/qt/tests/qobjectbridge/tst_qobjectbridge.cpp
@@ -642,6 +642,7 @@ private Q_SLOTS:
     void introspectQtMethods_data();
     void introspectQtMethods();
     void scriptablePlugin();
+    void exceptionInSlot();
 
 private:
     QString evalJS(const QString& s)
@@ -2234,5 +2235,32 @@ void tst_QObjectBridge::scriptablePlugin()
     QCOMPARE(result.toString(), QLatin1String("42"));
 }
 
+class WebPageWithConsoleCapture : public QWebPage
+{
+public:
+    void javaScriptConsoleMessage(const QString &message, int, const QString &)
+    {
+        consoleMessages << message;
+    }
+
+    QStringList consoleMessages;
+};
+
+void tst_QObjectBridge::exceptionInSlot()
+{
+    WebPageWithConsoleCapture page;
+    QWebFrame* frame = page.mainFrame();
+    frame->addToJavaScriptWindowObject("myObject", m_myObject);
+    frame->evaluateJavaScript(
+        "myHandler = function() { window.gotSignal = true; throw 'exception in slot'; };"
+        "myObject.mySignal.connect(myHandler);"
+        "gotSignal = false;"
+        "myObject.mySignal();"
+    );
+    QString ret = frame->evaluateJavaScript("gotSignal").toString();
+    QCOMPARE(ret, sTrue);
+    QCOMPARE(page.consoleMessages, QStringList() << "exception in slot");
+}
+
 QTEST_MAIN(tst_QObjectBridge)
 #include "tst_qobjectbridge.moc"
diff --git a/dist/changes-5.6.2 b/dist/changes-5.6.2
new file mode 100644
index 000000000..07cd4d2e3
--- /dev/null
+++ b/dist/changes-5.6.2
@@ -0,0 +1,40 @@
+Qt 5.6.2 is a bug-fix release. It maintains both forward and backward
+compatibility (source and binary) with Qt 5.6.1.
+
+For more details, refer to the online documentation included in this
+distribution. The documentation is also available online:
+
+  http://doc.qt.io/qt-5.6
+
+The Qt version 5.6 series is binary compatible with the 5.5.x series.
+Applications compiled for 5.5 will continue to run with 5.6.
+
+Some of the changes listed in this file include issue tracking numbers
+corresponding to tasks in the Qt Bug Tracker:
+
+  http://bugreports.qt.io/
+
+Each of these identifiers can be entered in the bug tracker to obtain more
+information about a particular change.
+
+
+****************************************************************************
+*                              Library                                     *
+****************************************************************************
+
+QtWebkit
+--------
+ - [QTBUG-53532] Fixed drawing of zoomed border-image with repeat mode
+ - [QTBUG-53989] Suppressed warnings about image format being blocked for
+   invalid images
+ - [QTBUG-55171] Dotted borders having radius are painted as solid
+ - [QTBUG-55175] Border dashes have wrong length
+
+
+****************************************************************************
+*                      Platform Specific Changes                           *
+****************************************************************************
+
+- Fixed compilation on macOS when targeting 10.9 or higher
+- Fixed compilation on OpenBSD in C++11 mode
+- Various other build fixes