Bug 996945: Remove prohibition on flex-grow & flex-shrink properties transitioning between 0 and other values. r=mats

This commit is contained in:
Daniel Holbert 2014-05-04 09:12:32 -07:00
parent c243f023e3
commit fb1252420a
3 changed files with 19 additions and 40 deletions

View File

@ -1695,7 +1695,7 @@ CSS_PROP_POSITION(
VARIANT_HN,
nullptr,
offsetof(nsStylePosition, mFlexGrow),
eStyleAnimType_float) // float, except animations to/from 0 shouldn't work
eStyleAnimType_float)
CSS_PROP_POSITION(
flex-shrink,
flex_shrink,
@ -1709,7 +1709,7 @@ CSS_PROP_POSITION(
VARIANT_HN,
nullptr,
offsetof(nsStylePosition, mFlexShrink),
eStyleAnimType_float) // float, except animations to/from 0 shouldn't work
eStyleAnimType_float)
CSS_PROP_POSITION(
flex-wrap,
flex_wrap,

View File

@ -463,16 +463,6 @@ nsStyleAnimation::ComputeDistance(nsCSSProperty aProperty,
return true;
}
case eUnit_Float: {
// Special case for flex-grow and flex-shrink: animations are
// disallowed between 0 and other values.
if ((aProperty == eCSSProperty_flex_grow ||
aProperty == eCSSProperty_flex_shrink) &&
(aStartValue.GetFloatValue() == 0.0f ||
aEndValue.GetFloatValue() == 0.0f) &&
aStartValue.GetFloatValue() != aEndValue.GetFloatValue()) {
return false;
}
float startFloat = aStartValue.GetFloatValue();
float endFloat = aEndValue.GetFloatValue();
aDistance = Abs(double(endFloat) - double(startFloat));
@ -1948,16 +1938,6 @@ nsStyleAnimation::AddWeighted(nsCSSProperty aProperty,
return true;
}
case eUnit_Float: {
// Special case for flex-grow and flex-shrink: animations are
// disallowed between 0 and other values.
if ((aProperty == eCSSProperty_flex_grow ||
aProperty == eCSSProperty_flex_shrink) &&
(aValue1.GetFloatValue() == 0.0f ||
aValue2.GetFloatValue() == 0.0f) &&
aValue1.GetFloatValue() != aValue2.GetFloatValue()) {
return false;
}
aResultValue.SetFloatValue(RestrictValue(aProperty,
aCoeff1 * aValue1.GetFloatValue() +
aCoeff2 * aValue2.GetFloatValue()));

View File

@ -16,7 +16,7 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=696253
* { flex-grow: 10; flex-shrink: 20 }
/* These animations SHOULD affect computed style */
/* Animations that we'll test (individually) in the script below: */
@keyframes flexGrowTwoToThree {
0% { flex-grow: 2 }
100% { flex-grow: 3 }
@ -33,9 +33,6 @@ https://bugzilla.mozilla.org/show_bug.cgi?id=696253
0% { flex-shrink: 0 }
100% { flex-shrink: 0 }
}
/* These animations SHOULD NOT affect computed style. (flex-grow and
flex-shrink are animatable "except between '0' and other values") */
@keyframes flexGrowZeroToOne {
0% { flex-grow: 0 }
100% { flex-grow: 1 }
@ -136,41 +133,43 @@ advance_clock(1000);
is(cs.flexShrink, 20, "flexShrinkZeroToZero at 1.5s");
done_div();
// ANIMATIONS THAT SHOULD NOT AFFECT COMPUTED STYLE
// ------------------------------------------------
// ANIMATIONS THAT DIDN'T USED TO AFFECT COMPUTED STYLE, BUT NOW DO
// ----------------------------------------------------------------
// (In an older version of the flexbox spec, flex-grow & flex-shrink were not
// allowed to animate between 0 and other values. But now that's allowed.)
// flexGrowZeroToOne: no effect on computed style. 10 all the way through.
// flexGrowZeroToOne: 0 at 0%, 0.5 at 50%, 10 after animation is over.
new_div("animation: flexGrowZeroToOne linear 1s");
is(cs.flexGrow, 10, "flexGrowZeroToOne at 0.0s");
is(cs.flexGrow, 0, "flexGrowZeroToOne at 0.0s");
advance_clock(500);
is(cs.flexGrow, 10, "flexGrowZeroToOne at 0.5s");
is(cs.flexGrow, 0.5, "flexGrowZeroToOne at 0.5s");
advance_clock(1000);
is(cs.flexGrow, 10, "flexGrowZeroToOne at 1.5s");
done_div();
// flexShrinkZeroToOne: no effect on computed style. 20 all the way through.
// flexShrinkZeroToOne: 0 at 0%, 0.5 at 50%, 20 after animation is over.
new_div("animation: flexShrinkZeroToOne linear 1s");
is(cs.flexShrink, 20, "flexShrinkZeroToOne at 0.0s");
is(cs.flexShrink, 0, "flexShrinkZeroToOne at 0.0s");
advance_clock(500);
is(cs.flexShrink, 20, "flexShrinkZeroToOne at 0.5s");
is(cs.flexShrink, 0.5, "flexShrinkZeroToOne at 0.5s");
advance_clock(1000);
is(cs.flexShrink, 20, "flexShrinkZeroToOne at 1.5s");
done_div();
// flexGrowOneToZero: no effect on computed style. 10 all the way through.
// flexGrowOneToZero: 1 at 0%, 0.5 at 50%, 10 after animation is over.
new_div("animation: flexGrowOneToZero linear 1s");
is(cs.flexGrow, 10, "flexGrowOneToZero at 0.0s");
is(cs.flexGrow, 1, "flexGrowOneToZero at 0.0s");
advance_clock(500);
is(cs.flexGrow, 10, "flexGrowOneToZero at 0.5s");
is(cs.flexGrow, 0.5, "flexGrowOneToZero at 0.5s");
advance_clock(1000);
is(cs.flexGrow, 10, "flexGrowOneToZero at 1.5s");
done_div();
// flexShrinkOneToZero: no effect on computed style. 20 all the way through.
// flexShrinkOneToZero: 1 at 0%, 0.5 at 50%, 20 after animation is over.
new_div("animation: flexShrinkOneToZero linear 1s");
is(cs.flexShrink, 20, "flexShrinkOneToZero at 0.0s");
is(cs.flexShrink, 1, "flexShrinkOneToZero at 0.0s");
advance_clock(500);
is(cs.flexShrink, 20, "flexShrinkOneToZero at 0.5s");
is(cs.flexShrink, 0.5, "flexShrinkOneToZero at 0.5s");
advance_clock(1000);
is(cs.flexShrink, 20, "flexShrinkOneToZero at 1.5s");
done_div();