Allow retrieving width/height for non-positioned elements

components/layout/layout_task.rs

@@ -931,6 +931,40 @@ impl LayoutTask {
         // There are probably other quirks.
         let applies = true;
 
+        fn used_value_for_position_property(layout_node: ThreadSafeLayoutNode,
+                                            layout_root: &mut FlowRef,
+                                            requested_node: TrustedNodeAddress,
+                                            property: &Atom) -> Option<String> {
+            let layout_data = layout_node.borrow_layout_data();
+            let position = layout_data.as_ref().map(|layout_data| {
+                match layout_data.data.flow_construction_result {
+                    ConstructionResult::Flow(ref flow_ref, _) =>
+                        flow::base(flow_ref.deref()).stacking_relative_position,
+                    // TODO(dzbarsky) search parents until we find node with a flow ref.
+                    // https://github.com/servo/servo/issues/8307
+                    _ => ZERO_POINT
+                }
+            }).unwrap_or(ZERO_POINT);
+            let property = match *property {
+                atom!("bottom") => PositionProperty::Bottom,
+                atom!("top") => PositionProperty::Top,
+                atom!("left") => PositionProperty::Left,
+                atom!("right") => PositionProperty::Right,
+                atom!("width") => PositionProperty::Width,
+                atom!("height") => PositionProperty::Height,
+                _ => unreachable!()
+            };
+            let requested_node: OpaqueNode =
+                OpaqueNodeMethods::from_script_node(requested_node);
+            let mut iterator =
+                PositionRetrievingFragmentBorderBoxIterator::new(requested_node,
+                                                                 property,
+                                                                 position);
+            sequential::iterate_through_flow_tree_fragment_border_boxes(layout_root,
+                                                                        &mut iterator);
+            iterator.result.map(|r| r.to_css_string())
+        }
+
         // TODO: we will return neither the computed nor used value for margin and padding.
         // Firefox returns blank strings for the computed value of shorthands,
         // so this should be web-compatible.
@@ -964,37 +998,16 @@ impl LayoutTask {
             },
 
             atom!("bottom") | atom!("top") | atom!("right") |
-            atom!("left") | atom!("width") | atom!("height")
+            atom!("left")
             if applies && positioned && style.get_box().display !=
                     display::computed_value::T::none => {
-                let layout_data = layout_node.borrow_layout_data();
-                let position = layout_data.as_ref().map(|layout_data| {
-                    match layout_data.data.flow_construction_result {
-                        ConstructionResult::Flow(ref flow_ref, _) =>
-                            flow::base(flow_ref.deref()).stacking_relative_position,
-                        // TODO search parents until we find node with a flow ref.
-                        _ => ZERO_POINT
-                    }
-                }).unwrap_or(ZERO_POINT);
-                let property = match *property {
-                    atom!("bottom") => PositionProperty::Bottom,
-                    atom!("top") => PositionProperty::Top,
-                    atom!("left") => PositionProperty::Left,
-                    atom!("right") => PositionProperty::Right,
-                    atom!("width") => PositionProperty::Width,
-                    atom!("height") => PositionProperty::Height,
-                    _ => unreachable!()
-                };
-                let requested_node: OpaqueNode =
-                    OpaqueNodeMethods::from_script_node(requested_node);
-                let mut iterator =
-                    PositionRetrievingFragmentBorderBoxIterator::new(requested_node,
-                                                                     property,
-                                                                     position);
-                sequential::iterate_through_flow_tree_fragment_border_boxes(layout_root,
-                                                                            &mut iterator);
-                iterator.result.map(|r| r.to_css_string())
-            },
+                used_value_for_position_property(layout_node, layout_root, requested_node, property)
+            }
+            atom!("width") | atom!("height")
+            if applies && style.get_box().display !=
+                    display::computed_value::T::none => {
+                used_value_for_position_property(layout_node, layout_root, requested_node, property)
+            }
             // FIXME: implement used value computation for line-height
             ref property => {
                 style.computed_value_to_string(property.as_slice()).ok()

components/layout/query.rs

@@ -221,13 +221,14 @@ impl PositionRetrievingFragmentBorderBoxIterator {
 }
 
 impl FragmentBorderBoxIterator for PositionRetrievingFragmentBorderBoxIterator {
-    fn process(&mut self, _: &Fragment, _: i32, border_box: &Rect<Au>) {
+    fn process(&mut self, fragment: &Fragment, _: i32, border_box: &Rect<Au>) {
+        let border_padding = fragment.border_padding.to_physical(fragment.style.writing_mode);
         self.result =
             Some(match self.property {
                      PositionProperty::Left => self.position.x,
                      PositionProperty::Top => self.position.y,
-                     PositionProperty::Width => border_box.size.width,
-                     PositionProperty::Height => border_box.size.height,
+                     PositionProperty::Width => border_box.size.width - border_padding.horizontal(),
+                     PositionProperty::Height => border_box.size.height - border_padding.vertical(),
                      // TODO: the following 2 calculations are completely wrong.
                      // They should return the difference between the parent's and this
                      // fragment's border boxes.

tests/wpt/metadata-css/cssom-1_dev/html/computed-style-001.htm.ini

@@ -3,6 +3,3 @@
   [read_only]
     expected: FAIL
 
-  [relative_property_values]
-    expected: FAIL
-

tests/wpt/mozilla/meta/mozilla/calc.html.ini

@@ -1,11 +1,5 @@
 [calc.html]
   type: testharness
-  [calc(1px + 1pt + 1pc + 1in + 1cm + 1mm)]
-    expected: FAIL
-
-  [calc(0px + 0pt + 0pc + 0in + 0cm + 0mm + 0rem + 0em + 0ex + 0% + 0vw + 0vh + 0vmin + 0vmax)]
-    expected: FAIL
-
   [calc for column-width]
     expected: FAIL
 
@@ -15,6 +9,3 @@
   [calc for column-count]
     expected: FAIL
 
-  [calc(0ch + 0px + 0pt + 0pc + 0in + 0cm + 0mm + 0rem + 0em + 0ex + 0% + 0vw + 0vh + 0vmin + 0vmax)]
-    expected: FAIL
-

tests/wpt/mozilla/meta/mozilla/getComputedStyle.html.ini

@@ -0,0 +1,5 @@
+[getComputedStyle.html]
+  type: testharness
+  [getComputedStyle work for elements not in a document]
+    expected: FAIL
+

tests/wpt/mozilla/tests/mozilla/getComputedStyle.html

@@ -24,7 +24,7 @@
                 assert_equals(cs.getPropertyValue("top"), "auto");
                 assert_equals(cs.getPropertyValue("bottom"), "auto");
                 assert_equals(cs.getPropertyValue("width"), "50px");
-                assert_equals(cs.getPropertyValue("height"), "auto");
+                assert_equals(cs.getPropertyValue("height"), "0px");
                 assert_equals(cs.getPropertyValue("color"), "rgb(0, 0, 0)");
             }, "Element's resolved values");
 
@@ -43,8 +43,8 @@
             test(function() {
                 var div = document.createElement("div");
                 div.id = "foo";
-                assert_equals(getComputedStyle(div).getPropertyValue("width"), "");
-            }, "Blank style for elements not in a document");
+                assert_equals(getComputedStyle(div).getPropertyValue("width"), "50px");
+            }, "getComputedStyle work for elements not in a document");
 
         </script>
     </body>