Commit 3592d762 authored by Xida Chen's avatar Xida Chen Committed by Commit Bot

Implement AnimationEvent.pseudoElement

The spec is here:
https://drafts.csswg.org/css-animations/#interface-animationevent

A layout test is changed to test this API.

Bug: 437132
Change-Id: Ic463b19488271e1caeb78afa6120bb53f7d5e94d
Reviewed-on: https://chromium-review.googlesource.com/1019383Reviewed-by: default avatarChris Harrelson <chrishtr@chromium.org>
Reviewed-by: default avatarStephen McGruer <smcgruer@chromium.org>
Commit-Queue: Xida Chen <xidachen@chromium.org>
Cr-Commit-Position: refs/heads/master@{#555898}
parent d5fbbf7c
...@@ -68,6 +68,11 @@ ...@@ -68,6 +68,11 @@
assert_equals(event.elapsedTime, 0.0); assert_equals(event.elapsedTime, 0.0);
}, "animationEventInit argument is empty dictionary"); }, "animationEventInit argument is empty dictionary");
test(function() {
var event = new AnimationEvent("test", {pseudoElement: "::testPseudo"});
assert_equals(event.pseudoElement, "::testPseudo");
}, "AnimationEvent.pseudoElement initialized from the dictionary");
test(function() { test(function() {
var event = new AnimationEvent("test", {animationName: "sample"}); var event = new AnimationEvent("test", {animationName: "sample"});
assert_equals(event.animationName, "sample"); assert_equals(event.animationName, "sample");
......
<!DOCTYPE html>
<meta charset="utf-8">
<title>CSS Animations Test: AnimationEvent pseudoElement</title>
<link rel="help" href="https://drafts.csswg.org/css-animations/#interface-animationevent">
<script src="/resources/testharness.js"></script>
<script src="/resources/testharnessreport.js"></script>
<style>
#target::before {
content: "";
animation: move 1s;
}
@keyframes move {
to { transform: translate(100px); }
}
</style>
<div id='target'></div>
<script>
async_test(function(t) {
var target = document.getElementById('target');
target.addEventListener("animationstart", t.step_func(function(evt) {
assert_true(evt instanceof window.AnimationEvent);
assert_equals(evt.pseudoElement, "::before");
t.done();
}), true);
}, "AnimationEvent should have the correct pseudoElement memeber");
</script>
...@@ -39,9 +39,11 @@ ...@@ -39,9 +39,11 @@
assert_idl_attribute(evt, "animationName", "animationstart has animationName property"); assert_idl_attribute(evt, "animationName", "animationstart has animationName property");
assert_idl_attribute(evt, "elapsedTime", "animationstart has elapsedTime property"); assert_idl_attribute(evt, "elapsedTime", "animationstart has elapsedTime property");
assert_idl_attribute(evt, "pseudoElement", "animationstart has pseudoElement property");
assert_equals(evt.animationName, "sample", "animationstart has animationName value"); assert_equals(evt.animationName, "sample", "animationstart has animationName value");
assert_equals(evt.elapsedTime, 1, "animationstart has elapsedTime value"); assert_equals(evt.elapsedTime, 1, "animationstart has elapsedTime value");
assert_equals(evt.pseudoElement, "", "animaitonstart has correct pseudoElement value");
t.done(); t.done();
}), true); }), true);
...@@ -53,9 +55,11 @@ ...@@ -53,9 +55,11 @@
assert_idl_attribute(evt, "animationName", "animationend has animationName property"); assert_idl_attribute(evt, "animationName", "animationend has animationName property");
assert_idl_attribute(evt, "elapsedTime", "animationend has elapsedTime property"); assert_idl_attribute(evt, "elapsedTime", "animationend has elapsedTime property");
assert_idl_attribute(evt, "pseudoElement", "animationstart has pseudoElement property");
assert_equals(evt.animationName, "sample", "animationend has animationName value"); assert_equals(evt.animationName, "sample", "animationend has animationName value");
assert_equals(evt.elapsedTime, 4, "animationend has elapsedTime value"); assert_equals(evt.elapsedTime, 4, "animationend has elapsedTime value");
assert_equals(evt.pseudoElement, "", "animaitonstart has correct pseudoElement value");
t.done(); t.done();
}), true); }), true);
...@@ -67,9 +71,11 @@ ...@@ -67,9 +71,11 @@
assert_idl_attribute(evt, "animationName", "animationiteration has animationName property"); assert_idl_attribute(evt, "animationName", "animationiteration has animationName property");
assert_idl_attribute(evt, "elapsedTime", "animationiteration has elapsedTime property"); assert_idl_attribute(evt, "elapsedTime", "animationiteration has elapsedTime property");
assert_idl_attribute(evt, "pseudoElement", "animationstart has pseudoElement property");
assert_equals(evt.animationName, "sample", "animationiteration has animationName value"); assert_equals(evt.animationName, "sample", "animationiteration has animationName value");
assert_equals(evt.elapsedTime, 2, "animationiteration has elapsedTime value"); assert_equals(evt.elapsedTime, 2, "animationiteration has elapsedTime value");
assert_equals(evt.pseudoElement, "", "animaitonstart has correct pseudoElement value");
t.done(); t.done();
}), true); }), true);
......
...@@ -45,6 +45,7 @@ interface AnimationEvent : Event ...@@ -45,6 +45,7 @@ interface AnimationEvent : Event
attribute @@toStringTag attribute @@toStringTag
getter animationName getter animationName
getter elapsedTime getter elapsedTime
getter pseudoElement
method constructor method constructor
interface ApplicationCache : EventTarget interface ApplicationCache : EventTarget
attribute @@toStringTag attribute @@toStringTag
...@@ -7899,6 +7900,7 @@ interface WebKitAnimationEvent : Event ...@@ -7899,6 +7900,7 @@ interface WebKitAnimationEvent : Event
attribute @@toStringTag attribute @@toStringTag
getter animationName getter animationName
getter elapsedTime getter elapsedTime
getter pseudoElement
method constructor method constructor
interface WebKitCSSMatrix : DOMMatrixReadOnly interface WebKitCSSMatrix : DOMMatrixReadOnly
attribute @@toStringTag attribute @@toStringTag
......
...@@ -202,6 +202,7 @@ interface AnimationEvent : Event ...@@ -202,6 +202,7 @@ interface AnimationEvent : Event
attribute @@toStringTag attribute @@toStringTag
getter animationName getter animationName
getter elapsedTime getter elapsedTime
getter pseudoElement
method constructor method constructor
interface AnimationPlaybackEvent : Event interface AnimationPlaybackEvent : Event
attribute @@toStringTag attribute @@toStringTag
...@@ -8742,6 +8743,7 @@ interface WebKitAnimationEvent : Event ...@@ -8742,6 +8743,7 @@ interface WebKitAnimationEvent : Event
attribute @@toStringTag attribute @@toStringTag
getter animationName getter animationName
getter elapsedTime getter elapsedTime
getter pseudoElement
method constructor method constructor
interface WebKitCSSMatrix : DOMMatrixReadOnly interface WebKitCSSMatrix : DOMMatrixReadOnly
attribute @@toStringTag attribute @@toStringTag
......
...@@ -1109,8 +1109,10 @@ void CSSAnimations::AnimationEventDelegate::MaybeDispatch( ...@@ -1109,8 +1109,10 @@ void CSSAnimations::AnimationEventDelegate::MaybeDispatch(
const AtomicString& event_name, const AtomicString& event_name,
double elapsed_time) { double elapsed_time) {
if (animation_target_->GetDocument().HasListenerType(listener_type)) { if (animation_target_->GetDocument().HasListenerType(listener_type)) {
AnimationEvent* event = String pseudo_element_name = PseudoElement::PseudoElementNameForEvents(
AnimationEvent::Create(event_name, name_, elapsed_time); animation_target_->GetPseudoId());
AnimationEvent* event = AnimationEvent::Create(
event_name, name_, elapsed_time, pseudo_element_name);
event->SetTarget(GetEventTarget()); event->SetTarget(GetEventTarget());
GetDocument().EnqueueAnimationFrameEvent(event); GetDocument().EnqueueAnimationFrameEvent(event);
} }
......
...@@ -33,14 +33,17 @@ AnimationEvent::AnimationEvent(const AtomicString& type, ...@@ -33,14 +33,17 @@ AnimationEvent::AnimationEvent(const AtomicString& type,
const AnimationEventInit& initializer) const AnimationEventInit& initializer)
: Event(type, initializer), : Event(type, initializer),
animation_name_(initializer.animationName()), animation_name_(initializer.animationName()),
elapsed_time_(initializer.elapsedTime()) {} elapsed_time_(initializer.elapsedTime()),
pseudo_element_(initializer.pseudoElement()) {}
AnimationEvent::AnimationEvent(const AtomicString& type, AnimationEvent::AnimationEvent(const AtomicString& type,
const String& animation_name, const String& animation_name,
double elapsed_time) double elapsed_time,
const String& pseudo_element)
: Event(type, Bubbles::kYes, Cancelable::kYes), : Event(type, Bubbles::kYes, Cancelable::kYes),
animation_name_(animation_name), animation_name_(animation_name),
elapsed_time_(elapsed_time) {} elapsed_time_(elapsed_time),
pseudo_element_(pseudo_element) {}
AnimationEvent::~AnimationEvent() = default; AnimationEvent::~AnimationEvent() = default;
...@@ -52,6 +55,10 @@ double AnimationEvent::elapsedTime() const { ...@@ -52,6 +55,10 @@ double AnimationEvent::elapsedTime() const {
return elapsed_time_; return elapsed_time_;
} }
const String& AnimationEvent::pseudoElement() const {
return pseudo_element_;
}
const AtomicString& AnimationEvent::InterfaceName() const { const AtomicString& AnimationEvent::InterfaceName() const {
return EventNames::AnimationEvent; return EventNames::AnimationEvent;
} }
......
...@@ -38,8 +38,10 @@ class AnimationEvent final : public Event { ...@@ -38,8 +38,10 @@ class AnimationEvent final : public Event {
static AnimationEvent* Create() { return new AnimationEvent; } static AnimationEvent* Create() { return new AnimationEvent; }
static AnimationEvent* Create(const AtomicString& type, static AnimationEvent* Create(const AtomicString& type,
const String& animation_name, const String& animation_name,
double elapsed_time) { double elapsed_time,
return new AnimationEvent(type, animation_name, elapsed_time); const String& pseudo_element) {
return new AnimationEvent(type, animation_name, elapsed_time,
pseudo_element);
} }
static AnimationEvent* Create(const AtomicString& type, static AnimationEvent* Create(const AtomicString& type,
const AnimationEventInit& initializer) { const AnimationEventInit& initializer) {
...@@ -50,6 +52,7 @@ class AnimationEvent final : public Event { ...@@ -50,6 +52,7 @@ class AnimationEvent final : public Event {
const String& animationName() const; const String& animationName() const;
double elapsedTime() const; double elapsedTime() const;
const String& pseudoElement() const;
const AtomicString& InterfaceName() const override; const AtomicString& InterfaceName() const override;
...@@ -59,11 +62,13 @@ class AnimationEvent final : public Event { ...@@ -59,11 +62,13 @@ class AnimationEvent final : public Event {
AnimationEvent(); AnimationEvent();
AnimationEvent(const AtomicString& type, AnimationEvent(const AtomicString& type,
const String& animation_name, const String& animation_name,
double elapsed_time); double elapsed_time,
const String& pseudo_element);
AnimationEvent(const AtomicString&, const AnimationEventInit&); AnimationEvent(const AtomicString&, const AnimationEventInit&);
String animation_name_; String animation_name_;
double elapsed_time_; double elapsed_time_;
String pseudo_element_;
}; };
} // namespace blink } // namespace blink
......
...@@ -31,5 +31,5 @@ ...@@ -31,5 +31,5 @@
readonly attribute DOMString animationName; readonly attribute DOMString animationName;
// TODO(foolip): elapsedTime should be float. // TODO(foolip): elapsedTime should be float.
readonly attribute double elapsedTime; readonly attribute double elapsedTime;
// TODO(foolip): readonly attribute DOMString pseudoElement; readonly attribute DOMString pseudoElement;
}; };
...@@ -8,5 +8,5 @@ dictionary AnimationEventInit : EventInit { ...@@ -8,5 +8,5 @@ dictionary AnimationEventInit : EventInit {
DOMString animationName = ""; DOMString animationName = "";
// TODO(foolip): elapsedTime should be float. // TODO(foolip): elapsedTime should be float.
double elapsedTime = 0.0; double elapsedTime = 0.0;
// TODO(foolip): DOMString pseudoElement = ""; DOMString pseudoElement = "";
}; };
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment