Split flex into flex-grow/flex-shrink/flex-basis
authortony@chromium.org <tony@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 28 Jun 2012 18:06:09 +0000 (18:06 +0000)
committertony@chromium.org <tony@chromium.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Thu, 28 Jun 2012 18:06:09 +0000 (18:06 +0000)
https://bugs.webkit.org/show_bug.cgi?id=86525

Reviewed by Ojan Vafai.

Source/WebCore:

Split flex into 3 separate properties per the spec:
http://dev.w3.org/csswg/css3-flexbox/#flex-components

Tests: css3/flexbox/flex-longhand-parsing.html
       css3/flexbox/flex-property-parsing.html: Updated test results.

* css/CSSComputedStyleDeclaration.cpp:
(WebCore): -webkit-flex is no longer enumerable.
(WebCore::CSSComputedStyleDeclaration::getPropertyCSSValue): Add new css property names and use
getCSSPropertyValuesForShorthandProperties for WebkitFlex. Also sort flex propery names.
* css/CSSParser.cpp:
(WebCore::isValidKeywordPropertyAndValue): Fix indent.
(WebCore::CSSParser::parseValue): Add parsing for new properties and handle -webkit-flex: none.
(WebCore::CSSParser::parseFlex): Switch to new names (positive -> grow, negative -> shrink,
preferred size -> basis) and assign to longhand properties.
* css/CSSParser.h:
* css/CSSProperty.cpp:
(WebCore::CSSProperty::isInheritedProperty): Add new properties.
* css/CSSPropertyNames.in: Add new properties.
* css/StyleBuilder.cpp:
(WebCore::StyleBuilder::StyleBuilder): Delete special handling of applying flex and just use shorthand handlers.
* css/StylePropertySet.cpp:
(WebCore::StylePropertySet::getPropertyValue): Add new shorthand.
(WebCore::StylePropertySet::asText):
* css/StylePropertyShorthand.cpp:
(WebCore::webkitFlexShorthand): Add new shorthand.
(WebCore::shorthandForProperty):
* css/StylePropertyShorthand.h:
* css/StyleResolver.cpp:
(WebCore::StyleResolver::collectMatchingRulesForList): Add to list of properties applied by StyleBuilder.
Handle initial and inherit for flex.

LayoutTests:

If -webkit-flex is set to none, when the user reads the value back out, it is
now 0 0 auto. 'none' is for convenience, not an actual value.

* css3/flexbox/flex-longhand-parsing-expected.txt:
* css3/flexbox/flex-longhand-parsing.html: Test flex-grow, flex-shrink and flex-basis.
* css3/flexbox/flex-property-parsing-expected.txt:
* css3/flexbox/flex-property-parsing.html: Update results for 'none'.
* fast/css/getComputedStyle/computed-style-expected.txt:
* fast/css/getComputedStyle/computed-style-without-renderer-expected.txt:
* fast/css/getComputedStyle/resources/property-names.js: Remove -webkit-flex since it's no longer enumerable.
* svg/css/getComputedStyle-basic-expected.txt:

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

20 files changed:
LayoutTests/ChangeLog
LayoutTests/css3/flexbox/flex-longhand-parsing-expected.txt [new file with mode: 0644]
LayoutTests/css3/flexbox/flex-longhand-parsing.html [new file with mode: 0644]
LayoutTests/css3/flexbox/flex-property-parsing-expected.txt
LayoutTests/css3/flexbox/flex-property-parsing.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/svg/css/getComputedStyle-basic-expected.txt
Source/WebCore/ChangeLog
Source/WebCore/css/CSSComputedStyleDeclaration.cpp
Source/WebCore/css/CSSParser.cpp
Source/WebCore/css/CSSParser.h
Source/WebCore/css/CSSProperty.cpp
Source/WebCore/css/CSSPropertyNames.in
Source/WebCore/css/StyleBuilder.cpp
Source/WebCore/css/StylePropertySet.cpp
Source/WebCore/css/StylePropertyShorthand.cpp
Source/WebCore/css/StylePropertyShorthand.h
Source/WebCore/css/StyleResolver.cpp

index e0f16cb..acb53a1 100644 (file)
@@ -1,3 +1,22 @@
+2012-06-28  Tony Chang  <tony@chromium.org>
+
+        Split flex into flex-grow/flex-shrink/flex-basis
+        https://bugs.webkit.org/show_bug.cgi?id=86525
+
+        Reviewed by Ojan Vafai.
+
+        If -webkit-flex is set to none, when the user reads the value back out, it is
+        now 0 0 auto. 'none' is for convenience, not an actual value.
+
+        * css3/flexbox/flex-longhand-parsing-expected.txt:
+        * css3/flexbox/flex-longhand-parsing.html: Test flex-grow, flex-shrink and flex-basis.
+        * css3/flexbox/flex-property-parsing-expected.txt:
+        * css3/flexbox/flex-property-parsing.html: Update results for 'none'.
+        * fast/css/getComputedStyle/computed-style-expected.txt:
+        * fast/css/getComputedStyle/computed-style-without-renderer-expected.txt:
+        * fast/css/getComputedStyle/resources/property-names.js: Remove -webkit-flex since it's no longer enumerable.
+        * svg/css/getComputedStyle-basic-expected.txt:
+
 2012-06-28  Andreas Kling  <kling@webkit.org>
 
         [WK2] platform/mac/editing/spelling/autocorrection-blockquote-crash.html fails.
diff --git a/LayoutTests/css3/flexbox/flex-longhand-parsing-expected.txt b/LayoutTests/css3/flexbox/flex-longhand-parsing-expected.txt
new file mode 100644 (file)
index 0000000..da9c6a0
--- /dev/null
@@ -0,0 +1,39 @@
+Tests the interaction between the -webkit-flex shorthand propery and the -webkit-flex-grow, -webkit-flex-shrink, and -webkit-flex-basis longhand properties.
+
+On success, you will see a series of "PASS" messages, followed by "TEST COMPLETE".
+
+
+PASS flexitem.style.webkitFlex is ""
+PASS getComputedStyle(flexitem).webkitFlex is "0 1 auto"
+PASS flexitem.style.webkitFlexGrow is "2"
+PASS getComputedStyle(flexitem).webkitFlexGrow is "2"
+PASS getComputedStyle(flexitem).webkitFlex is "2 1 auto"
+PASS flexitem.style.webkitFlexShrink is "3"
+PASS getComputedStyle(flexitem).webkitFlexShrink is "3"
+PASS getComputedStyle(flexitem).webkitFlex is "2 3 auto"
+PASS flexitem.style.webkitFlexBasis is "0px"
+PASS getComputedStyle(flexitem).webkitFlexBasis is "0px"
+PASS getComputedStyle(flexitem).webkitFlex is "2 3 0px"
+PASS flexitem.style.webkitFlexShrink is "0"
+PASS getComputedStyle(flexitem).webkitFlex is "2 0 0px"
+PASS flexitem.style.webkitFlexBasis is "50%"
+PASS getComputedStyle(flexitem).webkitFlexBasis is "50%"
+PASS getComputedStyle(flexitem).webkitFlex is "2 0 50%"
+PASS flexitem.style.webkitFlexBasis is "auto"
+PASS getComputedStyle(flexitem).webkitFlex is "2 0 auto"
+PASS flexitem.style.webkitFlex is "0 0 auto"
+PASS flexitem.style.webkitFlexGrow is "0"
+PASS flexitem.style.webkitFlexShrink is "0"
+PASS flexitem.style.webkitFlexBasis is "auto"
+PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
+PASS flexitem.style.webkitFlex is "1.5 0 auto"
+PASS getComputedStyle(flexitem).webkitFlex is "1.5 0 auto"
+PASS flexitem.style.webkitFlex is "3 1 0px"
+PASS flexitem.style.webkitFlexGrow is "3"
+PASS flexitem.style.webkitFlexShrink is "1"
+PASS flexitem.style.webkitFlexBasis is "0px"
+PASS getComputedStyle(flexitem).webkitFlex is "3 1 0px"
+PASS successfullyParsed is true
+
+TEST COMPLETE
+
diff --git a/LayoutTests/css3/flexbox/flex-longhand-parsing.html b/LayoutTests/css3/flexbox/flex-longhand-parsing.html
new file mode 100644 (file)
index 0000000..31bb43d
--- /dev/null
@@ -0,0 +1,68 @@
+<!DOCTYPE html>
+<html>
+<head>
+<script src="../../fast/js/resources/js-test-pre.js"></script>
+</head>
+<body>
+<div id="flexbox">
+    <div id="flexitem"></div>
+</div>
+<script>
+description('Tests the interaction between the -webkit-flex shorthand propery and the -webkit-flex-grow, -webkit-flex-shrink, and -webkit-flex-basis longhand properties.');
+
+var flexitem = document.getElementById("flexitem");
+
+// Test default value.
+shouldBeEqualToString('flexitem.style.webkitFlex', '');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 1 auto');
+
+flexitem.style.webkitFlexGrow = 2;
+shouldBeEqualToString('flexitem.style.webkitFlexGrow', '2');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlexGrow', '2');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '2 1 auto');
+
+flexitem.style.webkitFlexShrink = 3;
+shouldBeEqualToString('flexitem.style.webkitFlexShrink', '3');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlexShrink', '3');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '2 3 auto');
+
+flexitem.style.webkitFlexBasis = 0;
+shouldBeEqualToString('flexitem.style.webkitFlexBasis', '0px');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlexBasis', '0px');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '2 3 0px');
+
+flexitem.style.webkitFlexShrink = 0;
+shouldBeEqualToString('flexitem.style.webkitFlexShrink', '0');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '2 0 0px');
+
+flexitem.style.webkitFlexBasis = '50%';
+shouldBeEqualToString('flexitem.style.webkitFlexBasis', '50%');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlexBasis', '50%');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '2 0 50%');
+
+flexitem.style.webkitFlexBasis = 'auto';
+shouldBeEqualToString('flexitem.style.webkitFlexBasis', 'auto');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '2 0 auto');
+
+flexitem.style.webkitFlex = 'none';
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
+shouldBeEqualToString('flexitem.style.webkitFlexGrow', '0');
+shouldBeEqualToString('flexitem.style.webkitFlexShrink', '0');
+shouldBeEqualToString('flexitem.style.webkitFlexBasis', 'auto');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
+
+flexitem.style.webkitFlexGrow = 1.5;
+shouldBeEqualToString('flexitem.style.webkitFlex', '1.5 0 auto');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '1.5 0 auto');
+
+flexitem.style.webkitFlex = 3;
+shouldBeEqualToString('flexitem.style.webkitFlex', '3 1 0px');
+shouldBeEqualToString('flexitem.style.webkitFlexGrow', '3');
+shouldBeEqualToString('flexitem.style.webkitFlexShrink', '1');
+shouldBeEqualToString('flexitem.style.webkitFlexBasis', '0px');
+shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '3 1 0px');
+
+</script>
+<script src="../../fast/js/resources/js-test-post.js"></script>
+</body>
+</html>
index 4a6d882..63c8b80 100644 (file)
@@ -23,7 +23,7 @@ PASS flexitem.style.webkitFlex is "0 1 2em"
 PASS getComputedStyle(flexitem).webkitFlex is "0 1 32px"
 PASS flexitem.style.webkitFlex is "0 1 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "0 1 0px"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
 PASS flexitem.style.webkitFlex is "0 0 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 0px"
@@ -43,17 +43,17 @@ PASS flexitem.style.webkitFlex is "4 1 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "4 1 0px"
 PASS flexitem.style.webkitFlex is "0 1 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "0 1 0px"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
 PASS flexitem.style.webkitFlex is "1 2 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "1 2 0px"
@@ -77,37 +77,37 @@ PASS flexitem.style.webkitFlex is "0 1 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "0 1 0px"
 PASS flexitem.style.webkitFlex is "0 0 0px"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 0px"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
-PASS flexitem.style.webkitFlex is "none"
+PASS flexitem.style.webkitFlex is "0 0 auto"
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
 PASS flexitem.style.webkitFlex is "initial"
 PASS getComputedStyle(flexitem).webkitFlex is "0 1 auto"
-PASS flexitem.style.webkitFlex is "none"
+FAIL flexitem.style.webkitFlex should be 0 0 auto. Was initial.
 PASS getComputedStyle(flexitem).webkitFlex is "0 0 auto"
 PASS successfullyParsed is true
 
index 638e56a..3f301dd 100644 (file)
@@ -57,7 +57,7 @@ shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 1 0px');
 
 flexitem.style.webkitFlex = 'none';
 flexitem.style.webkitFlex = '-2'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 0';
@@ -98,27 +98,27 @@ shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 1 0px');
 
 flexitem.style.webkitFlex = 'none';
 flexitem.style.webkitFlex = '-1 5'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1 -1'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '-1 -1'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = 'auto 2em'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '2px 4px'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0px 0px'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1 2 0';
@@ -167,59 +167,59 @@ shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 0px');
 
 flexitem.style.webkitFlex = 'none';
 flexitem.style.webkitFlex = '1 2 3'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 2 3'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1 0 3'; // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 0 1';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1 -2 3px';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1 2px 3px';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1 2px auto';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0px 0px 0';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 0 0 0';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 0 0px 0';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 0 0px 0px';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '0 0 0px 0';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1, 2, 3px';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = '1,';  // Invalid, return previous value.
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 
 flexitem.style.webkitFlex = 'initial';
@@ -227,7 +227,8 @@ shouldBeEqualToString('flexitem.style.webkitFlex', 'initial');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 1 auto');
 
 flexitem.style.webkitFlex = 'none';
-shouldBeEqualToString('flexitem.style.webkitFlex', 'none');
+// FIXME: This test case is failing. https://bugs.webkit.org/show_bug.cgi?id=90020
+shouldBeEqualToString('flexitem.style.webkitFlex', '0 0 auto');
 shouldBeEqualToString('getComputedStyle(flexitem).webkitFlex', '0 0 auto');
 </script>
 <script src="../../fast/js/resources/js-test-post.js"></script>
index 8119ff8..59e3829 100644 (file)
@@ -146,7 +146,6 @@ zoom: 1;
 -webkit-align-content: stretch;
 -webkit-align-items: stretch;
 -webkit-align-self: stretch;
--webkit-flex: 0 1 auto;
 -webkit-flex-direction: row;
 -webkit-flex-wrap: none;
 -webkit-justify-content: flex-start;
index 9a6d65b..fb13fc3 100644 (file)
@@ -145,7 +145,6 @@ zoom: 1
 -webkit-align-content: stretch
 -webkit-align-items: stretch
 -webkit-align-self: stretch
--webkit-flex: 0 1 auto
 -webkit-flex-direction: row
 -webkit-flex-wrap: none
 -webkit-justify-content: flex-start
index 05dbc98..5098bdc 100644 (file)
@@ -44,7 +44,6 @@ var propertiesToTest = {
     "-webkit-column-rule-width": true,
     "-webkit-column-span": true,
     "-webkit-column-width": true,
-    "-webkit-flex": true,
     "-webkit-flex-direction": true,
     "-webkit-flex-wrap": true,
     "-webkit-font-kerning": true,
index ff9b317..2e1900a 100644 (file)
@@ -290,8 +290,6 @@ 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) : 0 1 auto
-rect: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
 rect: style.getPropertyValue(-webkit-flex-direction) : row
 rect: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
 rect: style.getPropertyValue(-webkit-flex-wrap) : none
@@ -794,8 +792,6 @@ 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) : 0 1 auto
-g: style.getPropertyCSSValue(-webkit-flex) : [object CSSValueList]
 g: style.getPropertyValue(-webkit-flex-direction) : row
 g: style.getPropertyCSSValue(-webkit-flex-direction) : [object CSSPrimitiveValue]
 g: style.getPropertyValue(-webkit-flex-wrap) : none
index c1307b0..cd55d95 100644 (file)
@@ -1,3 +1,42 @@
+2012-06-28  Tony Chang  <tony@chromium.org>
+
+        Split flex into flex-grow/flex-shrink/flex-basis
+        https://bugs.webkit.org/show_bug.cgi?id=86525
+
+        Reviewed by Ojan Vafai.
+
+        Split flex into 3 separate properties per the spec:
+        http://dev.w3.org/csswg/css3-flexbox/#flex-components
+
+        Tests: css3/flexbox/flex-longhand-parsing.html
+               css3/flexbox/flex-property-parsing.html: Updated test results.
+
+        * css/CSSComputedStyleDeclaration.cpp:
+        (WebCore): -webkit-flex is no longer enumerable.
+        (WebCore::CSSComputedStyleDeclaration::getPropertyCSSValue): Add new css property names and use
+        getCSSPropertyValuesForShorthandProperties for WebkitFlex. Also sort flex propery names.
+        * css/CSSParser.cpp:
+        (WebCore::isValidKeywordPropertyAndValue): Fix indent.
+        (WebCore::CSSParser::parseValue): Add parsing for new properties and handle -webkit-flex: none.
+        (WebCore::CSSParser::parseFlex): Switch to new names (positive -> grow, negative -> shrink,
+        preferred size -> basis) and assign to longhand properties.
+        * css/CSSParser.h:
+        * css/CSSProperty.cpp:
+        (WebCore::CSSProperty::isInheritedProperty): Add new properties.
+        * css/CSSPropertyNames.in: Add new properties.
+        * css/StyleBuilder.cpp:
+        (WebCore::StyleBuilder::StyleBuilder): Delete special handling of applying flex and just use shorthand handlers.
+        * css/StylePropertySet.cpp:
+        (WebCore::StylePropertySet::getPropertyValue): Add new shorthand.
+        (WebCore::StylePropertySet::asText):
+        * css/StylePropertyShorthand.cpp:
+        (WebCore::webkitFlexShorthand): Add new shorthand.
+        (WebCore::shorthandForProperty):
+        * css/StylePropertyShorthand.h:
+        * css/StyleResolver.cpp:
+        (WebCore::StyleResolver::collectMatchingRulesForList): Add to list of properties applied by StyleBuilder.
+        Handle initial and inherit for flex.
+
 2012-06-28  Kalev Lember  <kalevlember@gmail.com>
 
         [GTK][Win]: Fix plugin drawing to an offscreen buffer
index 870dee4..d19e554 100644 (file)
@@ -237,7 +237,9 @@ static const CSSPropertyID computedProperties[] = {
     CSSPropertyWebkitAlignContent,
     CSSPropertyWebkitAlignItems,
     CSSPropertyWebkitAlignSelf,
-    CSSPropertyWebkitFlex,
+    CSSPropertyWebkitFlexBasis,
+    CSSPropertyWebkitFlexGrow,
+    CSSPropertyWebkitFlexShrink,
     CSSPropertyWebkitFlexDirection,
     CSSPropertyWebkitFlexWrap,
     CSSPropertyWebkitJustifyContent,
@@ -1650,25 +1652,8 @@ PassRefPtr<CSSValue> CSSComputedStyleDeclaration::getPropertyCSSValue(CSSPropert
         case CSSPropertyEmptyCells:
             return cssValuePool().createValue(style->emptyCells());
 #if ENABLE(CSS3_FLEXBOX)
-        case CSSPropertyWebkitFlex: {
-            RefPtr<CSSValueList> list = CSSValueList::createSpaceSeparated();
-            list->append(cssValuePool().createValue(style->flexGrow()));
-            list->append(cssValuePool().createValue(style->flexShrink()));
-
-            Length flexBasis = style->flexBasis();
-            if (flexBasis.isAuto())
-                list->append(cssValuePool().createIdentifierValue(CSSValueAuto));
-            else if (flexBasis.isPercent())
-                list->append(cssValuePool().createValue(flexBasis.value(), CSSPrimitiveValue::CSS_PERCENTAGE));
-            else
-                list->append(cssValuePool().createValue(flexBasis.value(), CSSPrimitiveValue::CSS_PX));
-
-            return list.release();
-        }
-        case CSSPropertyWebkitOrder:
-            return cssValuePool().createValue(style->order());
-        case CSSPropertyWebkitJustifyContent:
-            return cssValuePool().createValue(style->justifyContent());
+        case CSSPropertyWebkitAlignContent:
+            return cssValuePool().createValue(style->alignContent());
         case CSSPropertyWebkitAlignItems:
             return cssValuePool().createValue(style->alignItems());
         case CSSPropertyWebkitAlignSelf:
@@ -1678,18 +1663,24 @@ PassRefPtr<CSSValue> CSSComputedStyleDeclaration::getPropertyCSSValue(CSSPropert
                 return cssValuePool().createValue(AlignStretch);
             }
             return cssValuePool().createValue(style->alignSelf());
+        case CSSPropertyWebkitFlex:
+            return getCSSPropertyValuesForShorthandProperties(webkitFlexShorthand());
+        case CSSPropertyWebkitFlexBasis:
+            return cssValuePool().createValue(style->flexBasis());
         case CSSPropertyWebkitFlexDirection:
             return cssValuePool().createValue(style->flexDirection());
+        case CSSPropertyWebkitFlexFlow:
+            return getCSSPropertyValuesForShorthandProperties(webkitFlexFlowShorthand());
+        case CSSPropertyWebkitFlexGrow:
+            return cssValuePool().createValue(style->flexGrow());
+        case CSSPropertyWebkitFlexShrink:
+            return cssValuePool().createValue(style->flexShrink());
         case CSSPropertyWebkitFlexWrap:
             return cssValuePool().createValue(style->flexWrap());
-        case CSSPropertyWebkitAlignContent:
-            return cssValuePool().createValue(style->alignContent());
-        case CSSPropertyWebkitFlexFlow: {
-            RefPtr<CSSValueList> list = CSSValueList::createSpaceSeparated();
-            list->append(cssValuePool().createValue(style->flexDirection()));
-            list->append(cssValuePool().createValue(style->flexWrap()));
-            return list.release();
-        }
+        case CSSPropertyWebkitJustifyContent:
+            return cssValuePool().createValue(style->justifyContent());
+        case CSSPropertyWebkitOrder:
+            return cssValuePool().createValue(style->order());
 #endif
         case CSSPropertyFloat:
             return cssValuePool().createValue(style->floating());
index cc96a2d..c386891 100644 (file)
@@ -716,7 +716,7 @@ static inline bool isValidKeywordPropertyAndValue(CSSPropertyID propertyId, int
         break;
     case CSSPropertyWebkitFlexDirection:
         if (valueID == CSSValueRow || valueID == CSSValueRowReverse || valueID == CSSValueColumn || valueID == CSSValueColumnReverse)
-                return true;
+            return true;
         break;
     case CSSPropertyWebkitFlexWrap:
         if (valueID == CSSValueNone || valueID == CSSValueWrap || valueID == CSSValueWrapReverse)
@@ -2275,11 +2275,26 @@ bool CSSParser::parseValue(CSSPropertyID propId, bool important)
         break;
 #endif
 #if ENABLE(CSS3_FLEXBOX)
-    case CSSPropertyWebkitFlex:
-        if (id == CSSValueNone)
+    case CSSPropertyWebkitFlex: {
+        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);
+            return true;
+        }
+        return parseFlex(m_valueList.get(), important);
+    }
+    case CSSPropertyWebkitFlexBasis:
+        // FIXME: Support intrinsic dimensions too.
+        if (id == CSSValueAuto)
             validPrimitive = true;
         else
-            parsedValue = parseFlex(m_valueList.get());
+            validPrimitive = (!id && validUnit(value, FLength | FPercent | FNonNeg));
+        break;
+    case CSSPropertyWebkitFlexGrow:
+    case CSSPropertyWebkitFlexShrink:
+        validPrimitive = validUnit(value, FNumber | FNonNeg);
         break;
     case CSSPropertyWebkitOrder:
         validPrimitive = validUnit(value, FNumber);
@@ -5780,49 +5795,48 @@ bool CSSParser::parseReflect(CSSPropertyID propId, bool important)
 
 #if ENABLE(CSS3_FLEXBOX)
 
-PassRefPtr<CSSValue> CSSParser::parseFlex(CSSParserValueList* args)
+bool CSSParser::parseFlex(CSSParserValueList* args, bool important)
 {
     if (!args || !args->size() || args->size() > 3)
-        return 0;
+        return false;
     static const double unsetValue = -1;
-    double positiveFlex = unsetValue;
-    double negativeFlex = unsetValue;
-    RefPtr<CSSPrimitiveValue> preferredSize;
+    double flexGrow = unsetValue;
+    double flexShrink = unsetValue;
+    RefPtr<CSSPrimitiveValue> flexBasis;
 
     while (CSSParserValue* arg = args->current()) {
         if (validUnit(arg, FNumber | FNonNeg)) {
-            if (positiveFlex == unsetValue)
-                positiveFlex = arg->fValue;
-            else if (negativeFlex == unsetValue)
-                negativeFlex = arg->fValue;
+            if (flexGrow == unsetValue)
+                flexGrow = arg->fValue;
+            else if (flexShrink == unsetValue)
+                flexShrink = arg->fValue;
             else if (!arg->fValue) {
-                // flex() only allows a preferred size of 0 (sans units) if the positive and negative flex values have already been set.
-                preferredSize = cssValuePool().createValue(0, CSSPrimitiveValue::CSS_PX);
+                // flex only allows a basis of 0 (sans units) if flex-grow and flex-shrink values have already been set.
+                flexBasis = cssValuePool().createValue(0, CSSPrimitiveValue::CSS_PX);
             } else {
-                // We only allow 3 numbers without units if the last value is 0. E.g., flex(1 1 1) is invalid.
-                return 0;
+                // We only allow 3 numbers without units if the last value is 0. E.g., flex:1 1 1 is invalid.
+                return false;
             }
-        } else if (!preferredSize && (arg->id == CSSValueAuto || validUnit(arg, FLength | FPercent | FNonNeg)))
-            preferredSize = parseValidPrimitive(arg->id, arg);
+        } else if (!flexBasis && (arg->id == CSSValueAuto || validUnit(arg, FLength | FPercent | FNonNeg)))
+            flexBasis = parseValidPrimitive(arg->id, arg);
         else {
-            // Not a valid arg for flex().
-            return 0;
+            // Not a valid arg for flex.
+            return false;
         }
         args->next();
     }
 
-    if (positiveFlex == unsetValue)
-        positiveFlex = 0;
-    if (negativeFlex == unsetValue)
-        negativeFlex = 1;
-    if (!preferredSize)
-        preferredSize = cssValuePool().createValue(0, CSSPrimitiveValue::CSS_PX);
+    if (flexGrow == unsetValue)
+        flexGrow = 0;
+    if (flexShrink == unsetValue)
+        flexShrink = 1;
+    if (!flexBasis)
+        flexBasis = cssValuePool().createValue(0, CSSPrimitiveValue::CSS_PX);
 
-    RefPtr<CSSValueList> flex = CSSValueList::createSpaceSeparated();
-    flex->append(cssValuePool().createValue(clampToFloat(positiveFlex), CSSPrimitiveValue::CSS_NUMBER));
-    flex->append(cssValuePool().createValue(clampToFloat(negativeFlex), CSSPrimitiveValue::CSS_NUMBER));
-    flex->append(preferredSize);
-    return flex;
+    addProperty(CSSPropertyWebkitFlexGrow, cssValuePool().createValue(clampToFloat(flexGrow), CSSPrimitiveValue::CSS_NUMBER), important);
+    addProperty(CSSPropertyWebkitFlexShrink, cssValuePool().createValue(clampToFloat(flexShrink), CSSPrimitiveValue::CSS_NUMBER), important);
+    addProperty(CSSPropertyWebkitFlexBasis, flexBasis, important);
+    return true;
 }
 
 #endif
index 625e1e0..785793f 100644 (file)
@@ -189,7 +189,7 @@ public:
 
     bool parseReflect(CSSPropertyID, bool important);
 
-    PassRefPtr<CSSValue> parseFlex(CSSParserValueList* args);
+    bool parseFlex(CSSParserValueList* args, bool important);
 
     // Image generators
     bool parseCanvas(CSSParserValueList*, RefPtr<CSSValue>&);
index 7a3d715..01519f3 100644 (file)
@@ -552,8 +552,11 @@ bool CSSProperty::isInheritedProperty(CSSPropertyID propertyID)
     case CSSPropertyWebkitAlignItems:
     case CSSPropertyWebkitAlignSelf:
     case CSSPropertyWebkitFlex:
+    case CSSPropertyWebkitFlexBasis:
     case CSSPropertyWebkitFlexDirection:
     case CSSPropertyWebkitFlexFlow:
+    case CSSPropertyWebkitFlexGrow:
+    case CSSPropertyWebkitFlexShrink:
     case CSSPropertyWebkitFlexWrap:
     case CSSPropertyWebkitJustifyContent:
     case CSSPropertyWebkitOrder:
index caaaf0e..1af3925 100644 (file)
@@ -268,8 +268,11 @@ z-index
 -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
 #endif
index c2b1240..670322d 100644 (file)
@@ -1716,70 +1716,6 @@ public:
     }
 };
 
-class ApplyPropertyFlex {
-public:
-    static void applyInheritValue(StyleResolver* styleResolver)
-    {
-        ApplyPropertyDefaultBase<float, &RenderStyle::flexGrow, float, &RenderStyle::setFlexGrow, float, &RenderStyle::initialFlexGrow>::applyInheritValue(styleResolver);
-        ApplyPropertyDefaultBase<float, &RenderStyle::flexShrink, float, &RenderStyle::setFlexShrink, float, &RenderStyle::initialFlexShrink>::applyInheritValue(styleResolver);
-        ApplyPropertyDefaultBase<Length, &RenderStyle::flexBasis, Length, &RenderStyle::setFlexBasis, Length, &RenderStyle::initialFlexBasis>::applyInheritValue(styleResolver);
-    }
-
-    static void applyInitialValue(StyleResolver* styleResolver)
-    {
-        styleResolver->style()->setFlexGrow(RenderStyle::initialFlexGrow());
-        styleResolver->style()->setFlexShrink(RenderStyle::initialFlexShrink());
-        styleResolver->style()->setFlexBasis(RenderStyle::initialFlexBasis());
-    }
-
-    static void applyValue(StyleResolver* styleResolver, CSSValue* value)
-    {
-        if (value->isPrimitiveValue()) {
-            CSSPrimitiveValue* primitiveValue = static_cast<CSSPrimitiveValue*>(value);
-            if (primitiveValue->getIdent() == CSSValueNone) {
-                styleResolver->style()->setFlexGrow(0);
-                styleResolver->style()->setFlexShrink(0);
-                styleResolver->style()->setFlexBasis(Length(Auto));
-            }
-            return;
-        }
-
-        if (!value->isValueList())
-            return;
-        CSSValueList* valueList = static_cast<CSSValueList*>(value);
-        if (valueList->length() != 3)
-            return;
-
-        float flexValue = 0;
-        if (!getFlexValue(valueList->itemWithoutBoundsCheck(0), flexValue))
-            return;
-        styleResolver->style()->setFlexGrow(flexValue);
-
-        if (!getFlexValue(valueList->itemWithoutBoundsCheck(1), flexValue))
-            return;
-        styleResolver->style()->setFlexShrink(flexValue);
-
-        ApplyPropertyLength<&RenderStyle::flexBasis, &RenderStyle::setFlexBasis, &RenderStyle::initialFlexBasis, AutoEnabled>::applyValue(styleResolver, valueList->itemWithoutBoundsCheck(2));
-    }
-
-    static PropertyHandler createHandler()
-    {
-        return PropertyHandler(&applyInheritValue, &applyInitialValue, &applyValue);
-    }
-private:
-    static bool getFlexValue(CSSValue* value, float& flexValue)
-    {
-        if (!value->isPrimitiveValue())
-            return false;
-        CSSPrimitiveValue* primitiveValue = static_cast<CSSPrimitiveValue*>(value);
-        if (!primitiveValue->isNumber())
-            return false;
-        flexValue = primitiveValue->getFloatValue();
-        return true;
-    }
-
-};
-
 #if ENABLE(CSS_EXCLUSIONS)
 template <CSSWrapShape* (RenderStyle::*getterFunction)() const, void (RenderStyle::*setterFunction)(PassRefPtr<CSSWrapShape>), CSSWrapShape* (*initialFunction)()>
 class ApplyPropertyWrapShape {
@@ -2030,9 +1966,10 @@ StyleBuilder::StyleBuilder()
     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(CSSPropertyWebkitFlex, ApplyPropertyFlex::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(CSSPropertyWebkitFlexFlow, ApplyPropertyExpanding<SuppressValue, CSSPropertyWebkitFlexDirection, CSSPropertyWebkitFlexWrap>::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<float, &RenderStyle::order, float, &RenderStyle::setOrder, float, &RenderStyle::initialOrder>::createHandler());
index 60afd5e..7fc836f 100644 (file)
@@ -162,6 +162,8 @@ String StylePropertySet::getPropertyValue(CSSPropertyID propertyID) const
     case CSSPropertyBorderStyle:
         return get4Values(borderStyleShorthand());
 #if ENABLE(CSS3_FLEXBOX)
+    case CSSPropertyWebkitFlex:
+        return getShorthandValue(webkitFlexShorthand());
     case CSSPropertyWebkitFlexFlow:
         return getShorthandValue(webkitFlexFlowShorthand());
 #endif
@@ -755,6 +757,11 @@ String StylePropertySet::asText() const
         case CSSPropertyWebkitFlexWrap:
             shorthandPropertyID = CSSPropertyWebkitFlexFlow;
             break;
+        case CSSPropertyWebkitFlexBasis:
+        case CSSPropertyWebkitFlexGrow:
+        case CSSPropertyWebkitFlexShrink:
+            shorthandPropertyID = CSSPropertyWebkitFlex;
+            break;
 #endif
         case CSSPropertyWebkitMaskPositionX:
         case CSSPropertyWebkitMaskPositionY:
index 2265248..045bd24 100644 (file)
@@ -314,6 +314,13 @@ const StylePropertyShorthand& webkitFlexFlowShorthand()
     DEFINE_STATIC_LOCAL(StylePropertyShorthand, webkitFlexFlowLonghands, (flexFlowProperties, WTF_ARRAY_LENGTH(flexFlowProperties)));
     return webkitFlexFlowLonghands;
 }
+
+const StylePropertyShorthand& webkitFlexShorthand()
+{
+    static const CSSPropertyID flexProperties[] = { CSSPropertyWebkitFlexGrow, CSSPropertyWebkitFlexShrink, CSSPropertyWebkitFlexBasis };
+    DEFINE_STATIC_LOCAL(StylePropertyShorthand, webkitFlexLonghands, (flexProperties, WTF_ARRAY_LENGTH(flexProperties)));
+    return webkitFlexLonghands;
+}
 #endif
 
 const StylePropertyShorthand& webkitMarginCollapseShorthand()
@@ -480,6 +487,8 @@ const StylePropertyShorthand& shorthandForProperty(CSSPropertyID propertyID)
     case CSSPropertyWebkitColumnRule:
         return webkitColumnRuleShorthand();
 #if ENABLE(CSS3_FLEXBOX)
+    case CSSPropertyWebkitFlex:
+        return webkitFlexShorthand();
     case CSSPropertyWebkitFlexFlow:
         return webkitFlexFlowShorthand();
 #endif
index a058538..ee331c7 100644 (file)
@@ -88,6 +88,7 @@ const StylePropertyShorthand& webkitColumnsShorthand();
 const StylePropertyShorthand& webkitColumnRuleShorthand();
 #if ENABLE(CSS3_FLEXBOX)
 const StylePropertyShorthand& webkitFlexFlowShorthand();
+const StylePropertyShorthand& webkitFlexShorthand();
 #endif
 const StylePropertyShorthand& webkitMarginCollapseShorthand();
 const StylePropertyShorthand& webkitMarqueeShorthand();
index 7e857ad..df4a7c0 100644 (file)
@@ -3983,6 +3983,19 @@ void StyleResolver::applyProperty(CSSPropertyID id, CSSValue* value)
         return;
     }
 #endif
+#if ENABLE(CSS3_FLEXBOX)
+    case CSSPropertyWebkitFlex:
+        if (isInherit) {
+            m_style->setFlexGrow(m_parentStyle->flexGrow());
+            m_style->setFlexShrink(m_parentStyle->flexShrink());
+            m_style->setFlexBasis(m_parentStyle->flexBasis());
+        } else if (isInitial) {
+            m_style->setFlexGrow(RenderStyle::initialFlexGrow());
+            m_style->setFlexShrink(RenderStyle::initialFlexShrink());
+            m_style->setFlexBasis(RenderStyle::initialFlexBasis());
+        }
+        return;
+#endif
     case CSSPropertyInvalid:
         return;
     // Directional properties are resolved by resolveDirectionAwareProperty() before the switch.
@@ -4312,9 +4325,11 @@ void StyleResolver::applyProperty(CSSPropertyID id, CSSValue* value)
     case CSSPropertyWebkitAlignContent:
     case CSSPropertyWebkitAlignItems:
     case CSSPropertyWebkitAlignSelf:
-    case CSSPropertyWebkitFlex:
+    case CSSPropertyWebkitFlexBasis:
     case CSSPropertyWebkitFlexDirection:
     case CSSPropertyWebkitFlexFlow:
+    case CSSPropertyWebkitFlexGrow:
+    case CSSPropertyWebkitFlexShrink:
     case CSSPropertyWebkitFlexWrap:
     case CSSPropertyWebkitJustifyContent:
     case CSSPropertyWebkitOrder: