Chromium Code Reviews
chromiumcodereview-hr@appspot.gserviceaccount.com (chromiumcodereview-hr) | Please choose your nickname with Settings | Help | Chromium Project | Gerrit Changes | Sign out
(127)

Unified Diff: third_party/WebKit/LayoutTests/imported/web-platform-tests/web-animations/keyframe-effect/effect-easing.html

Issue 1899623002: Import latest web-platform-tests (Closed) Base URL: https://chromium.googlesource.com/chromium/src.git@master
Patch Set: handle new failures Created 4 years, 8 months ago
Use n/p to move between diff chunks; N/P to move between comments. Draft comments are only viewable by you.
Jump to:
View side-by-side diff with in-line comments
Download patch
Index: third_party/WebKit/LayoutTests/imported/web-platform-tests/web-animations/keyframe-effect/effect-easing.html
diff --git a/third_party/WebKit/LayoutTests/imported/web-platform-tests/web-animations/keyframe-effect/effect-easing.html b/third_party/WebKit/LayoutTests/imported/web-platform-tests/web-animations/keyframe-effect/effect-easing.html
index 9e518efb976cda9fe0109979d2d8bfc87e05a21e..76a9bd0691788870f0907114ff7b60f5868f7bef 100644
--- a/third_party/WebKit/LayoutTests/imported/web-platform-tests/web-animations/keyframe-effect/effect-easing.html
+++ b/third_party/WebKit/LayoutTests/imported/web-platform-tests/web-animations/keyframe-effect/effect-easing.html
@@ -434,5 +434,287 @@ test(function(t) {
'the lower boundary is infinity with keyframe easing producing ' +
'negative values');
+var gStepTimingFunctionTests = [
+ {
+ description: 'Test bounds point of step-start easing',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0 },
+ { currentTime: 999, progress: 0 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1499, progress: 0.5 },
+ { currentTime: 1500, progress: 1 },
+ { currentTime: 2000, progress: 1 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing with compositor',
+ keyframe: [ { opacity: 0 },
+ { opacity: 1 } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0 },
+ { currentTime: 999, progress: 0 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1499, progress: 0.5 },
+ { currentTime: 1500, progress: 1 },
+ { currentTime: 2000, progress: 1 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing with reverse direction',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ direction: 'reverse',
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 1 },
+ { currentTime: 1001, progress: 1 },
+ { currentTime: 1500, progress: 1 },
+ { currentTime: 1501, progress: 0.5 },
+ { currentTime: 2000, progress: 0 },
+ { currentTime: 2500, progress: 0 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing ' +
+ 'with iterationStart not at a transition point',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ iterationStart: 0.25,
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0.5 },
+ { currentTime: 999, progress: 0.5 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1249, progress: 0.5 },
+ { currentTime: 1250, progress: 1 },
+ { currentTime: 1749, progress: 1 },
+ { currentTime: 1750, progress: 0.5 },
+ { currentTime: 2000, progress: 0.5 },
+ { currentTime: 2500, progress: 0.5 },
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing ' +
+ 'with iterationStart and delay',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ iterationStart: 0.5,
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0.5 },
+ { currentTime: 999, progress: 0.5 },
+ { currentTime: 1000, progress: 1 },
+ { currentTime: 1499, progress: 1 },
+ { currentTime: 1500, progress: 0.5 },
+ { currentTime: 2000, progress: 1 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing ' +
+ 'with iterationStart and reverse direction',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ iterationStart: 0.5,
+ direction: 'reverse',
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 1 },
+ { currentTime: 1000, progress: 1 },
+ { currentTime: 1001, progress: 0.5 },
+ { currentTime: 1499, progress: 0.5 },
+ { currentTime: 1500, progress: 1 },
+ { currentTime: 1999, progress: 1 },
+ { currentTime: 2000, progress: 0.5 },
+ { currentTime: 2500, progress: 0.5 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step(4, start) easing ' +
+ 'with iterationStart 0.75 and delay',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ duration: 1000,
+ fill: 'both',
+ delay: 1000,
+ iterationStart: 0.75,
+ easing: 'steps(4, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0.75 },
+ { currentTime: 999, progress: 0.75 },
+ { currentTime: 1000, progress: 1 },
+ { currentTime: 2000, progress: 1 },
+ { currentTime: 2500, progress: 1 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing ' +
+ 'with alternate direction',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ duration: 1000,
+ fill: 'both',
+ delay: 1000,
+ iterations: 2,
+ iterationStart: 1.5,
+ direction: 'alternate',
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 1 },
+ { currentTime: 1000, progress: 1 },
+ { currentTime: 1001, progress: 0.5 },
+ { currentTime: 2999, progress: 1 },
+ { currentTime: 3000, progress: 0.5 },
+ { currentTime: 3500, progress: 0.5 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing ' +
+ 'with alternate-reverse direction',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ duration: 1000,
+ fill: 'both',
+ delay: 1000,
+ iterations: 2,
+ iterationStart: 0.5,
+ direction: 'alternate-reverse',
+ easing: 'steps(2, start)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 1 },
+ { currentTime: 1000, progress: 1 },
+ { currentTime: 1001, progress: 0.5 },
+ { currentTime: 2999, progress: 1 },
+ { currentTime: 3000, progress: 0.5 },
+ { currentTime: 3500, progress: 0.5 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-start easing in keyframe',
+ keyframe: [ { width: '0px', easing: 'steps(2, start)' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ },
+ conditions: [
+ { currentTime: 0, progress: 0, width: '0px' },
+ { currentTime: 999, progress: 0, width: '0px' },
+ { currentTime: 1000, progress: 0, width: '50px' },
+ { currentTime: 1499, progress: 0.499, width: '50px' },
+ { currentTime: 1500, progress: 0.5, width: '100px' },
+ { currentTime: 2000, progress: 1, width: '100px' },
+ { currentTime: 2500, progress: 1, width: '100px' }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-end easing ' +
+ 'with iterationStart and delay',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ duration: 1000,
+ fill: 'both',
+ delay: 1000,
+ iterationStart: 0.5,
+ easing: 'steps(2, end)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0 },
+ { currentTime: 999, progress: 0 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1499, progress: 0.5 },
+ { currentTime: 1500, progress: 0 },
+ { currentTime: 1999, progress: 0 },
+ { currentTime: 2000, progress: 0.5 },
+ { currentTime: 2500, progress: 0.5 }
+ ]
+ },
+ {
+ description: 'Test bounds point of step-end easing ' +
+ 'with iterationStart not at a transition point',
+ keyframe: [ { width: '0px' },
+ { width: '100px' } ],
+ effect: {
+ delay: 1000,
+ duration: 1000,
+ fill: 'both',
+ iterationStart: 0.75,
+ easing: 'steps(2, end)'
+ },
+ conditions: [
+ { currentTime: 0, progress: 0.5 },
+ { currentTime: 999, progress: 0.5 },
+ { currentTime: 1000, progress: 0.5 },
+ { currentTime: 1249, progress: 0.5 },
+ { currentTime: 1250, progress: 0 },
+ { currentTime: 1749, progress: 0 },
+ { currentTime: 1750, progress: 0.5 },
+ { currentTime: 2000, progress: 0.5 },
+ { currentTime: 2500, progress: 0.5 },
+ ]
+ }
+]
+
+gStepTimingFunctionTests.forEach(function(options) {
+ test(function(t) {
+ var target = createDiv(t);
+ var animation = target.animate(options.keyframe, options.effect);
+ options.conditions.forEach(function(condition) {
+ animation.currentTime = condition.currentTime;
+ if (typeof condition.progress !== 'undefined') {
+ assert_equals(animation.effect.getComputedTiming().progress,
+ condition.progress,
+ 'Progress at ' + animation.currentTime + 'ms');
+ }
+ if (typeof condition.width !== 'undefined') {
+ assert_equals(getComputedStyle(target).width,
+ condition.width,
+ 'Progress at ' + animation.currentTime + 'ms');
+ }
+ });
+ }, options.description);
+});
+
</script>
</body>

Powered by Google App Engine
This is Rietveld 408576698