Add style property for flex-basis

Add the style property for flex-basis. The property should allow all
values acceptable for `width`|`height` with the addition of `content`.

components/layout/incremental.rs

@@ -218,7 +218,9 @@ pub fn compute_damage(old: Option<&Arc<ServoComputedValues>>, new: &ServoCompute
         get_inheritedtable.border_collapse,
         get_inheritedtable.border_spacing,
         get_column.column_gap,
-        get_position.flex_direction
+        get_position.flex_direction,
+        get_position.flex_basis,
+        get_position.order
     ]) || add_if_not_equal!(old, new, damage,
                             [ REPAINT, STORE_OVERFLOW, REFLOW_OUT_OF_FLOW ], [
         get_position.top, get_position.left,

components/script/dom/webidls/CSSStyleDeclaration.webidl

@@ -310,5 +310,7 @@ partial interface CSSStyleDeclaration {
 
   [SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexDirection;
   [SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-direction;
+  [SetterThrows, TreatNullAs=EmptyString] attribute DOMString flexBasis;
+  [SetterThrows, TreatNullAs=EmptyString] attribute DOMString flex-basis;
   [SetterThrows, TreatNullAs=EmptyString] attribute DOMString order;
 };

components/style/properties/properties.mako.rs

@@ -4360,6 +4360,9 @@ pub mod longhands {
         }
     </%helpers:longhand>
 
+    ${helpers.predefined_type("flex-basis", "LengthOrPercentageOrAutoOrContent",
+                              "computed::LengthOrPercentageOrAutoOrContent::Auto")}
+
     ${helpers.single_keyword("flex-wrap", "nowrap wrap wrap-reverse", products="gecko")}
 
     // SVG 1.1 (Second Edition)

components/style/values.rs

@@ -1050,6 +1050,50 @@ pub mod specified {
         }
     }
 
+    #[derive(Clone, PartialEq, Copy, Debug, HeapSizeOf)]
+    pub enum LengthOrPercentageOrAutoOrContent {
+        Length(Length),
+        Percentage(Percentage),
+        Calc(CalcLengthOrPercentage),
+        Auto,
+        Content
+    }
+
+    impl ToCss for LengthOrPercentageOrAutoOrContent {
+        fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
+            match *self {
+                LengthOrPercentageOrAutoOrContent::Length(len) => len.to_css(dest),
+                LengthOrPercentageOrAutoOrContent::Percentage(perc) => perc.to_css(dest),
+                LengthOrPercentageOrAutoOrContent::Auto => dest.write_str("auto"),
+                LengthOrPercentageOrAutoOrContent::Content => dest.write_str("content"),
+                LengthOrPercentageOrAutoOrContent::Calc(calc) => calc.to_css(dest),
+            }
+        }
+    }
+
+    impl LengthOrPercentageOrAutoOrContent {
+        pub fn parse(input: &mut Parser) -> Result<LengthOrPercentageOrAutoOrContent, ()> {
+            let context = AllowedNumericType::NonNegative;
+            match try!(input.next()) {
+                Token::Dimension(ref value, ref unit) if context.is_ok(value.value) =>
+                    Length::parse_dimension(value.value, unit).map(LengthOrPercentageOrAutoOrContent::Length),
+                Token::Percentage(ref value) if context.is_ok(value.unit_value) =>
+                    Ok(LengthOrPercentageOrAutoOrContent::Percentage(Percentage(value.unit_value))),
+                Token::Number(ref value) if value.value == 0. =>
+                    Ok(LengthOrPercentageOrAutoOrContent::Length(Length::Absolute(Au(0)))),
+                Token::Ident(ref value) if value.eq_ignore_ascii_case("auto") =>
+                    Ok(LengthOrPercentageOrAutoOrContent::Auto),
+                Token::Ident(ref value) if value.eq_ignore_ascii_case("content") =>
+                    Ok(LengthOrPercentageOrAutoOrContent::Content),
+                Token::Function(ref name) if name.eq_ignore_ascii_case("calc") => {
+                    let calc = try!(input.parse_nested_block(CalcLengthOrPercentage::parse_length_or_percentage));
+                    Ok(LengthOrPercentageOrAutoOrContent::Calc(calc))
+                },
+                _ => Err(())
+            }
+        }
+    }
+
     #[derive(Clone, PartialEq, Copy, Debug, HeapSizeOf)]
     pub struct BorderRadiusSize(pub Size2D<LengthOrPercentage>);
 
@@ -1771,6 +1815,64 @@ pub mod computed {
         }
     }
 
+    #[derive(PartialEq, Clone, Copy, HeapSizeOf)]
+    pub enum LengthOrPercentageOrAutoOrContent {
+        Length(Au),
+        Percentage(CSSFloat),
+        Calc(CalcLengthOrPercentage),
+        Auto,
+        Content
+    }
+    impl fmt::Debug for LengthOrPercentageOrAutoOrContent {
+        fn fmt(&self, f: &mut fmt::Formatter) -> fmt::Result {
+            match *self {
+                LengthOrPercentageOrAutoOrContent::Length(length) => write!(f, "{:?}", length),
+                LengthOrPercentageOrAutoOrContent::Percentage(percentage) => write!(f, "{}%", percentage * 100.),
+                LengthOrPercentageOrAutoOrContent::Calc(calc) => write!(f, "{:?}", calc),
+                LengthOrPercentageOrAutoOrContent::Auto => write!(f, "auto"),
+                LengthOrPercentageOrAutoOrContent::Content => write!(f, "content")
+            }
+        }
+    }
+
+    impl ToComputedValue for specified::LengthOrPercentageOrAutoOrContent {
+        type ComputedValue = LengthOrPercentageOrAutoOrContent;
+
+        #[inline]
+        fn to_computed_value<Cx: TContext>(&self, context: &Cx) -> LengthOrPercentageOrAutoOrContent {
+            match *self {
+                specified::LengthOrPercentageOrAutoOrContent::Length(value) => {
+                    LengthOrPercentageOrAutoOrContent::Length(value.to_computed_value(context))
+                },
+                specified::LengthOrPercentageOrAutoOrContent::Percentage(value) => {
+                    LengthOrPercentageOrAutoOrContent::Percentage(value.0)
+                },
+                specified::LengthOrPercentageOrAutoOrContent::Calc(calc) => {
+                    LengthOrPercentageOrAutoOrContent::Calc(calc.to_computed_value(context))
+                },
+                specified::LengthOrPercentageOrAutoOrContent::Auto => {
+                    LengthOrPercentageOrAutoOrContent::Auto
+                },
+                specified::LengthOrPercentageOrAutoOrContent::Content => {
+                    LengthOrPercentageOrAutoOrContent::Content
+                }
+            }
+        }
+    }
+
+    impl ::cssparser::ToCss for LengthOrPercentageOrAutoOrContent {
+        fn to_css<W>(&self, dest: &mut W) -> fmt::Result where W: fmt::Write {
+            match *self {
+                LengthOrPercentageOrAutoOrContent::Length(length) => length.to_css(dest),
+                LengthOrPercentageOrAutoOrContent::Percentage(percentage)
+                => write!(dest, "{}%", percentage * 100.),
+                LengthOrPercentageOrAutoOrContent::Calc(calc) => calc.to_css(dest),
+                LengthOrPercentageOrAutoOrContent::Auto => dest.write_str("auto"),
+                LengthOrPercentageOrAutoOrContent::Content => dest.write_str("content")
+            }
+        }
+    }
+
     #[derive(PartialEq, Clone, Copy, HeapSizeOf)]
     pub enum LengthOrPercentageOrNone {
         Length(Au),

tests/wpt/css-tests/css-flexbox-1_dev/html/flexbox_computedstyle_flex-basis-percent.htm

@@ -5,24 +5,23 @@
 <link href="reference/ref-pass-body.htm" rel="match">
 <meta content="dom" name="flags">
 <style>
-html {
+body {
 	display: flex;
 	width: 100px;
 }
-body {
+div {
 	color: red;
-	margin: 0;
 	flex-basis: 100%;
 }
 .PASS {color: black;}
 </style>
-</head><body><h1>FAIL, enable javascript</h1>
+</head><body><div id="test"><h1>FAIL, enable javascript</h1>
 <script>
-    var body = document.body;
+    var test = document.getElementById("test");
 
     var passed =
-	    getComputedStyle(body).getPropertyValue("flex-basis") ==
+	    getComputedStyle(test).getPropertyValue("flex-basis") ==
 	    "100%";
-    body.textContent = body.className = passed ? "PASS" : "FAIL";
+    test.textContent = test.className = passed ? "PASS" : "FAIL";
 </script>
-</body></html>
+</body></html>