From b34e331fa27350e02a526c8b463e081cbbccdbd0 Mon Sep 17 00:00:00 2001
From: Brian Birtles <birtles@gmail.com>
Date: Mon, 24 Jul 2017 13:35:20 +0900
Subject: [PATCH] Only allow animation-timing-function in @keyframes

CSS animations used to erroneously indicate that 'animation-play-state'
is permitted in @keyframes. It is not and is non-sensical to allow it
there. This mistake was faithfully transferred into Servo code (although
we also make 'animation-timing-function' which is what the spec text
meant to say).

The spec has been updated[1] and so we should update the Servo code
accordingly.

[1] https://github.com/w3c/csswg-drafts/commit/adeb3434c5ca44a2871deba9b3585588c3c6058c
---
 components/style/properties/longhand/box.mako.rs |  6 +++---
 tests/unit/style/stylesheets.rs                  | 11 ++++++-----
 2 files changed, 9 insertions(+), 8 deletions(-)

diff --git a/components/style/properties/longhand/box.mako.rs b/components/style/properties/longhand/box.mako.rs
index 3738032491c0..9bc45aa2a171 100644
--- a/components/style/properties/longhand/box.mako.rs
+++ b/components/style/properties/longhand/box.mako.rs
@@ -591,6 +591,8 @@ ${helpers.predefined_type("animation-duration",
                           extra_prefixes="moz webkit",
                           spec="https://drafts.csswg.org/css-transitions/#propdef-transition-duration")}
 
+// animation-timing-function is the exception to the rule for allowed_in_keyframe_block:
+// https://drafts.csswg.org/css-animations/#keyframes
 ${helpers.predefined_type("animation-timing-function",
                           "TimingFunction",
                           "computed::TimingFunction::ease()",
@@ -671,8 +673,6 @@ ${helpers.single_keyword("animation-direction",
                          spec="https://drafts.csswg.org/css-animations/#propdef-animation-direction",
                          allowed_in_keyframe_block=False)}
 
-// animation-play-state is the exception to the rule for allowed_in_keyframe_block:
-// https://drafts.csswg.org/css-animations/#keyframes
 ${helpers.single_keyword("animation-play-state",
                          "running paused",
                          need_clone=True,
@@ -681,7 +681,7 @@ ${helpers.single_keyword("animation-play-state",
                          vector=True,
                          extra_prefixes="moz webkit",
                          spec="https://drafts.csswg.org/css-animations/#propdef-animation-play-state",
-                         allowed_in_keyframe_block=True)}
+                         allowed_in_keyframe_block=False)}
 
 ${helpers.single_keyword("animation-fill-mode",
                          "none forwards backwards both",
diff --git a/tests/unit/style/stylesheets.rs b/tests/unit/style/stylesheets.rs
index 35c93eb17291..d2da11cfa3e9 100644
--- a/tests/unit/style/stylesheets.rs
+++ b/tests/unit/style/stylesheets.rs
@@ -20,7 +20,7 @@ use style::media_queries::MediaList;
 use style::properties::Importance;
 use style::properties::{CSSWideKeyword, DeclaredValueOwned, PropertyDeclaration, PropertyDeclarationBlock};
 use style::properties::longhands;
-use style::properties::longhands::animation_play_state;
+use style::properties::longhands::animation_timing_function;
 use style::shared_lock::SharedRwLock;
 use style::stylesheets::{Origin, Namespaces};
 use style::stylesheets::{Stylesheet, StylesheetContents, NamespaceRule, CssRule, CssRules, StyleRule, KeyframesRule};
@@ -28,6 +28,7 @@ use style::stylesheets::keyframes_rule::{Keyframe, KeyframeSelector, KeyframePer
 use style::values::{KeyframesName, CustomIdent};
 use style::values::computed::Percentage;
 use style::values::specified::{LengthOrPercentageOrAuto, PositionComponent};
+use style::values::specified::transform::TimingFunction;
 
 pub fn block_from<I>(iterable: I) -> PropertyDeclarationBlock
 where I: IntoIterator<Item=(PropertyDeclaration, Importance)> {
@@ -62,7 +63,7 @@ fn test_parse_stylesheet() {
                 width: 100%;
                 width: 50% !important; /* !important not allowed here */
                 animation-name: 'foo'; /* animation properties not allowed here */
-                animation-play-state: running; /* … except animation-play-state */
+                animation-timing-function: ease; /* … except animation-timing-function */
             }
         }";
     let url = ServoUrl::parse("about::test").unwrap();
@@ -226,9 +227,9 @@ fn test_parse_stylesheet() {
                                 (PropertyDeclaration::Width(
                                     LengthOrPercentageOrAuto::Percentage(Percentage(1.))),
                                  Importance::Normal),
-                                (PropertyDeclaration::AnimationPlayState(
-                                    animation_play_state::SpecifiedValue(
-                                        vec![animation_play_state::SingleSpecifiedValue::running])),
+                                (PropertyDeclaration::AnimationTimingFunction(
+                                    animation_timing_function::SpecifiedValue(
+                                        vec![TimingFunction::ease()])),
                                  Importance::Normal),
                             ]))),
                         })),