Import WPT tests for CSS animations
https://bugs.webkit.org/show_bug.cgi?id=186046
Patch by Frederic Wang <fwang@igalia.com> on 2018-05-29
Reviewed by Youenn Fablet.
LayoutTests/imported/w3c:
* resources/import-expectations.json:
* web-platform-tests/css/css-animations/OWNERS: Added.
* web-platform-tests/css/css-animations/animation-delay-008-expected.html: Added.
* web-platform-tests/css/css-animations/animation-delay-008.html: Added.
* web-platform-tests/css/css-animations/animation-delay-009-expected.html: Added.
* web-platform-tests/css/css-animations/animation-delay-009.html: Added.
* web-platform-tests/css/css-animations/animation-delay-010-expected.html: Added.
* web-platform-tests/css/css-animations/animation-delay-010.html: Added.
* web-platform-tests/css/css-animations/animation-delay-011-expected.html: Added.
* web-platform-tests/css/css-animations/animation-delay-011.html: Added.
* web-platform-tests/css/css-animations/animation-iteration-count-calc-expected.txt: Added.
* web-platform-tests/css/css-animations/animation-iteration-count-calc.html: Added.
* web-platform-tests/css/css-animations/animationevent-interface-expected.txt: Added.
* web-platform-tests/css/css-animations/animationevent-interface.html: Added.
* web-platform-tests/css/css-animations/animationevent-interface.js: Added.
(test):
* web-platform-tests/css/css-animations/animationevent-pseudoelement-expected.txt: Added.
* web-platform-tests/css/css-animations/animationevent-pseudoelement.html: Added.
* web-platform-tests/css/css-animations/animationevent-types-expected.txt: Added.
* web-platform-tests/css/css-animations/animationevent-types.html: Added.
* web-platform-tests/css/css-animations/pending-style-changes-001-expected.txt: Added.
* web-platform-tests/css/css-animations/pending-style-changes-001.html: Added.
* web-platform-tests/css/css-animations/w3c-import.log: Added.
LayoutTests:
* TestExpectations: Mark some tests requiring support for reftest-wait as failing/flacky.
* tests-options.json: Mark animationevent-types.html as slow.
git-svn-id: http://svn.webkit.org/repository/webkit/trunk@232288 268f45cc-cd09-0410-ab3c-d52691b4dbfc
diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
index e5dde2e..6bfdce0 100644
--- a/LayoutTests/ChangeLog
+++ b/LayoutTests/ChangeLog
@@ -1,3 +1,13 @@
+2018-05-29 Frederic Wang <fwang@igalia.com>
+
+ Import WPT tests for CSS animations
+ https://bugs.webkit.org/show_bug.cgi?id=186046
+
+ Reviewed by Youenn Fablet.
+
+ * TestExpectations: Mark some tests requiring support for reftest-wait as failing/flacky.
+ * tests-options.json: Mark animationevent-types.html as slow.
+
2018-05-29 Nan Wang <n_wang@apple.com>
AX: macOS VoiceOver doesn't announce when details element is expanded when using role group
diff --git a/LayoutTests/TestExpectations b/LayoutTests/TestExpectations
index 3f58276..6adb191 100644
--- a/LayoutTests/TestExpectations
+++ b/LayoutTests/TestExpectations
@@ -1666,6 +1666,10 @@
webkit.org/b/183258 imported/w3c/web-platform-tests/css/css-text/word-break/word-break-normal-my-000.html [ ImageOnlyFailure ]
webkit.org/b/183258 imported/w3c/web-platform-tests/css/css-text/word-break/word-break-normal-tdd-000.html [ ImageOnlyFailure ]
+webkit.org/b/186045 imported/w3c/web-platform-tests/css/css-animations/animation-delay-008.html [ ImageOnlyFailure Pass ]
+webkit.org/b/186045 imported/w3c/web-platform-tests/css/css-animations/animation-delay-009.html [ ImageOnlyFailure Pass ]
+webkit.org/b/186045 imported/w3c/web-platform-tests/css/css-animations/animation-delay-010.html [ ImageOnlyFailure ]
+
########################################
### START OF display: contents failures
diff --git a/LayoutTests/imported/w3c/ChangeLog b/LayoutTests/imported/w3c/ChangeLog
index 8b7000b..5f3eeff 100644
--- a/LayoutTests/imported/w3c/ChangeLog
+++ b/LayoutTests/imported/w3c/ChangeLog
@@ -1,3 +1,34 @@
+2018-05-29 Frederic Wang <fwang@igalia.com>
+
+ Import WPT tests for CSS animations
+ https://bugs.webkit.org/show_bug.cgi?id=186046
+
+ Reviewed by Youenn Fablet.
+
+ * resources/import-expectations.json:
+ * web-platform-tests/css/css-animations/OWNERS: Added.
+ * web-platform-tests/css/css-animations/animation-delay-008-expected.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-008.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-009-expected.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-009.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-010-expected.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-010.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-011-expected.html: Added.
+ * web-platform-tests/css/css-animations/animation-delay-011.html: Added.
+ * web-platform-tests/css/css-animations/animation-iteration-count-calc-expected.txt: Added.
+ * web-platform-tests/css/css-animations/animation-iteration-count-calc.html: Added.
+ * web-platform-tests/css/css-animations/animationevent-interface-expected.txt: Added.
+ * web-platform-tests/css/css-animations/animationevent-interface.html: Added.
+ * web-platform-tests/css/css-animations/animationevent-interface.js: Added.
+ (test):
+ * web-platform-tests/css/css-animations/animationevent-pseudoelement-expected.txt: Added.
+ * web-platform-tests/css/css-animations/animationevent-pseudoelement.html: Added.
+ * web-platform-tests/css/css-animations/animationevent-types-expected.txt: Added.
+ * web-platform-tests/css/css-animations/animationevent-types.html: Added.
+ * web-platform-tests/css/css-animations/pending-style-changes-001-expected.txt: Added.
+ * web-platform-tests/css/css-animations/pending-style-changes-001.html: Added.
+ * web-platform-tests/css/css-animations/w3c-import.log: Added.
+
2018-05-29 Antoine Quint <graouts@apple.com>
[Web Animations] Handle relative length units
diff --git a/LayoutTests/imported/w3c/resources/import-expectations.json b/LayoutTests/imported/w3c/resources/import-expectations.json
index 4538892..811b989 100644
--- a/LayoutTests/imported/w3c/resources/import-expectations.json
+++ b/LayoutTests/imported/w3c/resources/import-expectations.json
@@ -61,6 +61,7 @@
"web-platform-tests/css-values": "skip",
"web-platform-tests/css/WOFF2": "import",
"web-platform-tests/css/css-align": "import",
+ "web-platform-tests/css/css-animations/": "import",
"web-platform-tests/css/css-color": "import",
"web-platform-tests/css/css-display": "import",
"web-platform-tests/css/css-grid": "import",
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/OWNERS b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/OWNERS
new file mode 100644
index 0000000..71540f5
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/OWNERS
@@ -0,0 +1,7 @@
+@plinss
+@chunywang
+@yunxiaoxie
+@grorg
+@dbaron
+@tabatkins
+@birtles
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008-expected.html
new file mode 100644
index 0000000..ddc7da6
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008-expected.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<style>
+div {
+ width: 100px;
+ height: 100px;
+ background-color: green;
+}
+</style>
+<div></div>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008.html
new file mode 100644
index 0000000..52883fa
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008.html
@@ -0,0 +1,37 @@
+<!doctype html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>CSS Animations Test: animation-delay - liveness</title>
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#animations">
+<meta name="assert" content="Check that changes to animation-delay on a running
+animation are reflected in output">
+<meta name="flags" content="dom">
+<link rel="match" href="animation-common-ref.html">
+<style>
+@keyframes two-step {
+ from { background-color: red }
+ 50% { background-color: green }
+ to { background-color: green }
+}
+div {
+ width: 100px;
+ height: 100px;
+ background-color: orange;
+}
+</style>
+<div></div>
+<script>
+// Set up animation with no delay
+var div = document.querySelector('div');
+div.style.animation = 'two-step 200s steps(1)';
+window.getComputedStyle(div).animation;
+
+// Wait until animation has started and change delay
+window.requestAnimationFrame(function() {
+ // Fast-forward to mid-point
+ div.style.animationDelay = '-100s';
+ document.documentElement.removeAttribute('class');
+});
+</script>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009-expected.html
new file mode 100644
index 0000000..ddc7da6
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009-expected.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<style>
+div {
+ width: 100px;
+ height: 100px;
+ background-color: green;
+}
+</style>
+<div></div>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009.html
new file mode 100644
index 0000000..6d25b8b
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009.html
@@ -0,0 +1,46 @@
+<!doctype html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>CSS Animations Test: animation-delay - liveness with animationend</title>
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#animations">
+<meta name="assert" content="Check that shortening the animation-delay triggers
+an animationend event">
+<meta name="flags" content="dom">
+<link rel="match" href="animation-common-ref.html">
+<style>
+@keyframes all-red {
+ from { background-color: red }
+ to { background-color: red }
+}
+div {
+ width: 100px;
+ height: 100px;
+ background-color: orange;
+}
+</style>
+<div></div>
+<script>
+// Set up animation with no delay
+var div = document.querySelector('div');
+div.style.animation = 'all-red 1000s';
+window.getComputedStyle(div).animation;
+
+// Set up an animationend event handler to change the background color
+div.addEventListener('animationend', function() {
+ div.style.animation = 'none';
+ div.style.backgroundColor = 'green';
+});
+
+// Wait until animation has started and change delay
+window.requestAnimationFrame(function() {
+ // Fast-forward to end
+ div.style.animationDelay = '-1000s';
+
+ // Wait a frame to allow the event handler to run
+ window.requestAnimationFrame(function() {
+ document.documentElement.removeAttribute('class');
+ });
+});
+</script>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010-expected.html
new file mode 100644
index 0000000..ddc7da6
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010-expected.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<style>
+div {
+ width: 100px;
+ height: 100px;
+ background-color: green;
+}
+</style>
+<div></div>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010.html
new file mode 100644
index 0000000..d18064d
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010.html
@@ -0,0 +1,46 @@
+<!doctype html>
+<html class="reftest-wait">
+<meta charset="utf-8">
+<title>CSS Animations Test: animation-delay - liveness with
+ animationstart</title>
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#animations">
+<meta name="assert" content="Check that extending the animation-delay triggers
+an animationstart event">
+<meta name="flags" content="dom">
+<link rel="match" href="animation-common-ref.html">
+<style>
+@keyframes all-orange {
+ from { background-color: orange }
+ to { background-color: orange }
+}
+div {
+ width: 100px;
+ height: 100px;
+ background-color: red;
+}
+</style>
+<div></div>
+<script>
+// Set up animation with a negative delay such that it finishes very soon
+var div = document.querySelector('div');
+div.style.animation = 'all-orange 1000s -999.99s';
+
+// Wait for the animation to finish
+div.addEventListener('animationend', function() {
+ // Set up an animationstart event handler to change the background color
+ div.addEventListener('animationstart', function() {
+ div.style.animation = 'none';
+ div.style.backgroundColor = 'green';
+ });
+
+ // Then extend the delay so that the animation restarts
+ div.style.animationDelay = '0s';
+
+ // Wait a frame to allow the event handler to run
+ window.requestAnimationFrame(function() {
+ document.documentElement.removeAttribute('class');
+ });
+});
+</script>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011-expected.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011-expected.html
new file mode 100644
index 0000000..ddc7da6
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011-expected.html
@@ -0,0 +1,13 @@
+<!doctype html>
+<html>
+<meta charset="utf-8">
+<link rel="author" title="Brian Birtles" href="mailto:bbirtles@mozilla.com">
+<style>
+div {
+ width: 100px;
+ height: 100px;
+ background-color: green;
+}
+</style>
+<div></div>
+</html>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011.html
new file mode 100644
index 0000000..415a574
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011.html
@@ -0,0 +1,24 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Animations Test: inherited animation-delay with mismatched animation-name length</title>
+<link rel="author" title="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#animations">
+<link rel="match" href="animation-common-ref.html">
+<style>
+div:after {
+ content: '';
+ display: block;
+ width: 100px;
+ height: 100px;
+ background: red;
+ animation: doesntmatter 50s linear infinite,
+ bg 100s step-end infinite;
+ animation-play-state: paused;
+ animation-delay: inherit;
+}
+
+@keyframes bg {
+ 50% { background: green; }
+}
+</style>
+<div style="animation-delay: -50s"></div>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc-expected.txt
new file mode 100644
index 0000000..e767daa
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc-expected.txt
@@ -0,0 +1,3 @@
+
+PASS calc() should be accepted in animation-iteration-count.
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc.html
new file mode 100644
index 0000000..44e1e96
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc.html
@@ -0,0 +1,15 @@
+<!doctype html>
+<meta charset="utf-8">
+<title>CSS Test: Animation count accepts calc()</title>
+<link rel="author" name="Emilio Cobos Álvarez" href="mailto:emilio@crisal.io">
+<link rel="help" href="https://drafts.csswg.org/css-values-3/#number-value">
+<link rel="help" href="https://drafts.csswg.org/css-animations/#animation-iteration-count">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<div id="target" style="animation-iteration-count: calc(1 + 3)">
+<script>
+test(function() {
+ let target = document.getElementById("target");
+ assert_equals(getComputedStyle(target).animationIterationCount, "4")
+}, "calc() should be accepted in animation-iteration-count.");
+</script>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface-expected.txt
new file mode 100644
index 0000000..c4454a8
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface-expected.txt
@@ -0,0 +1,19 @@
+
+PASS the event is an instance of AnimationEvent
+PASS the event inherts from Event
+PASS Missing type argument
+PASS type argument is string
+PASS type argument is null
+PASS event type set to undefined
+PASS animationName has default value of empty string
+PASS elapsedTime has default value of 0.0
+PASS animationName is readonly
+PASS elapsedTime is readonly
+PASS animationEventInit argument is null
+PASS animationEventInit argument is undefined
+PASS animationEventInit argument is empty dictionary
+FAIL AnimationEvent.pseudoElement initialized from the dictionary assert_equals: expected (string) "::testPseudo" but got (undefined) undefined
+PASS animationName set to 'sample'
+PASS elapsedTime set to 0.5
+PASS AnimationEventInit properties set value
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.html
new file mode 100644
index 0000000..5b1bc42
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.html
@@ -0,0 +1,10 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<title>CSS Animations Test: AnimationEvent interface</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#interface-dom">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<script src="animationevent-interface.js"></script>
+<div id="log"></div>
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.js b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.js
new file mode 100644
index 0000000..56d30a4
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.js
@@ -0,0 +1,92 @@
+(function() {
+ test(function() {
+ var event = new AnimationEvent("");
+ assert_true(event instanceof window.AnimationEvent);
+ }, "the event is an instance of AnimationEvent");
+
+ test(function() {
+ var event = new AnimationEvent("");
+ assert_true(event instanceof window.Event);
+ }, "the event inherts from Event");
+
+ test(function() {
+ assert_throws(new TypeError(), function() {
+ new AnimationEvent();
+ }, 'First argument is required, so was expecting a TypeError.');
+ }, 'Missing type argument');
+
+ test(function() {
+ var event = new AnimationEvent("test");
+ assert_equals(event.type, "test");
+ }, "type argument is string");
+
+ test(function() {
+ var event = new AnimationEvent(null);
+ assert_equals(event.type, "null");
+ }, "type argument is null");
+
+ test(function() {
+ var event = new AnimationEvent(undefined);
+ assert_equals(event.type, "undefined");
+ }, "event type set to undefined");
+
+ test(function() {
+ var event = new AnimationEvent("test");
+ assert_equals(event.animationName, "");
+ }, "animationName has default value of empty string");
+
+ test(function() {
+ var event = new AnimationEvent("test");
+ assert_equals(event.elapsedTime, 0.0);
+ }, "elapsedTime has default value of 0.0");
+
+ test(function() {
+ var event = new AnimationEvent("test");
+ assert_readonly(event, "animationName", "readonly attribute value");
+ }, "animationName is readonly");
+
+ test(function() {
+ var event = new AnimationEvent("test");
+ assert_readonly(event, "elapsedTime", "readonly attribute value");
+ }, "elapsedTime is readonly");
+
+ test(function() {
+ var event = new AnimationEvent("test", null);
+ assert_equals(event.animationName, "");
+ assert_equals(event.elapsedTime, 0.0);
+ }, "animationEventInit argument is null");
+
+ test(function() {
+ var event = new AnimationEvent("test", undefined);
+ assert_equals(event.animationName, "");
+ assert_equals(event.elapsedTime, 0.0);
+ }, "animationEventInit argument is undefined");
+
+ test(function() {
+ var event = new AnimationEvent("test", {});
+ assert_equals(event.animationName, "");
+ assert_equals(event.elapsedTime, 0.0);
+ }, "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() {
+ var event = new AnimationEvent("test", {animationName: "sample"});
+ assert_equals(event.animationName, "sample");
+ }, "animationName set to 'sample'");
+
+ test(function() {
+ var event = new AnimationEvent("test", {elapsedTime: 0.5});
+ assert_equals(event.elapsedTime, 0.5);
+ }, "elapsedTime set to 0.5");
+
+ test(function() {
+ var eventInit = {animationName: "sample", elapsedTime: 0.5};
+ var event = new AnimationEvent("test", eventInit);
+ assert_equals(event.animationName, "sample");
+ assert_equals(event.elapsedTime, 0.5);
+ }, "AnimationEventInit properties set value");
+})();
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement-expected.txt
new file mode 100644
index 0000000..3647925
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement-expected.txt
@@ -0,0 +1,3 @@
+
+FAIL AnimationEvent should have the correct pseudoElement memeber assert_equals: expected (string) "::before" but got (undefined) undefined
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement.html
new file mode 100644
index 0000000..8de41cc
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement.html
@@ -0,0 +1,29 @@
+<!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>
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types-expected.txt
new file mode 100644
index 0000000..8ccc394
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types-expected.txt
@@ -0,0 +1,6 @@
+Filler Text
+
+FAIL animationstart event is instanceof AnimationEvent assert_idl_attribute: animationstart has pseudoElement property property "pseudoElement" not found in prototype chain
+FAIL animationend event is instanceof AnimationEvent assert_idl_attribute: animationstart has pseudoElement property property "pseudoElement" not found in prototype chain
+FAIL animationiteration event is instanceof AnimationEvent assert_idl_attribute: animationstart has pseudoElement property property "pseudoElement" not found in prototype chain
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types.html
new file mode 100644
index 0000000..77f514a
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types.html
@@ -0,0 +1,84 @@
+<!DOCTYPE html>
+<meta charset="utf-8">
+<meta name="timeout" content="long">
+<title>CSS Animations Test: AnimationEvnt types - animationstart, animationend,animationiteration</title>
+<link rel="author" title="Intel" href="http://www.intel.com">
+<link rel="help" href="https://drafts.csswg.org/css-animations-1/#event-animationevent">
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+<style>
+ #test {
+ animation-name: sample;
+ animation-duration: 2s;
+ animation-delay: -1s;
+ animation-iteration-count: 2;
+
+ background-color: blue;
+ height: 100px;
+ width: 100px;
+ position: relative;
+ }
+
+ @keyframes sample {
+ from {
+ left: 150px;
+ }
+ to {
+ left: 0px;
+ }
+ }
+</style>
+<div id="test">Filler Text</div>
+<div id="log"></div>
+<script>
+ var testDiv = document.getElementById("test");
+
+ async_test(function(t) {
+ testDiv.addEventListener("animationstart", t.step_func(function(evt) {
+ assert_true(evt instanceof window.AnimationEvent);
+
+ assert_idl_attribute(evt, "animationName", "animationstart has animationName 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.elapsedTime, 1, "animationstart has elapsedTime value");
+ assert_equals(evt.pseudoElement, "", "animaitonstart has correct pseudoElement value");
+
+ t.done();
+ }), true);
+ }, "animationstart event is instanceof AnimationEvent");
+
+ async_test(function(t) {
+ testDiv.addEventListener("animationend", t.step_func(function(evt) {
+ assert_true(evt instanceof window.AnimationEvent);
+
+ assert_idl_attribute(evt, "animationName", "animationend has animationName 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.elapsedTime, 4, "animationend has elapsedTime value");
+ assert_equals(evt.pseudoElement, "", "animaitonstart has correct pseudoElement value");
+
+ t.done();
+ }), true);
+ }, "animationend event is instanceof AnimationEvent");
+
+ async_test(function(t) {
+ testDiv.addEventListener("animationiteration", t.step_func(function(evt) {
+ assert_true(evt instanceof window.AnimationEvent);
+
+ assert_idl_attribute(evt, "animationName", "animationiteration has animationName 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.elapsedTime, 2, "animationiteration has elapsedTime value");
+ assert_equals(evt.pseudoElement, "", "animaitonstart has correct pseudoElement value");
+
+ t.done();
+ }), true);
+ }, "animationiteration event is instanceof AnimationEvent");
+</script>
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001-expected.txt b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001-expected.txt
new file mode 100644
index 0000000..6ceafd4
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001-expected.txt
@@ -0,0 +1,4 @@
+
+FAIL Animatable::getAnimations() should be able to see a style-created CSS animation immediately assert_equals: target.getAnimations() should include the CSS animation after animate class added. expected 1 but got 0
+FAIL Document::getAnimations() should be able to see a style-created CSS animation immediately assert_equals: document.getAnimations() should include the CSS animation after animate class added. expected 1 but got 0
+
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001.html b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001.html
new file mode 100644
index 0000000..fb74d7f
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001.html
@@ -0,0 +1,34 @@
+<meta charset=utf-8>
+<title>CSS Animations Test: requirement on pending style changes - getAnimations</title>
+<link rel="help" href="https://drafts.csswg.org/css-animations-2/#requirements-on-pending-style-changes">
+
+<script src="/resources/testharness.js"></script>
+<script src="/resources/testharnessreport.js"></script>
+
+<style>
+@keyframes anim {}
+
+.animate {
+ animation: anim 10s;
+}
+</style>
+
+<div id="target"></div>
+
+<script>
+test (t => {
+ assert_equals(target.getAnimations().length, 0, 'Test precondition.');
+ target.classList.add('animate');
+ assert_equals(target.getAnimations().length, 1,
+ 'target.getAnimations() should include the CSS animation after animate class added.');
+ target.classList.remove('animate');
+}, 'Animatable::getAnimations() should be able to see a style-created CSS animation immediately');
+
+test(t => {
+ assert_equals(document.getAnimations().length, 0, 'Test precondition.');
+ target.classList.add('animate');
+ assert_equals(document.getAnimations().length, 1,
+ 'document.getAnimations() should include the CSS animation after animate class added.');
+ target.classList.remove('animate');
+}, 'Document::getAnimations() should be able to see a style-created CSS animation immediately');
+</script>
diff --git a/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/w3c-import.log b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/w3c-import.log
new file mode 100644
index 0000000..b07c2e4
--- /dev/null
+++ b/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/w3c-import.log
@@ -0,0 +1,31 @@
+The tests in this directory were imported from the W3C repository.
+Do NOT modify these tests directly in WebKit.
+Instead, create a pull request on the WPT github:
+ https://github.com/w3c/web-platform-tests
+
+Then run the Tools/Scripts/import-w3c-tests in WebKit to reimport
+
+Do NOT modify or remove this file.
+
+------------------------------------------------------------------------
+Properties requiring vendor prefixes:
+None
+Property values requiring vendor prefixes:
+None
+------------------------------------------------------------------------
+List of files:
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/OWNERS
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008-expected.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-008.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009-expected.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-009.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010-expected.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-010.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011-expected.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-delay-011.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animation-iteration-count-calc.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-interface.js
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-pseudoelement.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/animationevent-types.html
+/LayoutTests/imported/w3c/web-platform-tests/css/css-animations/pending-style-changes-001.html
diff --git a/LayoutTests/tests-options.json b/LayoutTests/tests-options.json
index 654efdf..06066e7 100644
--- a/LayoutTests/tests-options.json
+++ b/LayoutTests/tests-options.json
@@ -404,6 +404,9 @@
"imported/w3c/web-platform-tests/cors/status-async.htm": [
"slow"
],
+ "imported/w3c/web-platform-tests/css/css-animations/animationevent-types.html": [
+ "slow"
+ ],
"imported/w3c/web-platform-tests/dom/nodes/Document-characterSet-normalization.html": [
"slow"
],
