Auto merge of #8111 - gilles-leblanc:issue-8002, r=SimonSapin

Compute value of float according to position value According to CSS2 Section 9.7, if 'position' has a value of 'absolute' or 'fixed' the computed value of 'float' should be 'none'. This changes the float to a single_keyword_computed which checks the positioned value of the element to compute the float value. Fixes #8002  [<img src="https://reviewable.io/review_button.png" height=40 alt="Review on Reviewable"/>](https://reviewable.io/reviews/servo/servo/8111)
servo · Nov 3, 2015 · 5070c87 · 5070c87
2 parents 23efa0a + 595f11d
commit 5070c87
Show file tree

Hide file tree

Showing 3 changed files with 65 additions and 1 deletion.
diff --git a/components/style/properties.mako.rs b/components/style/properties.mako.rs
@@ -546,7 +546,25 @@ pub mod longhands {
     </%self:longhand>
 
     ${single_keyword("position", "static absolute relative fixed")}
-    ${single_keyword("float", "none left right")}
+
+    <%self:single_keyword_computed name="float" values="none left right">
+        use values::computed::Context;
+
+        impl ToComputedValue for SpecifiedValue {
+            type ComputedValue = computed_value::T;
+
+            #[inline]
+            fn to_computed_value(&self, context: &Context) -> computed_value::T {
+                if context.positioned {
+                    SpecifiedValue::none
+                } else {
+                    *self
+                }
+            }
+        }
+
+    </%self:single_keyword_computed>
+
     ${single_keyword("clear", "none left right both")}
 
     <%self:longhand name="-servo-display-for-hypothetical-box" derived_from="display">

diff --git a/tests/wpt/mozilla/meta/MANIFEST.json b/tests/wpt/mozilla/meta/MANIFEST.json
@@ -4165,6 +4165,12 @@
         ]
       },
       "testharness": {
+        "css/float_relative_to_position.html": [
+          {
+            "path": "css/float_relative_to_position.html",
+            "url": "/_mozilla/css/float_relative_to_position.html"
+          }
+        ],
         "css/test_variable_legal_values.html": [
           {
             "path": "css/test_variable_legal_values.html",

diff --git a/tests/wpt/mozilla/tests/css/float_relative_to_position.html b/tests/wpt/mozilla/tests/css/float_relative_to_position.html
@@ -0,0 +1,40 @@
+<!doctype html>
+<html>
+<head>
+<meta charset=utf-8>
+<title>Tests the relationship between float and position</title>
+<style>
+    div {
+        float: left;
+    }
+</style>
+<head>
+<body>
+<div></div>
+
+<script src=/resources/testharness.js></script>
+<script src=/resources/testharnessreport.js></script>
+<script>
+    test(function() {
+        var computed_style = getComputedStyle(document.querySelector("div"))["float"];
+        assert_equals(computed_style, "left");
+
+        document.querySelector("div").setAttribute("style", "position: fixed;");
+
+        computed_style = getComputedStyle(document.querySelector("div"))["float"];
+        assert_equals(computed_style, "none");
+
+        document.querySelector("div").setAttribute("style", "position: absolute;");
+
+        computed_style = getComputedStyle(document.querySelector("div"))["float"];
+        assert_equals(computed_style, "none");
+
+        document.querySelector("div").removeAttribute("style");
+
+        computed_style = getComputedStyle(document.querySelector("div"))["float"];
+        assert_equals(computed_style, "left");
+    });
+</script>
+
+</body>
+</html>