From 2c7d1ddfa1653eb392fcae85772ab7343ea78e72 Mon Sep 17 00:00:00 2001
From: Anthony Ramine <n.oxyde@gmail.com>
Date: Mon, 8 Aug 2016 15:55:22 +0200
Subject: [PATCH 1/2] Fix basic_shape warnings (fixes #12762)

---
 components/style/values/specified/basic_shape.rs | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/components/style/values/specified/basic_shape.rs b/components/style/values/specified/basic_shape.rs
index a8193116b75..7616bb7bf6d 100644
--- a/components/style/values/specified/basic_shape.rs
+++ b/components/style/values/specified/basic_shape.rs
@@ -7,14 +7,13 @@
 //!
 //! [basic-shape]: https://drafts.csswg.org/css-shapes/#typedef-basic-shape
 
-use app_units::Au;
 use cssparser::{Parser, ToCss};
 use properties::shorthands::{parse_four_sides, serialize_four_sides};
 use std::fmt;
 use values::computed::basic_shape as computed_basic_shape;
 use values::computed::{Context, ToComputedValue, ComputedValueAsSpecified};
-use values::specified::position::{Position, PositionComponent};
-use values::specified::{BorderRadiusSize, Length, LengthOrPercentage, Percentage};
+use values::specified::position::Position;
+use values::specified::{BorderRadiusSize, LengthOrPercentage, Percentage};
 
 #[derive(Clone, PartialEq, Debug)]
 #[cfg_attr(feature = "servo", derive(HeapSizeOf))]

From fc58cc01f45bc11e52689cfb40acaa5c483bb876 Mon Sep 17 00:00:00 2001
From: Anthony Ramine <n.oxyde@gmail.com>
Date: Mon, 8 Aug 2016 15:55:46 +0200
Subject: [PATCH 2/2] Fix interpolation of CalcLengthOrPercentage (fixes
 #12765)

---
 .../helpers/animated_properties.mako.rs       | 20 +++++++++--
 tests/wpt/mozilla/meta/MANIFEST.json          |  6 ++++
 .../tests/css/animations/mixed-units.html     | 33 +++++++++++++++++++
 3 files changed, 57 insertions(+), 2 deletions(-)
 create mode 100644 tests/wpt/mozilla/tests/css/animations/mixed-units.html

diff --git a/components/style/properties/helpers/animated_properties.mako.rs b/components/style/properties/helpers/animated_properties.mako.rs
index c9a3ab8cb64..be4a26305ee 100644
--- a/components/style/properties/helpers/animated_properties.mako.rs
+++ b/components/style/properties/helpers/animated_properties.mako.rs
@@ -326,9 +326,25 @@ impl Interpolate for CSSParserColor {
 impl Interpolate for CalcLengthOrPercentage {
     #[inline]
     fn interpolate(&self, other: &Self, time: f64) -> Result<Self, ()> {
+        fn interpolate_half<T>(this: Option<T>,
+                               other: Option<T>,
+                               time: f64)
+                               -> Result<Option<T>, ()>
+            where T: Default + Interpolate
+        {
+            match (this, other) {
+                (None, None) => Ok(None),
+                (this, other) => {
+                    let this = this.unwrap_or(T::default());
+                    let other = other.unwrap_or(T::default());
+                    this.interpolate(&other, time).map(Some)
+                }
+            }
+        }
+
         Ok(CalcLengthOrPercentage {
-            length: self.length.interpolate(&other.length, time).ok().and_then(|x|x),
-            percentage: self.percentage.interpolate(&other.percentage, time).ok().and_then(|x|x),
+            length: try!(interpolate_half(self.length, other.length, time)),
+            percentage: try!(interpolate_half(self.percentage, other.percentage, time)),
         })
     }
 }
diff --git a/tests/wpt/mozilla/meta/MANIFEST.json b/tests/wpt/mozilla/meta/MANIFEST.json
index d9d08e602d6..ee63e759d12 100644
--- a/tests/wpt/mozilla/meta/MANIFEST.json
+++ b/tests/wpt/mozilla/meta/MANIFEST.json
@@ -6168,6 +6168,12 @@
             "url": "/_mozilla/css/animations/basic-transition.html"
           }
         ],
+        "css/animations/mixed-units.html": [
+          {
+            "path": "css/animations/mixed-units.html",
+            "url": "/_mozilla/css/animations/mixed-units.html"
+          }
+        ],
         "css/animations/transition-raf.html": [
           {
             "path": "css/animations/transition-raf.html",
diff --git a/tests/wpt/mozilla/tests/css/animations/mixed-units.html b/tests/wpt/mozilla/tests/css/animations/mixed-units.html
new file mode 100644
index 00000000000..bb029a9fa80
--- /dev/null
+++ b/tests/wpt/mozilla/tests/css/animations/mixed-units.html
@@ -0,0 +1,33 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>Animation test: mixed units.</title>
+<style>
+  .animatable {
+    width: 50px;
+    height: 50px;
+    background: red;
+    animation: foo 1s infinite linear;
+  }
+  @keyframes foo {
+    from { width: 0%; }
+    to { width: 500px; }
+  }
+</style>
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div class="animatable"></div>
+<script>
+var div = document.querySelector('.animatable');
+async_test(function(t) {
+  window.addEventListener('load', function() {
+    var test = new window.TestBinding();
+    test.advanceClock(500);
+    assert_equals(getComputedStyle(div).getPropertyValue('width'), '250px');
+    test.advanceClock(500);
+    assert_equals(getComputedStyle(div).getPropertyValue('width'), '500px');
+    test.advanceClock(500);
+    assert_equals(getComputedStyle(div).getPropertyValue('width'), '250px');
+    t.done();
+  })
+})
+</script>