<!DOCTYPE html> <meta charset=utf-8> <title>duration tests</title> <link rel="help" href="http://w3c.github.io/web-animations/#dom-animationeffecttiming-duration"> <link rel="author" title="Ryo Motozawa" href="mailto:motozawa@mozilla-japan.org"> <script src="/resources/testharness.js"></script> <script src="/resources/testharnessreport.js"></script> <script src="../../testcommon.js"></script> <body> <div id="log"></div> <script> 'use strict'; test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); anim.effect.timing.duration = 123.45; assert_times_equal(anim.effect.timing.duration, 123.45, 'set duration 123.45'); assert_times_equal(anim.effect.getComputedTiming().duration, 123.45, 'getComputedTiming() after set duration 123.45'); }, 'set duration 123.45'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); anim.effect.timing.duration = 'auto'; assert_equals(anim.effect.timing.duration, 'auto', 'set duration \'auto\''); assert_equals(anim.effect.getComputedTiming().duration, 0, 'getComputedTiming() after set duration \'auto\''); }, 'set duration auto'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, { duration: 'auto' }); assert_equals(anim.effect.timing.duration, 'auto', 'set duration \'auto\''); assert_equals(anim.effect.getComputedTiming().duration, 0, 'getComputedTiming() after set duration \'auto\''); }, 'set auto duration in animate as object'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); anim.effect.timing.duration = Infinity; assert_equals(anim.effect.timing.duration, Infinity, 'set duration Infinity'); assert_equals(anim.effect.getComputedTiming().duration, Infinity, 'getComputedTiming() after set duration Infinity'); }, 'set duration Infinity'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, -1); }); }, 'set negative duration in animate using a duration parameter'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, -Infinity); }); }, 'set negative Infinity duration in animate using a duration parameter'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, NaN); }); }, 'set NaN duration in animate using a duration parameter'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, { duration: -1 }); }); }, 'set negative duration in animate using an options object'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, { duration: -Infinity }); }); }, 'set negative Infinity duration in animate using an options object'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, { duration: NaN }); }); }, 'set NaN duration in animate using an options object'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, { duration: 'abc' }); }); }, 'set abc string duration in animate using an options object'); test(function(t) { var div = createDiv(t); assert_throws({ name: 'TypeError' }, function() { div.animate({ opacity: [ 0, 1 ] }, { duration: '100' }); }); }, 'set 100 string duration in animate using an options object'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); assert_throws({ name: 'TypeError' }, function() { anim.effect.timing.duration = -1; }); }, 'set negative duration'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); assert_throws({ name: 'TypeError' }, function() { anim.effect.timing.duration = -Infinity; }); }, 'set negative Infinity duration'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); assert_throws({ name: 'TypeError' }, function() { anim.effect.timing.duration = NaN; }); }, 'set NaN duration'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); assert_throws({ name: 'TypeError' }, function() { anim.effect.timing.duration = 'abc'; }); }, 'set duration abc'); test(function(t) { var div = createDiv(t); var anim = div.animate({ opacity: [ 0, 1 ] }, 2000); assert_throws({ name: 'TypeError' }, function() { anim.effect.timing.duration = '100'; }); }, 'set duration string 100'); </script> </body>