Unprefix the flexbox CSS properties
authordino@apple.com <dino@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 12 Sep 2014 20:46:05 +0000 (20:46 +0000)
committerdino@apple.com <dino@apple.com@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 12 Sep 2014 20:46:05 +0000 (20:46 +0000)
https://bugs.webkit.org/show_bug.cgi?id=98420

Reviewed by Benjamin Poulain.

Source/WebCore:

Remove the need for a "-webkit-" prefix on flexbox
and related properties. This includes:
- align-content
- align-items
- align-self
- flex-basis
- flex-direction
- flex-wrap
- flex-grow
- flex-shrink
- flex
- flex-flow
- justify
- order

... as well as the display keyword values "flex" and
"inline-flex".

* css/CSSComputedStyleDeclaration.cpp:  Change names.
(WebCore::ComputedStyleExtractor::propertyValue):
* css/CSSParser.cpp: Ditto.
(WebCore::isValidKeywordPropertyAndValue):
(WebCore::isKeywordPropertyID):
(WebCore::CSSParser::parseValue):
(WebCore::CSSParser::parseFlex):
* css/CSSPrimitiveValueMappings.h: Since we need to still handle the old
keywords for display, this has added two new keywords.
(WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
(WebCore::CSSPrimitiveValue::operator EDisplay): If the older keywords were used in
content, map them to the new value names.
* css/CSSPropertyNames.in: Add aliases for the prefixed properties.
* css/CSSValueKeywords.in: Add "flex" and "inline-flex".
* css/DeprecatedStyleBuilder.cpp: Change names.
(WebCore::DeprecatedStyleBuilder::DeprecatedStyleBuilder):
* css/StyleProperties.cpp: Change names.
(WebCore::StyleProperties::getPropertyValue):
(WebCore::StyleProperties::asText):
* css/StylePropertyShorthand.cpp: Rename shorthand methods to remove the prefix.
(WebCore::flexFlowShorthand):
(WebCore::flexShorthand):
(WebCore::shorthandForProperty):
(WebCore::matchingShorthandsForLonghand):
(WebCore::webkitFlexFlowShorthand): Deleted.
(WebCore::webkitFlexShorthand): Deleted.
* css/StylePropertyShorthand.h:
* css/StyleResolver.cpp:
(WebCore::equivalentBlockDisplay):
(WebCore::StyleResolver::applyProperty):
* page/animation/CSSPropertyAnimation.cpp: Change names.
(WebCore::PropertyWrapperFlex::PropertyWrapperFlex):
* rendering/RenderElement.cpp:
(WebCore::RenderElement::createFor): Handle the two new display values (the same way as
the old values).
* rendering/style/RenderStyleConstants.h: Add constants for the new display values.

LayoutTests:

Now that we return "flex" instead of "-webkit-flex" (and similar
changes) update the tests that rely on this. Other than that,
we're still testing the prefixed content. A followup patch
will add tests for non-prefixed content.

* css3/flexbox/display-flexbox-set-get-expected.txt:
* css3/flexbox/display-flexbox-set-get.html:
* css3/flexbox/flexitem.html:
* fast/css-grid-layout/grid-item-display.html:
* fast/css/getComputedStyle/computed-style-expected.txt:
* fast/css/getComputedStyle/computed-style-without-renderer-expected.txt:
* fast/css/getComputedStyle/resources/property-names.js:
* fast/css/inherit-initial-shorthand-values-expected.txt:
* fast/css/inherit-initial-shorthand-values.html:
* svg/css/getComputedStyle-basic-expected.txt:
* transitions/flex-transitions-expected.txt:
* transitions/flex-transitions.html:

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@173572 268f45cc-cd09-0410-ab3c-d52691b4dbfc

27 files changed:
LayoutTests/ChangeLog
LayoutTests/css3/flexbox/display-flexbox-set-get-expected.txt
LayoutTests/css3/flexbox/display-flexbox-set-get.html
LayoutTests/css3/flexbox/flexitem.html
LayoutTests/fast/css-grid-layout/grid-item-display.html
LayoutTests/fast/css/getComputedStyle/computed-style-expected.txt
LayoutTests/fast/css/getComputedStyle/computed-style-without-renderer-expected.txt
LayoutTests/fast/css/getComputedStyle/resources/property-names.js
LayoutTests/fast/css/inherit-initial-shorthand-values-expected.txt
LayoutTests/fast/css/inherit-initial-shorthand-values.html
LayoutTests/svg/css/getComputedStyle-basic-expected.txt
LayoutTests/transitions/flex-transitions-expected.txt
LayoutTests/transitions/flex-transitions.html
Source/WebCore/ChangeLog
Source/WebCore/css/CSSComputedStyleDeclaration.cpp
Source/WebCore/css/CSSParser.cpp
Source/WebCore/css/CSSPrimitiveValueMappings.h
Source/WebCore/css/CSSPropertyNames.in
Source/WebCore/css/CSSValueKeywords.in
Source/WebCore/css/DeprecatedStyleBuilder.cpp
Source/WebCore/css/StyleProperties.cpp
Source/WebCore/css/StylePropertyShorthand.cpp
Source/WebCore/css/StylePropertyShorthand.h
Source/WebCore/css/StyleResolver.cpp
Source/WebCore/page/animation/CSSPropertyAnimation.cpp
Source/WebCore/rendering/RenderElement.cpp
Source/WebCore/rendering/style/RenderStyleConstants.h

index 35d63ef..7d4dd6a 100644 (file)
@@ -1,3 +1,28 @@
+2014-09-12  Dean Jackson  <dino@apple.com>
+
+        Unprefix the flexbox CSS properties
+        https://bugs.webkit.org/show_bug.cgi?id=98420
+
+        Reviewed by Benjamin Poulain.
+
+        Now that we return "flex" instead of "-webkit-flex" (and similar
+        changes) update the tests that rely on this. Other than that,
+        we're still testing the prefixed content. A followup patch
+        will add tests for non-prefixed content.
+
+        * css3/flexbox/display-flexbox-set-get-expected.txt:
+        * css3/flexbox/display-flexbox-set-get.html:
+        * css3/flexbox/flexitem.html:
+        * fast/css-grid-layout/grid-item-display.html:
+        * fast/css/getComputedStyle/computed-style-expected.txt:
+        * fast/css/getComputedStyle/computed-style-without-renderer-expected.txt:
+        * fast/css/getComputedStyle/resources/property-names.js:
+        * fast/css/inherit-initial-shorthand-values-expected.txt:
+        * fast/css/inherit-initial-shorthand-values.html:
+        * svg/css/getComputedStyle-basic-expected.txt:
+        * transitions/flex-transitions-expected.txt:
+        * transitions/flex-transitions.html:
+
 2014-09-12  Yusuke Suzuki  <utatane.tea@gmail.com>
 
         ASSERTION FAILED: e in WebCore::StyleResolver::adjustRenderStyle
index a8ebaf2..809d370 100644 (file)
@@ -4,14 +4,14 @@ On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE
 
 
 Test getting |display| set through CSS
-PASS getComputedStyle(flexboxElement, '').getPropertyValue('display') is '-webkit-flex'
-PASS getComputedStyle(inlineFlexboxElement, '').getPropertyValue('display') is '-webkit-inline-flex'
+PASS getComputedStyle(flexboxElement, '').getPropertyValue('display') is 'flex'
+PASS getComputedStyle(inlineFlexboxElement, '').getPropertyValue('display') is 'inline-flex'
 
 Test getting and setting display through JS
 PASS getComputedStyle(element, '').getPropertyValue('display') is 'block'
-PASS getComputedStyle(element, '').getPropertyValue('display') is '-webkit-flex'
+PASS getComputedStyle(element, '').getPropertyValue('display') is 'flex'
 PASS getComputedStyle(element, '').getPropertyValue('display') is 'block'
-PASS getComputedStyle(element, '').getPropertyValue('display') is '-webkit-inline-flex'
+PASS getComputedStyle(element, '').getPropertyValue('display') is 'inline-flex'
 PASS successfullyParsed is true
 
 TEST COMPLETE
index f5c3ca2..170cc47 100644 (file)
@@ -15,9 +15,9 @@ description('Test that setting and getting display: -webkit-flex and -webkit-inl
 
 debug("Test getting |display| set through CSS");
 var flexboxElement = document.getElementById("flexbox");
-shouldBe("getComputedStyle(flexboxElement, '').getPropertyValue('display')", "'-webkit-flex'");
+shouldBe("getComputedStyle(flexboxElement, '').getPropertyValue('display')", "'flex'");
 var inlineFlexboxElement = document.getElementById("flexboxInline");
-shouldBe("getComputedStyle(inlineFlexboxElement, '').getPropertyValue('display')", "'-webkit-inline-flex'");
+shouldBe("getComputedStyle(inlineFlexboxElement, '').getPropertyValue('display')", "'inline-flex'");
 
 debug("");
 debug("Test getting and setting display through JS");
@@ -25,13 +25,13 @@ var element = document.createElement("div");
 document.body.appendChild(element);
 shouldBe("getComputedStyle(element, '').getPropertyValue('display')", "'block'");
 element.style.display = "-webkit-flex";
-shouldBe("getComputedStyle(element, '').getPropertyValue('display')", "'-webkit-flex'");
+shouldBe("getComputedStyle(element, '').getPropertyValue('display')", "'flex'");
 
 element = document.createElement("div");
 document.body.appendChild(element);
 shouldBe("getComputedStyle(element, '').getPropertyValue('display')", "'block'");
 element.style.display = "-webkit-inline-flex";
-shouldBe("getComputedStyle(element, '').getPropertyValue('display')", "'-webkit-inline-flex'");
+shouldBe("getComputedStyle(element, '').getPropertyValue('display')", "'inline-flex'");
 </script>
 <script src="../../resources/js-test-post.js"></script>
 </body>
index 106edd4..9a833ca 100644 (file)
@@ -71,7 +71,7 @@
 <div class="flexbox" style="width: 700px">
   <div data-expected-display="block" data-expected-width="100" style="display: inline-block;"></div>
   <div data-expected-display="-webkit-box" data-expected-width="100" style="display: -webkit-inline-box;"></div>
-  <div data-expected-display="-webkit-flex" data-expected-width="100" style="display: -webkit-inline-flex;"></div>
+  <div data-expected-display="flex" data-expected-width="100" style="display: -webkit-inline-flex;"></div>
   <div data-expected-display="block" data-expected-width="100" style="display: table-cell"></div>
   <div data-expected-display="block" data-expected-width="100" style="display: compact"></div>
   <div data-expected-display="block" data-expected-width="100" style="display: run-in"></div>
index 0380993..51b1cfc 100644 (file)
@@ -34,8 +34,8 @@
         <div data-expected-display="block" data-offset-x="50" data-offset-y="150" style="display: inline-block"></div>
 
         <!-- Some extra values we support. -->
-        <div data-expected-display="-webkit-flex" data-offset-x="50" data-offset-y="150" style="display: -webkit-flex"></div>
-        <div data-expected-display="-webkit-flex" data-offset-x="50" data-offset-y="150" style="display: -webkit-inline-flex"></div>
+        <div data-expected-display="flex" data-offset-x="50" data-offset-y="150" style="display: -webkit-flex"></div>
+        <div data-expected-display="flex" data-offset-x="50" data-offset-y="150" style="display: -webkit-inline-flex"></div>
         <div data-expected-display="block" data-offset-x="50" data-offset-y="150" style="display: -webkit-inline-block"></div>
         <div data-expected-display="block" data-offset-x="50" data-offset-y="150" style="display: compact"></div>
         <div data-expected-display="block" data-offset-x="50" data-offset-y="150" style="display: run-in"></div>
index cef0509..8e957c0 100644 (file)
@@ -143,12 +143,12 @@ zoom: 1;
 -webkit-column-rule-width: 0px;
 -webkit-column-span: none;
 -webkit-column-width: auto;
--webkit-align-content: stretch;
--webkit-align-items: stretch;
--webkit-align-self: stretch;
--webkit-flex-direction: row;
--webkit-flex-wrap: nowrap;
--webkit-justify-content: flex-start;
+align-content: stretch;
+align-items: stretch;
+align-self: stretch;
+flex-direction: row;
+flex-wrap: nowrap;
+justify-content: flex-start;
 -webkit-font-kerning: auto;
 -webkit-font-smoothing: auto;
 -webkit-font-variant-ligatures: normal;
@@ -193,7 +193,7 @@ zoom: 1;
 -webkit-mask-repeat: repeat;
 -webkit-mask-size: auto;
 -webkit-nbsp-mode: normal;
--webkit-order: 0;
+order: 0;
 -webkit-perspective: none;
 -webkit-perspective-origin: 392px 288px;
 -webkit-print-color-adjust: economy;
index 74e92cf..b4d0dba 100644 (file)
@@ -142,12 +142,12 @@ zoom: 1
 -webkit-column-rule-width: 0px
 -webkit-column-span: none
 -webkit-column-width: auto
--webkit-align-content: stretch
--webkit-align-items: stretch
--webkit-align-self: stretch
--webkit-flex-direction: row
--webkit-flex-wrap: nowrap
--webkit-justify-content: flex-start
+align-content: stretch
+align-items: stretch
+align-self: stretch
+flex-direction: row
+flex-wrap: nowrap
+justify-content: flex-start
 -webkit-font-kerning: auto
 -webkit-font-smoothing: auto
 -webkit-font-variant-ligatures: normal
@@ -192,7 +192,7 @@ zoom: 1
 -webkit-mask-repeat: repeat
 -webkit-mask-size: auto
 -webkit-nbsp-mode: normal
--webkit-order: 0
+order: 0
 -webkit-perspective: none
 -webkit-perspective-origin: 50% 50%
 -webkit-print-color-adjust: economy
index 52a1459..cbc27ea 100644 (file)
@@ -1,8 +1,8 @@
 // We only test properties that are exposed in all ports.
 var propertiesToTest = {
-    "-webkit-align-content": true,
-    "-webkit-align-items": true,
-    "-webkit-align-self": true,
+    "align-content": true,
+    "align-items": true,
+    "align-self": true,
     "-webkit-animation-delay": true,
     "-webkit-animation-direction": true,
     "-webkit-animation-duration": true,
@@ -44,8 +44,8 @@ var propertiesToTest = {
     "-webkit-column-rule-width": true,
     "-webkit-column-span": true,
     "-webkit-column-width": true,
-    "-webkit-flex-direction": true,
-    "-webkit-flex-wrap": true,
+    "flex-direction": true,
+    "flex-wrap": true,
     "-webkit-font-kerning": true,
     "-webkit-font-smoothing": true,
     "-webkit-font-variant-ligatures": true,
@@ -64,7 +64,7 @@ var propertiesToTest = {
     "-webkit-hyphenate-limit-before": true,
     "-webkit-hyphenate-limit-lines": true,
     "-webkit-hyphens": true,
-    "-webkit-justify-content": true,
+    "justify-content": true,
     "-webkit-line-align": true,
     "-webkit-line-box-contain": true,
     "-webkit-line-break": true,
@@ -93,7 +93,7 @@ var propertiesToTest = {
     "-webkit-mask-repeat": true,
     "-webkit-mask-size": true,
     "-webkit-nbsp-mode": true,
-    "-webkit-order": true,
+    "order": true,
     "-webkit-perspective": true,
     "-webkit-perspective-origin": true,
     "-webkit-print-color-adjust": true,
index 2514d92..5bcad8d 100644 (file)
@@ -24,8 +24,8 @@ PASS test('webkit-border-end') is "inherit, initial"
 PASS test('webkit-border-start') is "inherit, initial"
 PASS test('webkit-columns') is "inherit, initial"
 PASS test('webkit-column-rule') is "inherit, initial"
-PASS test('webkit-flex-flow') is "inherit, initial"
-PASS test('webkit-flex') is "inherit, initial"
+PASS test('flex-flow') is "inherit, initial"
+PASS test('flex') is "inherit, initial"
 PASS test('webkit-marginCollapse') is "inherit, initial"
 PASS test('webkit-marquee') is "inherit, initial"
 PASS test('webkit-mask') is "inherit, initial"
index cbaf7eb..b85fdb6 100644 (file)
@@ -42,8 +42,8 @@ var shorthandNames = [
     "webkit-border-start",
     "webkit-columns",
     "webkit-column-rule",
-    "webkit-flex-flow",
-    "webkit-flex",
+    "flex-flow",
+    "flex",
     "webkit-marginCollapse",
     "webkit-marquee",
     "webkit-mask",
index 11a3b63..bd983f7 100644 (file)
@@ -284,18 +284,18 @@ rect: style.getPropertyValue(-webkit-column-span) : none
 rect: style.getPropertyCSSValue(-webkit-column-span) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-column-width) : auto
 rect: style.getPropertyCSSValue(-webkit-column-width) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-align-content) : stretch
-rect: style.getPropertyCSSValue(-webkit-align-content) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-align-items) : stretch
-rect: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-align-self) : stretch
-rect: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-flex-direction) : row
-rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-flex-wrap) : nowrap
-rect: style.getPropertyCSSValue(-webkit-flex-wrap) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-justify-content) : flex-start
-rect: style.getPropertyCSSValue(-webkit-justify-content) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(align-content) : stretch
+rect: style.getPropertyCSSValue(align-content) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(align-items) : stretch
+rect: style.getPropertyCSSValue(align-items) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(align-self) : stretch
+rect: style.getPropertyCSSValue(align-self) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(flex-direction) : row
+rect: style.getPropertyCSSValue(flex-direction) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(flex-wrap) : nowrap
+rect: style.getPropertyCSSValue(flex-wrap) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(justify-content) : flex-start
+rect: style.getPropertyCSSValue(justify-content) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-font-kerning) : auto
 rect: style.getPropertyCSSValue(-webkit-font-kerning) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-font-smoothing) : auto
@@ -384,8 +384,8 @@ rect: style.getPropertyValue(-webkit-mask-size) : auto
 rect: style.getPropertyCSSValue(-webkit-mask-size) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-nbsp-mode) : normal
 rect: style.getPropertyCSSValue(-webkit-nbsp-mode) : [object CSSPrimitiveValue]
-rect: style.getPropertyValue(-webkit-order) : 0
-rect: style.getPropertyCSSValue(-webkit-order) : [object CSSPrimitiveValue]
+rect: style.getPropertyValue(order) : 0
+rect: style.getPropertyCSSValue(order) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-perspective) : none
 rect: style.getPropertyCSSValue(-webkit-perspective) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-perspective-origin) : 0px 0px
@@ -796,18 +796,18 @@ g: style.getPropertyValue(-webkit-column-span) : none
 g: style.getPropertyCSSValue(-webkit-column-span) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-column-width) : auto
 g: style.getPropertyCSSValue(-webkit-column-width) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-align-content) : stretch
-g: style.getPropertyCSSValue(-webkit-align-content) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-align-items) : stretch
-g: style.getPropertyCSSValue(-webkit-align-items) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-align-self) : stretch
-g: style.getPropertyCSSValue(-webkit-align-self) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-flex-direction) : row
-g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-flex-wrap) : nowrap
-g: style.getPropertyCSSValue(-webkit-flex-wrap) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-justify-content) : flex-start
-g: style.getPropertyCSSValue(-webkit-justify-content) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(align-content) : stretch
+g: style.getPropertyCSSValue(align-content) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(align-items) : stretch
+g: style.getPropertyCSSValue(align-items) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(align-self) : stretch
+g: style.getPropertyCSSValue(align-self) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(flex-direction) : row
+g: style.getPropertyCSSValue(flex-direction) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(flex-wrap) : nowrap
+g: style.getPropertyCSSValue(flex-wrap) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(justify-content) : flex-start
+g: style.getPropertyCSSValue(justify-content) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-font-kerning) : auto
 g: style.getPropertyCSSValue(-webkit-font-kerning) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-font-smoothing) : auto
@@ -896,8 +896,8 @@ g: style.getPropertyValue(-webkit-mask-size) : auto
 g: style.getPropertyCSSValue(-webkit-mask-size) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-nbsp-mode) : normal
 g: style.getPropertyCSSValue(-webkit-nbsp-mode) : [object CSSPrimitiveValue]
-g: style.getPropertyValue(-webkit-order) : 0
-g: style.getPropertyCSSValue(-webkit-order) : [object CSSPrimitiveValue]
+g: style.getPropertyValue(order) : 0
+g: style.getPropertyCSSValue(order) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-perspective) : none
 g: style.getPropertyCSSValue(-webkit-perspective) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-perspective-origin) : 0px 0px
index 9aa1552..47fa788 100644 (file)
@@ -1,5 +1,5 @@
-PASS - "-webkit-flex" property for "row1" element at 0.5s saw something close to: 2,0,0
-PASS - "-webkit-flex" property for "column1" element at 0.5s saw something close to: 0.5,0,10
-PASS - "-webkit-flex" property for "negative1" element at 0.5s saw something close to: 1,0.5,75
-PASS - "-webkit-flex" property for "no-flex1" element at 0.5s saw something close to: 0.5,0,0
+PASS - "flex" property for "row1" element at 0.5s saw something close to: 2,0,0
+PASS - "flex" property for "column1" element at 0.5s saw something close to: 0.5,0,10
+PASS - "flex" property for "negative1" element at 0.5s saw something close to: 1,0.5,75
+PASS - "flex" property for "no-flex1" element at 0.5s saw something close to: 0.5,0,0
 
index dfd242a..61f456a 100644 (file)
 }
 
 #flex-row div {
-    -webkit-flex: 1 0 0px;
+    flex: 1 0 0px;
 }
 .final #row1 {
-    -webkit-flex: 3 0 0px;
+    flex: 3 0 0px;
 }
 
 #flex-column {
-    -webkit-flex-direction: column;
+    flex-direction: column;
 }
 #flex-column div {
-    -webkit-flex: 1 0 0px;
+    flex: 1 0 0px;
 }
 .final #column1 {
-    -webkit-flex: 0 0 20px;
+    flex: 0 0 20px;
 }
 
 #flex-negative div {
-    -webkit-flex: 1 1 50px;
+    flex: 1 1 50px;
 }
 .final #negative1 {
-    -webkit-flex: 1 100px;
+    flex: 1 100px;
 }
 
 #flex-no-flex div {
 
     const expectedValues = [
       // [time, element-id, property, expected-value, tolerance]
-      [0.5, 'row1', '-webkit-flex', [2, 0, 0], .5],
-      [0.5, 'column1', '-webkit-flex', [.5, 0, 10], 3],
-      [0.5, 'negative1', '-webkit-flex', [1, .5, 75], 3],
-      [0.5, 'no-flex1', '-webkit-flex', [.5, 0, 0], .4],
+      [0.5, 'row1', 'flex', [2, 0, 0], .5],
+      [0.5, 'column1', 'flex', [.5, 0, 10], 3],
+      [0.5, 'negative1', 'flex', [1, .5, 75], 3],
+      [0.5, 'no-flex1', 'flex', [.5, 0, 0], .4],
     ];
 
     function setupTest()
index 52d714d..7eed646 100644 (file)
@@ -1,3 +1,65 @@
+2014-09-12  Dean Jackson  <dino@apple.com>
+
+        Unprefix the flexbox CSS properties
+        https://bugs.webkit.org/show_bug.cgi?id=98420
+
+        Reviewed by Benjamin Poulain.
+
+        Remove the need for a "-webkit-" prefix on flexbox
+        and related properties. This includes:
+        - align-content
+        - align-items
+        - align-self
+        - flex-basis
+        - flex-direction
+        - flex-wrap
+        - flex-grow
+        - flex-shrink
+        - flex
+        - flex-flow
+        - justify
+        - order
+
+        ... as well as the display keyword values "flex" and
+        "inline-flex".
+
+        * css/CSSComputedStyleDeclaration.cpp:  Change names.
+        (WebCore::ComputedStyleExtractor::propertyValue):
+        * css/CSSParser.cpp: Ditto.
+        (WebCore::isValidKeywordPropertyAndValue):
+        (WebCore::isKeywordPropertyID):
+        (WebCore::CSSParser::parseValue):
+        (WebCore::CSSParser::parseFlex):
+        * css/CSSPrimitiveValueMappings.h: Since we need to still handle the old
+        keywords for display, this has added two new keywords.
+        (WebCore::CSSPrimitiveValue::CSSPrimitiveValue):
+        (WebCore::CSSPrimitiveValue::operator EDisplay): If the older keywords were used in
+        content, map them to the new value names.
+        * css/CSSPropertyNames.in: Add aliases for the prefixed properties.
+        * css/CSSValueKeywords.in: Add "flex" and "inline-flex".
+        * css/DeprecatedStyleBuilder.cpp: Change names.
+        (WebCore::DeprecatedStyleBuilder::DeprecatedStyleBuilder):
+        * css/StyleProperties.cpp: Change names.
+        (WebCore::StyleProperties::getPropertyValue):
+        (WebCore::StyleProperties::asText):
+        * css/StylePropertyShorthand.cpp: Rename shorthand methods to remove the prefix.
+        (WebCore::flexFlowShorthand):
+        (WebCore::flexShorthand):
+        (WebCore::shorthandForProperty):
+        (WebCore::matchingShorthandsForLonghand):
+        (WebCore::webkitFlexFlowShorthand): Deleted.
+        (WebCore::webkitFlexShorthand): Deleted.
+        * css/StylePropertyShorthand.h:
+        * css/StyleResolver.cpp:
+        (WebCore::equivalentBlockDisplay):
+        (WebCore::StyleResolver::applyProperty):
+        * page/animation/CSSPropertyAnimation.cpp: Change names.
+        (WebCore::PropertyWrapperFlex::PropertyWrapperFlex):
+        * rendering/RenderElement.cpp:
+        (WebCore::RenderElement::createFor): Handle the two new display values (the same way as
+        the old values).
+        * rendering/style/RenderStyleConstants.h: Add constants for the new display values.
+
 2014-09-12  Yusuke Suzuki  <utatane.tea@gmail.com>
 
         ASSERTION FAILED: e in WebCore::StyleResolver::adjustRenderStyle
index 7a68452..d229b18 100644 (file)
@@ -280,16 +280,16 @@ static const CSSPropertyID computedProperties[] = {
 #if ENABLE(DASHBOARD_SUPPORT)
     CSSPropertyWebkitDashboardRegion,
 #endif
-    CSSPropertyWebkitAlignContent,
-    CSSPropertyWebkitAlignItems,
-    CSSPropertyWebkitAlignSelf,
-    CSSPropertyWebkitFlexBasis,
-    CSSPropertyWebkitFlexGrow,
-    CSSPropertyWebkitFlexShrink,
-    CSSPropertyWebkitFlexDirection,
-    CSSPropertyWebkitFlexWrap,
-    CSSPropertyWebkitJustifyContent,
-    CSSPropertyWebkitJustifySelf,
+    CSSPropertyAlignContent,
+    CSSPropertyAlignItems,
+    CSSPropertyAlignSelf,
+    CSSPropertyFlexBasis,
+    CSSPropertyFlexGrow,
+    CSSPropertyFlexShrink,
+    CSSPropertyFlexDirection,
+    CSSPropertyFlexWrap,
+    CSSPropertyJustifyContent,
+    CSSPropertyJustifySelf,
     CSSPropertyWebkitFilter,
     CSSPropertyWebkitFontKerning,
     CSSPropertyWebkitFontSmoothing,
@@ -340,7 +340,7 @@ static const CSSPropertyID computedProperties[] = {
     CSSPropertyWebkitMaskSize,
     CSSPropertyWebkitMaskSourceType,
     CSSPropertyWebkitNbspMode,
-    CSSPropertyWebkitOrder,
+    CSSPropertyOrder,
 #if ENABLE(ACCELERATED_OVERFLOW_SCROLLING)
     CSSPropertyWebkitOverflowScrolling,
 #endif
@@ -2026,11 +2026,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())
@@ -2038,30 +2038,30 @@ 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 CSSPropertyWebkitJustifySelf: {
+        case CSSPropertyJustifySelf: {
             RefPtr<CSSValueList> result = CSSValueList::createSpaceSeparated();
             result->append(CSSPrimitiveValue::create(style->justifySelf()));
             if (style->justifySelf() >= JustifySelfCenter && style->justifySelfOverflowAlignment() != JustifySelfOverflowAlignmentDefault)
                 result->append(CSSPrimitiveValue::create(style->justifySelfOverflowAlignment()));
             return result.release();
         }
-        case CSSPropertyWebkitOrder:
+        case CSSPropertyOrder:
             return cssValuePool().createValue(style->order(), CSSPrimitiveValue::CSS_NUMBER);
         case CSSPropertyFloat:
             if (style->display() != NONE && style->hasOutOfFlowPosition())
index ffd7b8e..7c59241 100644 (file)
@@ -679,7 +679,7 @@ static inline bool isValidKeywordPropertyAndValue(CSSPropertyID propertyId, int
         // inline | block | list-item | 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 ENABLE(CSS_GRID_LAYOUT)
@@ -863,35 +863,35 @@ static inline bool isValidKeywordPropertyAndValue(CSSPropertyID propertyId, int
         if (valueID == CSSValueAuto || valueID == CSSValueBalance)
             return true;
         break;
-    case CSSPropertyWebkitAlignContent:
+    case CSSPropertyAlignContent:
         // FIXME: Per CSS alignment, this property should accept an optional <overflow-position>. We should share this parsing code with 'justify-self'.
         if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueSpaceBetween || valueID == CSSValueSpaceAround || valueID == CSSValueStretch)
             return true;
         break;
-    case CSSPropertyWebkitAlignItems:
+    case CSSPropertyAlignItems:
         // FIXME: Per CSS alignment, this property should accept the same arguments as 'justify-self' so we should share its parsing code.
         if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
             return true;
         break;
-    case CSSPropertyWebkitAlignSelf:
+    case CSSPropertyAlignSelf:
         // FIXME: Per CSS alignment, this property should accept the same arguments as 'justify-self' so we should share its parsing code.
         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:
         // FIXME: Per CSS alignment, this property should accept an optional <overflow-position>. We should share this parsing code with 'justify-self'.
         if (valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueSpaceBetween || valueID == CSSValueSpaceAround)
             return true;
         break;
-    case CSSPropertyWebkitJustifySelf:
+    case CSSPropertyJustifySelf:
         if (valueID == CSSValueAuto || valueID == CSSValueFlexStart || valueID == CSSValueFlexEnd || valueID == CSSValueCenter || valueID == CSSValueBaseline || valueID == CSSValueStretch)
             return true;
         break;
@@ -1105,12 +1105,12 @@ static inline bool isKeywordPropertyID(CSSPropertyID propertyId)
     case CSSPropertyWebkitColumnBreakInside:
     case CSSPropertyWebkitColumnFill:
     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:
@@ -2474,28 +2474,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(std::max<double>(std::numeric_limits<int>::min() + 2, value->fValue), static_cast<CSSPrimitiveValue::UnitTypes>(value->unit));
@@ -2615,7 +2615,7 @@ bool CSSParser::parseValue(CSSPropertyID propId, bool important)
         }
         return false;
     }
-    case CSSPropertyWebkitJustifySelf:
+    case CSSPropertyJustifySelf:
         return parseJustifySelf(propId, important);
 #if ENABLE(CSS_GRID_LAYOUT)
     case CSSPropertyWebkitGridAutoColumns:
@@ -2860,8 +2860,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
@@ -3011,12 +3011,12 @@ bool CSSParser::parseValue(CSSPropertyID propId, bool important)
     case CSSPropertyWebkitColumnBreakInside:
     case CSSPropertyWebkitColumnFill:
     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:
@@ -7364,9 +7364,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;
 }
 
index 32643ce..cc35664 100644 (file)
@@ -1355,10 +1355,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;
 #if ENABLE(CSS_GRID_LAYOUT)
     case GRID:
@@ -1383,6 +1385,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;
 }
 
index 14ec2d6..ef75ad6 100644 (file)
@@ -293,18 +293,30 @@ mix-blend-mode
 isolation
 #endif
 -webkit-filter
--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
--webkit-justify-self
+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
+justify-self
+-webkit-justify-self = justify-self
 -webkit-font-size-delta
 #if defined(ENABLE_CSS_GRID_LAYOUT) && ENABLE_CSS_GRID_LAYOUT
 -webkit-grid
@@ -377,7 +389,8 @@ isolation
 -webkit-min-logical-width
 -webkit-min-logical-height
 -webkit-nbsp-mode [Inherited]
--webkit-order
+order
+-webkit-order = order
 -webkit-padding-after
 -webkit-padding-before
 -webkit-padding-end
index b5d5c92..e62724e 100644 (file)
@@ -358,7 +358,9 @@ table-cell
 table-caption
 -webkit-box
 -webkit-inline-box
+flex
 -webkit-flex
+inline-flex
 -webkit-inline-flex
 -webkit-grid
 -webkit-inline-grid
index 4c2e110..695c493 100644 (file)
@@ -2521,16 +2521,16 @@ 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(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(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(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());
index 9080d07..6d2fdce 100644 (file)
@@ -153,10 +153,10 @@ String StyleProperties::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());
 #if ENABLE(CSS_GRID_LAYOUT)
     case CSSPropertyWebkitGridArea:
         return getShorthandValue(webkitGridAreaShorthand());
@@ -893,14 +893,14 @@ String StyleProperties::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:
index 0fbd97d..3cefed2 100644 (file)
@@ -333,16 +333,16 @@ StylePropertyShorthand webkitColumnRuleShorthand()
     return StylePropertyShorthand(CSSPropertyWebkitColumnRule, columnRuleProperties, WTF_ARRAY_LENGTH(columnRuleProperties));
 }
 
-StylePropertyShorthand webkitFlexFlowShorthand()
+StylePropertyShorthand flexFlowShorthand()
 {
-    static const CSSPropertyID flexFlowProperties[] = { CSSPropertyWebkitFlexDirection, CSSPropertyWebkitFlexWrap };
-    return StylePropertyShorthand(CSSPropertyWebkitFlexFlow, flexFlowProperties, WTF_ARRAY_LENGTH(flexFlowProperties));
+    static const CSSPropertyID flexFlowProperties[] = { CSSPropertyFlexDirection, CSSPropertyFlexWrap };
+    return StylePropertyShorthand(CSSPropertyFlexFlow, flexFlowProperties, WTF_ARRAY_LENGTH(flexFlowProperties));
 }
 
-StylePropertyShorthand webkitFlexShorthand()
+StylePropertyShorthand flexShorthand()
 {
-    static const CSSPropertyID flexProperties[] = { CSSPropertyWebkitFlexGrow, CSSPropertyWebkitFlexShrink, CSSPropertyWebkitFlexBasis };
-    return StylePropertyShorthand(CSSPropertyWebkitFlex, flexProperties, WTF_ARRAY_LENGTH(flexProperties));
+    static const CSSPropertyID flexProperties[] = { CSSPropertyFlexGrow, CSSPropertyFlexShrink, CSSPropertyFlexBasis };
+    return StylePropertyShorthand(CSSPropertyFlex, flexProperties, WTF_ARRAY_LENGTH(flexProperties));
 }
 
 StylePropertyShorthand webkitMarginCollapseShorthand()
@@ -573,10 +573,10 @@ 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();
 #if ENABLE(CSS_GRID_LAYOUT)
     case CSSPropertyWebkitGridArea:
         return webkitGridAreaShorthand();
@@ -770,13 +770,13 @@ Vector<StylePropertyShorthand> matchingShorthandsForLonghand(CSSPropertyID prope
     case CSSPropertyWebkitColumnRuleStyle:
     case CSSPropertyWebkitColumnRuleColor:
         return makeVector(webkitColumnRuleShorthand());
-    case CSSPropertyWebkitFlexGrow:
-    case CSSPropertyWebkitFlexShrink:
-    case CSSPropertyWebkitFlexBasis:
-        return makeVector(webkitFlexShorthand());
-    case CSSPropertyWebkitFlexDirection:
-    case CSSPropertyWebkitFlexWrap:
-        return makeVector(webkitFlexFlowShorthand());
+    case CSSPropertyFlexGrow:
+    case CSSPropertyFlexShrink:
+    case CSSPropertyFlexBasis:
+        return makeVector(flexShorthand());
+    case CSSPropertyFlexDirection:
+    case CSSPropertyFlexWrap:
+        return makeVector(flexFlowShorthand());
 #if ENABLE(CSS_GRID_LAYOUT)
     case CSSPropertyWebkitGridColumnStart:
     case CSSPropertyWebkitGridColumnEnd:
index 077643e..965e6b6 100644 (file)
@@ -81,6 +81,8 @@ StylePropertyShorthand borderStyleShorthand();
 StylePropertyShorthand borderTopShorthand();
 StylePropertyShorthand borderWidthShorthand();
 StylePropertyShorthand listStyleShorthand();
+StylePropertyShorthand flexFlowShorthand();
+StylePropertyShorthand flexShorthand();
 StylePropertyShorthand fontShorthand();
 StylePropertyShorthand heightShorthand();
 StylePropertyShorthand marginShorthand();
@@ -97,8 +99,6 @@ StylePropertyShorthand webkitBorderRadiusShorthand();
 StylePropertyShorthand webkitBorderStartShorthand();
 StylePropertyShorthand webkitColumnsShorthand();
 StylePropertyShorthand webkitColumnRuleShorthand();
-StylePropertyShorthand webkitFlexFlowShorthand();
-StylePropertyShorthand webkitFlexShorthand();
 StylePropertyShorthand webkitGridShorthand();
 StylePropertyShorthand webkitGridTemplateShorthand();
 StylePropertyShorthand webkitGridAreaShorthand();
index ad16ede..04caa8d 100644 (file)
@@ -1065,6 +1065,7 @@ static EDisplay equivalentBlockDisplay(EDisplay display, bool isFloating, bool s
     case TABLE:
     case BOX:
     case FLEX:
+    case WEBKIT_FLEX:
 #if ENABLE(CSS_GRID_LAYOUT)
     case GRID:
 #endif
@@ -1080,6 +1081,7 @@ static EDisplay equivalentBlockDisplay(EDisplay display, bool isFloating, bool s
     case INLINE_BOX:
         return BOX;
     case INLINE_FLEX:
+    case WEBKIT_INLINE_FLEX:
         return FLEX;
 #if ENABLE(CSS_GRID_LAYOUT)
     case INLINE_GRID:
@@ -2322,8 +2324,8 @@ void StyleResolver::applyProperty(CSSPropertyID id, CSSValue* value)
     case CSSPropertyWebkitBorderRadius:
     case CSSPropertyWebkitColumns:
     case CSSPropertyWebkitColumnRule:
-    case CSSPropertyWebkitFlex:
-    case CSSPropertyWebkitFlexFlow:
+    case CSSPropertyFlex:
+    case CSSPropertyFlexFlow:
 #if ENABLE(CSS_GRID_LAYOUT)
     case CSSPropertyWebkitGridTemplate:
     case CSSPropertyWebkitGridArea:
@@ -2837,7 +2839,7 @@ void StyleResolver::applyProperty(CSSPropertyID id, CSSValue* value)
         return;
     }
 #endif /* ENABLE(CSS_GRID_LAYOUT) */
-    case CSSPropertyWebkitJustifySelf: {
+    case CSSPropertyJustifySelf: {
         HANDLE_INHERIT_AND_INITIAL(justifySelf, JustifySelf);
         CSSPrimitiveValue* primitiveValue = toCSSPrimitiveValue(value);
         if (Pair* pairValue = primitiveValue->getPairValue()) {
@@ -3107,16 +3109,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:
index d10f41f..7f06cfe 100644 (file)
@@ -983,7 +983,8 @@ private:
 
 class PropertyWrapperFlex : public AnimationPropertyWrapperBase {
 public:
-    PropertyWrapperFlex() : AnimationPropertyWrapperBase(CSSPropertyWebkitFlex)
+    PropertyWrapperFlex()
+        : AnimationPropertyWrapperBase(CSSPropertyFlex)
     {
     }
 
index 199a645..cfa42bc 100644 (file)
@@ -187,6 +187,8 @@ RenderPtr<RenderElement> RenderElement::createFor(Element& element, PassRef<Rend
         return createRenderer<RenderDeprecatedFlexibleBox>(element, WTF::move(style));
     case FLEX:
     case INLINE_FLEX:
+    case WEBKIT_FLEX:
+    case WEBKIT_INLINE_FLEX:
         return createRenderer<RenderFlexibleBox>(element, WTF::move(style));
 #if ENABLE(CSS_GRID_LAYOUT)
     case GRID:
index c25e939..d118ae7 100644 (file)
@@ -474,7 +474,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,
 #if ENABLE(CSS_GRID_LAYOUT)
     GRID, INLINE_GRID,
 #endif