auto merge of #4340 : michaelwu/servo/css-rem-support, r=SimonSapin

This works on my simple test page https://people.mozilla.org/~mwu/rem.html , hopefully works on real pages too. Seems a little messy to add root_font_size directly to ComputedValues, but it didn't seem appropriate to add to the style structs.

components/style/media_queries.rs

@@ -125,7 +125,7 @@ fn parse_value_as_length(value: &ComponentValue) -> Result<Au, ()> {
     // http://dev.w3.org/csswg/mediaqueries3/ - Section 6
     // em units are relative to the initial font-size.
     let initial_font_size = longhands::font_size::get_initial_value();
-    Ok(computed::compute_Au_with_font_size(length, initial_font_size))
+    Ok(computed::compute_Au_with_font_size(length, initial_font_size, initial_font_size))
 }
 
 fn parse_media_query_expression(iter: ParserIter) -> Result<Expression, ()> {

components/style/properties/common_types.rs

@@ -25,6 +25,7 @@ pub mod specified {
         Au_(Au),  // application units
         Em(CSSFloat),
         Ex(CSSFloat),
+        Rem(CSSFloat),
 
         /// HTML5 "character width", as defined in HTML5 § 14.5.4.
         ///
@@ -34,7 +35,6 @@ pub mod specified {
 
         // XXX uncomment when supported:
 //        Ch(CSSFloat),
-//        Rem(CSSFloat),
 //        Vw(CSSFloat),
 //        Vh(CSSFloat),
 //        Vmin(CSSFloat),
@@ -73,6 +73,7 @@ pub mod specified {
                 "pc" => Ok(Au_(Au((value * AU_PER_PC) as i32))),
                 "em" => Ok(Em(value)),
                 "ex" => Ok(Ex(value)),
+                "rem" => Ok(Rem(value)),
                 _ => Err(())
             }
         }
@@ -463,6 +464,7 @@ pub mod computed {
         pub color: longhands::color::computed_value::T,
         pub text_decoration: longhands::text_decoration::computed_value::T,
         pub font_size: longhands::font_size::computed_value::T,
+        pub root_font_size: longhands::font_size::computed_value::T,
         pub display: longhands::display::computed_value::T,
         pub positioned: bool,
         pub floated: bool,
@@ -471,19 +473,19 @@ pub mod computed {
         pub border_bottom_present: bool,
         pub border_left_present: bool,
         pub is_root_element: bool,
-        // TODO, as needed: root font size, viewport size, etc.
+        // TODO, as needed: viewport size, etc.
     }
 
     #[allow(non_snake_case)]
     #[inline]
     pub fn compute_Au(value: specified::Length, context: &Context) -> Au {
-        compute_Au_with_font_size(value, context.font_size)
+        compute_Au_with_font_size(value, context.font_size, context.root_font_size)
     }
 
     /// A special version of `compute_Au` used for `font-size`.
     #[allow(non_snake_case)]
     #[inline]
-    pub fn compute_Au_with_font_size(value: specified::Length, reference_font_size: Au) -> Au {
+    pub fn compute_Au_with_font_size(value: specified::Length, reference_font_size: Au, root_font_size: Au) -> Au {
         match value {
             specified::Au_(value) => value,
             specified::Em(value) => reference_font_size.scale_by(value),
@@ -491,6 +493,7 @@ pub mod computed {
                 let x_height = 0.5;  // TODO: find that from the font
                 reference_font_size.scale_by(value * x_height)
             },
+            specified::Rem(value) => root_font_size.scale_by(value),
             specified::ServoCharacterWidth(value) => {
                 // This applies the *converting a character width to pixels* algorithm as specified
                 // in HTML5 § 14.5.4.

components/style/properties/mod.rs.mako

@@ -1956,6 +1956,7 @@ pub struct ComputedValues {
     % endfor
     shareable: bool,
     pub writing_mode: WritingMode,
+    pub root_font_size: Au,
 }
 
 impl ComputedValues {
@@ -2115,7 +2116,8 @@ lazy_static! {
             }),
         % endfor
         shareable: true,
-        writing_mode: WritingMode::empty()
+        writing_mode: WritingMode::empty(),
+        root_font_size: longhands::font_size::get_initial_value(),
     };
 }
 
@@ -2213,6 +2215,7 @@ fn cascade_with_cached_declarations(applicable_declarations: &[DeclarationBlock]
             ${style_struct.ident}: style_${style_struct.ident},
         % endfor
         shareable: shareable,
+        root_font_size: parent_style.root_font_size,
     }
 }
 
@@ -2254,6 +2257,7 @@ pub fn cascade(applicable_declarations: &[DeclarationBlock],
                 inherited_style.get_inheritedtext()._servo_text_decorations_in_effect,
             // To be overridden by applicable declarations:
             font_size: inherited_font_style.font_size,
+            root_font_size: inherited_style.root_font_size,
             display: longhands::display::get_initial_value(),
             color: inherited_style.get_color().color,
             text_decoration: longhands::text_decoration::get_initial_value(),
@@ -2286,7 +2290,7 @@ pub fn cascade(applicable_declarations: &[DeclarationBlock],
                 FontSizeDeclaration(ref value) => {
                     context.font_size = match *value {
                         SpecifiedValue(specified_value) => computed::compute_Au_with_font_size(
-                            specified_value, context.inherited_font_size),
+                            specified_value, context.inherited_font_size, context.root_font_size),
                         Initial => longhands::font_size::get_initial_value(),
                         Inherit => context.inherited_font_size,
                     }
@@ -2424,12 +2428,17 @@ pub fn cascade(applicable_declarations: &[DeclarationBlock],
         box_.display = longhands::display::to_computed_value(box_.display, &context);
     }
 
+    if is_root_element {
+        context.root_font_size = context.font_size;
+    }
+
     (ComputedValues {
         writing_mode: get_writing_mode(&*style_inheritedbox),
         % for style_struct in STYLE_STRUCTS:
             ${style_struct.ident}: style_${style_struct.ident},
         % endfor
         shareable: shareable,
+        root_font_size: context.root_font_size,
     }, cacheable)
 }
 
@@ -2452,6 +2461,7 @@ pub fn cascade_anonymous(parent_style: &ComputedValues) -> ComputedValues {
         % endfor
         shareable: false,
         writing_mode: parent_style.writing_mode,
+        root_font_size: parent_style.root_font_size,
     };
     {
         let border = result.border.make_unique();