Mirrors/servo
1
0
Fork 0
mirror of https://github.com/servo/servo.git synced 2025-06-06 16:45:39 +00:00
Code Issues Projects Releases Packages Wiki Activity

Auto merge of #12768 - nox:fix-transition, r=SimonSapin

Browse source 
Fix interpolation of CalcLengthOrPercentage (fixes #12765)

<!-- Reviewable:start -->
This change is [<img src="https://reviewable.io/review_button.svg" height="34" align="absmiddle" alt="Reviewable"/>](https://reviewable.io/reviews/servo/servo/12768)
<!-- Reviewable:end -->
This commit is contained in:
bors-servo 2016-08-09 09:03:10 -05:00 • committed by GitHub
commit 44ebbfc20d
4 changed files with 59 additions and 5 deletions
Download patch file Download diff file Expand all files Collapse all files

20
components/style/properties/helpers/animated_properties.mako.rs
View file

@ -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)),
})
}
}

5
components/style/values/specified/basic_shape.rs
View file

@ -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))]

6
tests/wpt/mozilla/meta/MANIFEST.json
View file

@ -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",

33
tests/wpt/mozilla/tests/css/animations/mixed-units.html Normal file
View file

@ -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>