From e190516708bd1eac423514e5201cfb07a4e7a631 Mon Sep 17 00:00:00 2001
From: Brian Birtles <birtles@gmail.com>
Date: Mon, 4 Jun 2018 10:20:54 +0900
Subject: [PATCH] Bug 1466031 - Use arrow functions in
 dom/animation/test/css-animations/; r=hiro

--HG--
extra : rebase_source : 2446c48d66750142e5c3a544f115beb859043ac8
---
 .../css-animations/test_animation-cancel.html |  38 +++---
 .../test_animation-computed-timing.html       | 109 ++++++++++--------
 .../test_animation-currenttime.html           |  73 ++++++------
 .../css-animations/test_animation-finish.html |  10 +-
 .../test_animation-finished.html              |  18 +--
 .../css-animations/test_animation-id.html     |   2 +-
 .../test_animation-pausing.html               |  34 +++---
 .../test_animation-playstate.html             |  10 +-
 .../css-animations/test_animation-ready.html  |  36 +++---
 .../test_animation-reverse.html               |   2 +-
 .../test_animation-starttime.html             |  86 +++++++-------
 .../test_animations-dynamic-changes.html      |  26 ++---
 .../test_cssanimation-animationname.html      |   6 +-
 .../test_document-get-animations.html         |  32 ++---
 .../css-animations/test_effect-target.html    |   6 +-
 .../test_element-get-animations.html          |  64 +++++-----
 .../css-animations/test_event-dispatch.html   |   4 +-
 .../test/css-animations/test_event-order.html |   8 +-
 .../test_keyframeeffect-getkeyframes.html     |  56 +++++----
 .../test_pseudoElement-get-animations.html    |   4 +-
 .../css-animations/test_setting-effect.html   |  24 ++--
 21 files changed, 324 insertions(+), 324 deletions(-)

diff --git a/dom/animation/test/css-animations/test_animation-cancel.html b/dom/animation/test/css-animations/test_animation-cancel.html
index acb1e6361bab..dab9cc49617b 100644
--- a/dom/animation/test/css-animations/test_animation-cancel.html
+++ b/dom/animation/test/css-animations/test_animation-cancel.html
@@ -20,11 +20,11 @@
 <script>
 'use strict';
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: translateAnim 100s' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_not_equals(getComputedStyle(div).transform, 'none',
                       'transform style is animated before cancelling');
     animation.cancel();
@@ -33,12 +33,12 @@ promise_test(function(t) {
   });
 }, 'Animated style is cleared after cancelling a running CSS animation');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: translateAnim 100s forwards' });
   var animation = div.getAnimations()[0];
   animation.finish();
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_not_equals(getComputedStyle(div).transform, 'none',
                       'transform style is filling before cancelling');
     animation.cancel();
@@ -47,7 +47,7 @@ promise_test(function(t) {
   });
 }, 'Animated style is cleared after cancelling a filling CSS animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: marginLeftAnim 100s linear' });
   var animation = div.getAnimations()[0];
   animation.cancel();
@@ -61,12 +61,12 @@ test(function(t) {
                 + ' seeked');
 }, 'After canceling an animation, it can still be seeked');
 
-promise_test(function(t) {
+promise_test(t => {
   var div =
     addDiv(t, { style: 'animation: marginLeftAnim100To200 100s linear' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     animation.cancel();
     assert_equals(getComputedStyle(div).marginLeft, '0px',
                   'margin-left style is not animated after cancelling');
@@ -74,13 +74,13 @@ promise_test(function(t) {
     assert_equals(getComputedStyle(div).marginLeft, '100px',
                   'margin-left style is animated after re-starting animation');
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.playState, 'running',
                   'Animation succeeds in running after being re-started');
   });
 }, 'After cancelling an animation, it can still be re-used');
 
-test(function(t) {
+test(t => {
   var div =
     addDiv(t, { style: 'animation: marginLeftAnim100To200 100s linear' });
   var animation = div.getAnimations()[0];
@@ -99,7 +99,7 @@ test(function(t) {
 }, 'After cancelling an animation, updating animation properties doesn\'t make'
    + ' it live again');
 
-test(function(t) {
+test(t => {
   var div =
     addDiv(t, { style: 'animation: marginLeftAnim100To200 100s linear' });
   var animation = div.getAnimations()[0];
@@ -133,40 +133,40 @@ test(function(t) {
 }, 'After cancelling an animation, updating animation-play-state doesn\'t'
    + ' make it live again');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: translateAnim 10s both' });
   div.style.marginLeft = '0px';
 
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_equals(animation.playState, 'running');
 
     div.style.animationName = 'none';
     flushComputedStyle(div);
     return waitForFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.playState, 'idle');
     assert_equals(getComputedStyle(div).marginLeft, '0px');
   });
 }, 'Setting animation-name to \'none\' cancels the animation');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: translateAnim 10s both' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_equals(animation.playState, 'running');
 
     div.style.display = 'none';
     return waitForFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.playState, 'idle');
     assert_equals(getComputedStyle(div).marginLeft, '0px');
   });
 }, 'Setting display:none on an element cancel its animations');
 
-promise_test(function(t) {
+promise_test(t => {
   var parentDiv = addDiv(t);
   var childDiv  = document.createElement('div');
   parentDiv.appendChild(childDiv);
@@ -176,12 +176,12 @@ promise_test(function(t) {
 
   var animation = childDiv.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_equals(animation.playState, 'running');
 
     parentDiv.style.display = 'none';
     return waitForFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.playState, 'idle');
     assert_equals(getComputedStyle(childDiv).marginLeft, '0px');
   });
diff --git a/dom/animation/test/css-animations/test_animation-computed-timing.html b/dom/animation/test/css-animations/test_animation-computed-timing.html
index 1a4202edacbf..cb8594bbe569 100644
--- a/dom/animation/test/css-animations/test_animation-computed-timing.html
+++ b/dom/animation/test/css-animations/test_animation-computed-timing.html
@@ -18,21 +18,22 @@
 // --------------------
 // delay
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().delay, 0,
                 'Initial value of delay');
 }, 'delay of a new animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s -10s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().delay, -10 * MS_PER_SEC,
                 'Initial value of delay');
 }, 'Negative delay of a new animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 10s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().delay, 10 * MS_PER_SEC,
@@ -43,7 +44,8 @@ test(function(t) {
 // --------------------
 // endDelay
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().endDelay, 0,
@@ -54,8 +56,9 @@ test(function(t) {
 // --------------------
 // fill
 // --------------------
-test(function(t) {
-  var getEffectWithFill = function(fill) {
+
+test(t => {
+  var getEffectWithFill = fill => {
     var div = addDiv(t, {style: 'animation: moveAnimation 100s ' + fill});
     return div.getAnimations()[0].effect;
   };
@@ -78,7 +81,8 @@ test(function(t) {
 // --------------------
 // iterationStart
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().iterationStart, 0,
@@ -89,21 +93,22 @@ test(function(t) {
 // --------------------
 // iterations
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().iterations, 1,
                 'Initial value of iterations');
 }, 'iterations of a new animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 2016.5'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().iterations, 2016.5,
                 'Initial value of iterations');
 }, 'iterations of a finitely repeating animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s infinite'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().iterations, Infinity,
@@ -114,7 +119,8 @@ test(function(t) {
 // --------------------
 // duration
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s -10s infinite'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().duration, 100 * MS_PER_SEC,
@@ -125,8 +131,9 @@ test(function(t) {
 // --------------------
 // direction
 // --------------------
-test(function(t) {
-  var getEffectWithDir = function(dir) {
+
+test(t => {
+  var getEffectWithDir = dir => {
     var div = addDiv(t, {style: 'animation: moveAnimation 100s ' + dir});
     return div.getAnimations()[0].effect;
   };
@@ -149,7 +156,8 @@ test(function(t) {
 // --------------------
 // easing
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().easing, 'linear',
@@ -161,14 +169,15 @@ test(function(t) {
 // endTime
 // = max(start delay + active duration + end delay, 0)
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().endTime, 100 * MS_PER_SEC,
                 'Initial value of endTime');
 }, 'endTime of an new animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s -5s'});
   var effect = div.getAnimations()[0].effect;
   var answer = (100 - 5) * MS_PER_SEC;
@@ -176,21 +185,21 @@ test(function(t) {
                 'Initial value of endTime');
 }, 'endTime of an animation with a negative delay');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 10s -100s infinite'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().endTime, Infinity,
                 'Initial value of endTime');
 }, 'endTime of an infinitely repeating animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 100s infinite'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().endTime, 100 * MS_PER_SEC,
                 'Initial value of endTime');
 }, 'endTime of an infinitely repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   // Fill forwards so div.getAnimations()[0] won't return an
   // undefined value.
   var div = addDiv(t, {style: 'animation: moveAnimation 10s -100s forwards'});
@@ -204,7 +213,8 @@ test(function(t) {
 // activeDuration
 // = iteration duration * iteration count
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 5'});
   var effect = div.getAnimations()[0].effect;
   var answer = 100 * MS_PER_SEC * 5;
@@ -212,14 +222,14 @@ test(function(t) {
                 'Initial value of activeDuration');
 }, 'activeDuration of a new animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s infinite'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().activeDuration, Infinity,
                 'Initial value of activeDuration');
 }, 'activeDuration of an infinitely repeating animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 1s infinite'});
   var effect = div.getAnimations()[0].effect;
   // If either the iteration duration or iteration count are zero,
@@ -228,7 +238,7 @@ test(function(t) {
                 'Initial value of activeDuration');
 }, 'activeDuration of an infinitely repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 1s 0'});
   var effect = div.getAnimations()[0].effect;
   // If either the iteration duration or iteration count are zero,
@@ -241,14 +251,15 @@ test(function(t) {
 // --------------------
 // localTime
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().localTime, 0,
                 'Initial value of localTime');
 }, 'localTime of a new animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var anim = div.getAnimations()[0];
   anim.currentTime = 5 * MS_PER_SEC;
@@ -256,23 +267,23 @@ test(function(t) {
                 'current localTime after setting currentTime');
 }, 'localTime of an animation is always equal to currentTime');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
 
   var anim = div.getAnimations()[0];
   anim.playbackRate = 2; // 2 times faster
 
-  return anim.ready.then(function() {
+  return anim.ready.then(() => {
     assert_equals(anim.effect.getComputedTiming().localTime, anim.currentTime,
                   'localTime is equal to currentTime');
     return waitForFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(anim.effect.getComputedTiming().localTime, anim.currentTime,
                   'localTime is equal to currentTime');
   });
 }, 'localTime reflects playbackRate immediately');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   var effect = new KeyframeEffect(div, {left: ["0px", "100px"]});
 
@@ -285,13 +296,14 @@ test(function(t) {
 // progress
 // Note: Default timing function is linear.
 // --------------------
-test(function(t) {
+
+test(t => {
   [{fill: '',          progress: [ null, null ]},
    {fill: 'none',      progress: [ null, null ]},
    {fill: 'forwards',  progress: [ null, 1.0 ]},
    {fill: 'backwards', progress: [ 0.0, null ]},
    {fill: 'both',      progress: [ 0.0, 1.0 ]}]
-  .forEach(function(test) {
+  .forEach(test => {
     var div =
       addDiv(t, {style: 'animation: moveAnimation 100s 10s ' + test.fill});
     var anim = div.getAnimations()[0];
@@ -303,7 +315,7 @@ test(function(t) {
   });
 }, 'progress of an animation with different fill modes');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 10s 10 both'});
   var anim = div.getAnimations()[0];
 
@@ -323,7 +335,7 @@ test(function(t) {
                 'Value of progress');
 }, 'progress of an integral repeating animation with normal direction');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   // Note: FillMode here is "both" because
   // 1. Since this a zero-duration animation, it will already have finished
@@ -342,7 +354,7 @@ test(function(t) {
                 'Value of progress before phase');
 }, 'progress of an infinitely repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   // Default iterations = 1
   var div = addDiv(t, {style: 'animation: moveAnimation 0s both'});
   var anim = div.getAnimations()[0];
@@ -356,7 +368,7 @@ test(function(t) {
                 'Value of progress before phase');
 }, 'progress of a finitely repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 5s 10.25 both'});
   var anim = div.getAnimations()[0];
 
@@ -370,7 +382,7 @@ test(function(t) {
                 'Value of progress in after phase');
 }, 'progress of a non-integral repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 5s 10.25 both reverse'});
   var anim = div.getAnimations()[0];
 
@@ -384,7 +396,7 @@ test(function(t) {
 }, 'Progress of a non-integral repeating zero-duration animation ' +
    'with reversing direction');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 10s 10.25 both alternate'});
   var anim = div.getAnimations()[0];
 
@@ -405,7 +417,7 @@ test(function(t) {
 }, 'progress of a non-integral repeating animation ' +
    'with alternate direction');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 10s 10.25 both alternate-reverse'});
   var anim = div.getAnimations()[0];
 
@@ -426,7 +438,7 @@ test(function(t) {
 }, 'progress of a non-integral repeating animation ' +
    'with alternate-reversing direction');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 10.25 both alternate'});
   var anim = div.getAnimations()[0];
 
@@ -444,7 +456,7 @@ test(function(t) {
 }, 'progress of a non-integral repeating zero-duration animation ' +
    'with alternate direction');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 10.25 both alternate-reverse'});
   var anim = div.getAnimations()[0];
 
@@ -466,7 +478,8 @@ test(function(t) {
 // --------------------
 // currentIteration
 // --------------------
-test(function(t) {
+
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 2s'});
   var effect = div.getAnimations()[0].effect;
   assert_equals(effect.getComputedTiming().currentIteration, null,
@@ -474,14 +487,14 @@ test(function(t) {
 }, 'currentIteration of a new animation with no backwards fill is unresolved ' +
    'in before phase');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s'});
   var anim = div.getAnimations()[0];
   assert_equals(anim.effect.getComputedTiming().currentIteration, 0,
                 'Initial value of currentIteration');
 }, 'currentIteration of a new animation is zero');
 
-test(function(t) {
+test(t => {
   // Note: FillMode here is "both" because
   // 1. Since this a zero-duration animation, it will already have finished
   //    so it won't be returned by getAnimations() unless it fills forwards.
@@ -499,7 +512,7 @@ test(function(t) {
                 'Value of currentIteration count during before phase');
 }, 'currentIteration of an infinitely repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 0s 10.5 both'});
   var anim = div.getAnimations()[0];
 
@@ -513,7 +526,7 @@ test(function(t) {
                 'Value of currentIteration count during before phase');
 }, 'currentIteration of a finitely repeating zero-duration animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 5.5 forwards'});
   var anim = div.getAnimations()[0];
 
@@ -530,7 +543,7 @@ test(function(t) {
                 'Value of currentIteration in after phase');
 }, 'currentIteration of an animation with a non-integral iteration count');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s 2 forwards'});
   var anim = div.getAnimations()[0];
 
@@ -542,7 +555,7 @@ test(function(t) {
                 'Value of currentIteration in after phase');
 }, 'currentIteration of an animation with an integral iteration count');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {style: 'animation: moveAnimation 100s forwards'});
   var anim = div.getAnimations()[0];
   assert_equals(anim.effect.getComputedTiming().currentIteration, 0,
@@ -553,7 +566,7 @@ test(function(t) {
                 'Value of currentIteration in after phase');
 }, 'currentIteration of an animation with a default iteration count');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   var effect = new KeyframeEffect(div, {left: ["0px", "100px"]});
 
diff --git a/dom/animation/test/css-animations/test_animation-currenttime.html b/dom/animation/test/css-animations/test_animation-currenttime.html
index 9e3e6cb1a2b0..2f9ff45b0f0b 100644
--- a/dom/animation/test/css-animations/test_animation-currenttime.html
+++ b/dom/animation/test/css-animations/test_animation-currenttime.html
@@ -45,8 +45,7 @@
 const CSS_ANIM_EVENTS =
   ['animationstart', 'animationiteration', 'animationend'];
 
-test(function(t)
-{
+test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = "anim 100s";
   var animation = div.getAnimations()[0];
@@ -65,13 +64,13 @@ test(function(t)
 }, 'Sanity test to check round-tripping assigning to new animation\'s ' +
    'currentTime');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     // the 0.0001 here is for rounding error
     assert_less_than_equal(animation.currentTime,
       animation.timeline.currentTime - animation.startTime + 0.0001,
@@ -81,13 +80,13 @@ promise_test(function(t) {
 
     animation.currentTime = 100 * MS_PER_SEC;
     return eventWatcher.wait_for('animationstart');
-  }).then(function() {
+  }).then(() => {
     animation.currentTime = 200 * MS_PER_SEC;
     return eventWatcher.wait_for('animationend');
   });
 }, 'Skipping forward through animation');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
@@ -95,8 +94,7 @@ promise_test(function(t) {
   animation.currentTime = 200 * MS_PER_SEC;
   var previousTimelineTime = animation.timeline.currentTime;
 
-  return eventWatcher.wait_for(['animationstart',
-                                'animationend']).then(function() {
+  return eventWatcher.wait_for(['animationstart', 'animationend']).then(() => {
     assert_true(document.timeline.currentTime - previousTimelineTime <
                 100 * MS_PER_SEC,
                 'Sanity check that seeking worked rather than the events ' +
@@ -105,7 +103,7 @@ promise_test(function(t) {
 
     animation.currentTime = 150 * MS_PER_SEC;
     return eventWatcher.wait_for('animationstart');
-  }).then(function() {
+  }).then(() => {
     animation.currentTime = 0;
     return eventWatcher.wait_for('animationend');
   });
@@ -120,7 +118,7 @@ promise_test(function(t) {
 // have happened, then assume that no events will ever be dispatched for the
 // redundant changes if no events were detected in that time.
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
@@ -132,7 +130,7 @@ promise_test(function(t) {
   return waitForAnimationFrames(2);
 }, 'Redundant change, before -> active, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
@@ -144,13 +142,13 @@ promise_test(function(t) {
   return waitForAnimationFrames(2);
 }, 'Redundant change, before -> after, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
-  var retPromise = eventWatcher.wait_for('animationstart').then(function() {
+  var retPromise = eventWatcher.wait_for('animationstart').then(() => {
     animation.currentTime = 50 * MS_PER_SEC;
     animation.currentTime = 150 * MS_PER_SEC;
 
@@ -162,13 +160,13 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, active -> before, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
-  var retPromise = eventWatcher.wait_for('animationstart').then(function() {
+  var retPromise = eventWatcher.wait_for('animationstart').then(() => {
     animation.currentTime = 250 * MS_PER_SEC;
     animation.currentTime = 150 * MS_PER_SEC;
 
@@ -180,14 +178,14 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, active -> after, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
   var retPromise =  eventWatcher.wait_for(['animationstart',
-                                           'animationend']).then(function() {
+                                           'animationend']).then(() => {
     animation.currentTime = 50 * MS_PER_SEC;
     animation.currentTime = 250 * MS_PER_SEC;
 
@@ -199,14 +197,14 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, after -> before, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
   var retPromise =  eventWatcher.wait_for(['animationstart',
-                                           'animationend']).then(function() {
+                                           'animationend']).then(() => {
     animation.currentTime = 150 * MS_PER_SEC;
     animation.currentTime = 250 * MS_PER_SEC;
 
@@ -218,7 +216,7 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, after -> active, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s"
@@ -227,20 +225,19 @@ promise_test(function(t) {
   animation.pause();
   animation.currentTime = 150 * MS_PER_SEC;
 
-  return eventWatcher.wait_for(['animationstart',
-                                'animationend']).then(function() {
+  return eventWatcher.wait_for(['animationstart', 'animationend']).then(() => {
     animation.currentTime = 50 * MS_PER_SEC;
     return eventWatcher.wait_for('animationstart');
   });
 }, 'Seeking finished -> paused dispatches animationstart');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = "anim 100s";
 
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     var exception;
     try {
       animation.currentTime = null;
@@ -253,49 +250,49 @@ promise_test(function(t) {
   });
 }, 'Setting currentTime to null');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s';
 
   var animation = div.getAnimations()[0];
   var pauseTime;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_not_equals(animation.currentTime, null,
       'Animation.currentTime not null on ready Promise resolve');
     animation.pause();
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     pauseTime = animation.currentTime;
     return waitForFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.currentTime, pauseTime,
       'Animation.currentTime is unchanged after pausing');
   });
 }, 'Animation.currentTime after pausing');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = "anim 100s";
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     // just before animation ends:
     animation.currentTime = 100 * MS_PER_SEC - 1;
     return waitForAnimationFrames(2);
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.currentTime, 100 * MS_PER_SEC,
       'Animation.currentTime should not continue to increase after the ' +
       'animation has finished');
   });
 }, 'Animation.currentTime clamping');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = "anim 100s";
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     // play backwards:
     animation.playbackRate = -1;
 
@@ -303,14 +300,14 @@ promise_test(function(t) {
     animation.currentTime = 1;
 
     return waitForAnimationFrames(2);
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.currentTime, 0,
       'Animation.currentTime should not continue to decrease after an ' +
       'animation running in reverse has finished and currentTime is zero');
   });
 }, 'Animation.currentTime clamping for reversed animation');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s';
   var animation = div.getAnimations()[0];
@@ -320,12 +317,12 @@ test(function(t) {
                 'The currentTime of a cancelled animation should be null');
 }, 'Animation.currentTime after cancelling');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s';
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     animation.finish();
 
     // Initiate a pause then abort it
@@ -334,7 +331,7 @@ promise_test(function(t) {
 
     // Wait to return to running state
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_true(animation.currentTime < 100 * 1000,
                 'After aborting a pause when finished, the currentTime should'
                 + ' jump back towards the start of the animation');
diff --git a/dom/animation/test/css-animations/test_animation-finish.html b/dom/animation/test/css-animations/test_animation-finish.html
index e73b816b0c9c..450ccfffae23 100644
--- a/dom/animation/test/css-animations/test_animation-finish.html
+++ b/dom/animation/test/css-animations/test_animation-finish.html
@@ -18,7 +18,7 @@
 const ANIM_PROP_VAL = 'anim 100s';
 const ANIM_DURATION = 100000; // ms
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = ANIM_PROP_VAL;
   div.style.animationIterationCount = 'infinite';
@@ -38,12 +38,12 @@ test(function(t) {
               'infinite animation');
 }, 'Test exceptions when finishing infinite animation');
 
-async_test(function(t) {
+async_test(t => {
   var div = addDiv(t);
   div.style.animation = ANIM_PROP_VAL + ' paused';
   var animation = div.getAnimations()[0];
 
-  animation.ready.then(t.step_func(function() {
+  animation.ready.then(t.step_func(() => {
     animation.finish();
     assert_equals(animation.playState, 'finished',
                   'The play state of a paused animation should become ' +
@@ -56,7 +56,7 @@ async_test(function(t) {
   }));
 }, 'Test finish() while paused');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = ANIM_PROP_VAL + ' paused';
   var animation = div.getAnimations()[0];
@@ -77,7 +77,7 @@ test(function(t) {
                      'be set after calling finish()');
 }, 'Test finish() while pause-pending with positive playbackRate');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = ANIM_PROP_VAL + ' paused';
   var animation = div.getAnimations()[0];
diff --git a/dom/animation/test/css-animations/test_animation-finished.html b/dom/animation/test/css-animations/test_animation-finished.html
index f2b9bf7b909d..ae162881c3f5 100644
--- a/dom/animation/test/css-animations/test_animation-finished.html
+++ b/dom/animation/test/css-animations/test_animation-finished.html
@@ -17,16 +17,16 @@
 const ANIM_PROP_VAL = 'abc 100s';
 const ANIM_DURATION = 100 * MS_PER_SEC;
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   // Set up pending animation
   div.style.animation = ANIM_PROP_VAL;
   var animation = div.getAnimations()[0];
   var previousFinishedPromise = animation.finished;
   // Set up listeners on finished promise
-  var retPromise = animation.finished.then(function() {
+  var retPromise = animation.finished.then(() => {
     assert_unreached('finished promise is fulfilled');
-  }).catch(function(err) {
+  }).catch(err => {
     assert_equals(err.name, 'AbortError',
                   'finished promise is rejected with AbortError');
     assert_not_equals(animation.finished, previousFinishedPromise,
@@ -42,7 +42,7 @@ promise_test(function(t) {
 }, 'finished promise is rejected when an animation is cancelled by resetting ' +
    'the animation property');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   // As before, but this time instead of removing all animations, simply update
   // the list of animations. At least for Firefox, updating is a different
@@ -54,9 +54,9 @@ promise_test(function(t) {
   var previousFinishedPromise = animation.finished;
 
   // Set up listeners on finished promise
-  var retPromise = animation.finished.then(function() {
+  var retPromise = animation.finished.then(() => {
     assert_unreached('finished promise was fulfilled');
-  }).catch(function(err) {
+  }).catch(err => {
     assert_equals(err.name, 'AbortError',
                   'finished promise is rejected with AbortError');
     assert_not_equals(animation.finished, previousFinishedPromise,
@@ -72,16 +72,16 @@ promise_test(function(t) {
 }, 'finished promise is rejected when an animation is cancelled by changing ' +
    'the animation property');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = ANIM_PROP_VAL;
   var animation = div.getAnimations()[0];
   var previousFinishedPromise = animation.finished;
   animation.currentTime = ANIM_DURATION;
-  return animation.finished.then(function() {
+  return animation.finished.then(() => {
     div.style.animationPlayState = 'running';
     return waitForAnimationFrames(2);
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.finished, previousFinishedPromise,
                   'Should not replay when animation-play-state changes to ' +
                   '"running" on finished animation');
diff --git a/dom/animation/test/css-animations/test_animation-id.html b/dom/animation/test/css-animations/test_animation-id.html
index bb5ed3a9a3a9..e0333e2f5914 100644
--- a/dom/animation/test/css-animations/test_animation-id.html
+++ b/dom/animation/test/css-animations/test_animation-id.html
@@ -11,7 +11,7 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'abc 100s';
   var animation = div.getAnimations()[0];
diff --git a/dom/animation/test/css-animations/test_animation-pausing.html b/dom/animation/test/css-animations/test_animation-pausing.html
index 861eb48368ec..842898723278 100644
--- a/dom/animation/test/css-animations/test_animation-pausing.html
+++ b/dom/animation/test/css-animations/test_animation-pausing.html
@@ -14,11 +14,9 @@
 <script>
 'use strict';
 
-function getMarginLeft(cs) {
-  return parseFloat(cs.marginLeft);
-}
+const getMarginLeft = cs => parseFloat(cs.marginLeft);
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s paused';
@@ -27,13 +25,13 @@ promise_test(function(t) {
                 'Initial value of margin-left is zero');
   animation.play();
 
-  return animation.ready.then(waitForNextFrame).then(function() {
+  return animation.ready.then(waitForNextFrame).then(() => {
     assert_greater_than(getMarginLeft(cs), 0,
                         'Playing value of margin-left is greater than zero');
   });
 }, 'play() overrides animation-play-state');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s paused';
@@ -44,7 +42,7 @@ promise_test(function(t) {
   animation.pause();
   div.style.animationPlayState = 'running';
 
-  return animation.ready.then(waitForNextFrame).then(function() {
+  return animation.ready.then(waitForNextFrame).then(() => {
     assert_equals(cs.animationPlayState, 'running',
                   'animation-play-state is running');
     assert_equals(getMarginLeft(cs), 0,
@@ -52,7 +50,7 @@ promise_test(function(t) {
   });
 }, 'pause() overrides animation-play-state');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s paused';
@@ -62,28 +60,28 @@ promise_test(function(t) {
   animation.play();
   var previousAnimVal;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'running';
     cs.animationPlayState; // Trigger style resolution
     return waitForNextFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(cs.animationPlayState, 'running',
                   'animation-play-state is running');
     div.style.animationPlayState = 'paused';
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_equals(cs.animationPlayState, 'paused',
                   'animation-play-state is paused');
     previousAnimVal = getMarginLeft(cs);
     return waitForNextFrame();
-  }).then(function() {
+  }).then(() => {
     assert_equals(getMarginLeft(cs), previousAnimVal,
                   'Animated value of margin-left does not change when'
                   + ' paused by style');
   });
 }, 'play() is overridden by later setting "animation-play-state: paused"');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s';
@@ -98,7 +96,7 @@ promise_test(function(t) {
   animation.play();
   var previousAnimVal = getMarginLeft(cs);
 
-  return animation.ready.then(waitForNextFrame).then(function() {
+  return animation.ready.then(waitForNextFrame).then(() => {
     assert_equals(cs.animationPlayState, 'paused',
                   'animation-play-state is paused');
     assert_greater_than(getMarginLeft(cs), previousAnimVal,
@@ -106,7 +104,7 @@ promise_test(function(t) {
   });
 }, 'play() flushes pending changes to animation-play-state first');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s paused';
@@ -128,7 +126,7 @@ promise_test(function(t) {
   animation.pause();
   var previousAnimVal = getMarginLeft(cs);
 
-  return animation.ready.then(waitForNextFrame).then(function() {
+  return animation.ready.then(waitForNextFrame).then(() => {
     assert_equals(cs.animationPlayState, 'running',
                   'animation-play-state is running');
     assert_equals(getMarginLeft(cs), previousAnimVal,
@@ -137,12 +135,12 @@ promise_test(function(t) {
 }, 'pause() applies pending changes to animation-play-state first');
 // (Note that we can't actually test for this; see comment above, in test-body.)
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: anim 1000s' });
   var animation = div.getAnimations()[0];
   var readyPromiseRun = false;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'paused';
     assert_true(animation.pending && animation.playState === 'paused',
                 'Animation is pause-pending');
diff --git a/dom/animation/test/css-animations/test_animation-playstate.html b/dom/animation/test/css-animations/test_animation-playstate.html
index 234a78527089..912d9ff868d6 100644
--- a/dom/animation/test/css-animations/test_animation-playstate.html
+++ b/dom/animation/test/css-animations/test_animation-playstate.html
@@ -11,7 +11,7 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s';
@@ -19,7 +19,7 @@ test(function(t) {
   assert_equals(animation.playState, 'running');
 }, 'Animation returns correct playState when running');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s paused';
@@ -27,7 +27,7 @@ test(function(t) {
   assert_equals(animation.playState, 'paused');
 }, 'Animation returns correct playState when paused');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s';
@@ -36,7 +36,7 @@ test(function(t) {
   assert_equals(animation.playState, 'paused');
 }, 'Animation.playState updates when paused by script');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   var cs = getComputedStyle(div);
   div.style.animation = 'anim 1000s paused';
@@ -49,7 +49,7 @@ test(function(t) {
                 + ' animation-play-state (got: ' + animation.playState + ')');
 }, 'Animation.playState updates when resumed by setting style');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim 1000s';
   var animation = div.getAnimations()[0];
diff --git a/dom/animation/test/css-animations/test_animation-ready.html b/dom/animation/test/css-animations/test_animation-ready.html
index 3660e0e20cc8..9bb20a9af9db 100644
--- a/dom/animation/test/css-animations/test_animation-ready.html
+++ b/dom/animation/test/css-animations/test_animation-ready.html
@@ -13,13 +13,13 @@
 <script>
 'use strict';
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'abc 100s paused';
   var animation = div.getAnimations()[0];
   var originalReadyPromise = animation.ready;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'running';
     assert_not_equals(animation.ready, originalReadyPromise,
                       'After updating animation-play-state a new ready promise'
@@ -27,7 +27,7 @@ promise_test(function(t) {
   });
 }, 'A new ready promise is created when setting animation-play-state: running');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
 
   // Set up pending animation
@@ -36,9 +36,9 @@ promise_test(function(t) {
   assert_true(animation.pending, 'Animation is initially pending');
 
   // Set up listeners on ready promise
-  var retPromise = animation.ready.then(function() {
+  var retPromise = animation.ready.then(() => {
     assert_unreached('ready promise is fulfilled');
-  }).catch(function(err) {
+  }).catch(err => {
     assert_equals(err.name, 'AbortError',
                   'ready promise is rejected with AbortError');
   });
@@ -51,7 +51,7 @@ promise_test(function(t) {
 }, 'ready promise is rejected when an animation is canceled by resetting'
    + ' the animation property');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
 
   // As before, but this time instead of removing all animations, simply update
@@ -64,9 +64,9 @@ promise_test(function(t) {
   assert_true(animation.pending, 'Animation is initially pending');
 
   // Set up listeners on ready promise
-  var retPromise = animation.ready.then(function() {
+  var retPromise = animation.ready.then(() => {
     assert_unreached('ready promise was fulfilled');
-  }).catch(function(err) {
+  }).catch(err => {
     assert_equals(err.name, 'AbortError',
                   'ready promise is rejected with AbortError');
   });
@@ -79,12 +79,12 @@ promise_test(function(t) {
 }, 'ready promise is rejected when an animation is cancelled by updating'
    + ' the animation property');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: abc 100s' });
   var animation = div.getAnimations()[0];
   var originalReadyPromise = animation.ready;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'paused';
     assert_not_equals(animation.ready, originalReadyPromise,
                       'A new Promise object is generated when setting'
@@ -92,11 +92,11 @@ promise_test(function(t) {
   });
 }, 'A new ready promise is created when setting animation-play-state: paused');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: abc 100s' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'paused';
     var firstReadyPromise = animation.ready;
     animation.pause();
@@ -105,11 +105,11 @@ promise_test(function(t) {
   });
 }, 'Pausing twice re-uses the same Promise');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: abc 100s' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'paused';
 
     // Flush style and verify we're pending at the same time
@@ -124,20 +124,20 @@ promise_test(function(t) {
                   + ' to pause');
 
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_true(!animation.pending && animation.playState === 'running',
                 'Animation is running after aborting a pause');
   });
 }, 'If a pause operation is interrupted, the ready promise is reused');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: abc 100s' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'paused';
     return animation.ready;
-  }).then(function(resolvedAnimation) {
+  }).then(resolvedAnimation => {
     assert_equals(resolvedAnimation, animation,
                   'Promise received when ready Promise for a pause operation'
                   + ' is completed is the animation on which the pause was'
diff --git a/dom/animation/test/css-animations/test_animation-reverse.html b/dom/animation/test/css-animations/test_animation-reverse.html
index 9f78bca80be9..fa8973e25c10 100644
--- a/dom/animation/test/css-animations/test_animation-reverse.html
+++ b/dom/animation/test/css-animations/test_animation-reverse.html
@@ -13,7 +13,7 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
   div.style.animation = "";
diff --git a/dom/animation/test/css-animations/test_animation-starttime.html b/dom/animation/test/css-animations/test_animation-starttime.html
index c50a5e7af105..5af525122c02 100644
--- a/dom/animation/test/css-animations/test_animation-starttime.html
+++ b/dom/animation/test/css-animations/test_animation-starttime.html
@@ -45,49 +45,44 @@
 const CSS_ANIM_EVENTS =
   ['animationstart', 'animationiteration', 'animationend'];
 
-test(function(t)
-{
+test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
 
   assert_equals(animation.startTime, null, 'startTime is unresolved');
 }, 'startTime of a newly created (play-pending) animation is unresolved');
 
-test(function(t)
-{
+test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s paused' });
   var animation = div.getAnimations()[0];
   assert_equals(animation.startTime, null, 'startTime is unresolved');
 }, 'startTime of a newly created (pause-pending) animation is unresolved');
 
-promise_test(function(t)
-{
+promise_test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_true(animation.startTime > 0,
                 'startTime is resolved when running');
   });
 }, 'startTime is resolved when running');
 
-promise_test(function(t)
-{
+promise_test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s paused' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_equals(animation.startTime, null,
                   'startTime is unresolved when paused');
   });
 }, 'startTime is unresolved when paused');
 
-promise_test(function(t)
-{
+promise_test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     div.style.animationPlayState = 'paused';
     getComputedStyle(div).animationPlayState;
 
@@ -102,13 +97,13 @@ promise_test(function(t)
   });
 }, 'startTime while pause-pending and play-pending');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
   // Seek to end to put us in the finished state
   animation.currentTime = 100 * MS_PER_SEC;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     // Call play() which puts us back in the running state
     animation.play();
 
@@ -116,7 +111,7 @@ promise_test(function(t) {
   });
 }, 'startTime while play-pending from finished state');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { 'style': 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
   animation.finish();
@@ -126,14 +121,14 @@ test(function(t) {
   assert_equals(animation.startTime, null, 'startTime is unresolved');
 }, 'startTime while play-pending from finished state using finish()');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, { style: 'animation: anim 100s' });
   var animation = div.getAnimations()[0];
 
   assert_equals(animation.startTime, null, 'The initial startTime is null');
   var initialTimelineTime = document.timeline.currentTime;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_true(animation.startTime > initialTimelineTime,
                 'After the animation has started, startTime is greater than ' +
                 'the time when it was started');
@@ -148,15 +143,14 @@ promise_test(function(t) {
     assert_equals(animation.startTime, startTimeBeforePausing,
                   'The startTime does not change when pausing-pending');
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.startTime, null,
                   'After actually pausing, the startTime of an animation ' +
                   'is null');
   });
 }, 'Pausing should make the startTime become null');
 
-test(function(t)
-{
+test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s 100s';
   var animation = div.getAnimations()[0];
@@ -168,26 +162,26 @@ test(function(t)
 }, 'Sanity test to check round-tripping assigning to a new animation\'s ' +
    'startTime');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = 'anim 100s 100s';
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_less_than_equal(animation.startTime, animation.timeline.currentTime,
       'Animation.startTime should be less than the timeline\'s ' +
       'currentTime on the first paint tick after animation creation');
 
     animation.startTime = animation.timeline.currentTime - 100 * MS_PER_SEC;
     return eventWatcher.wait_for('animationstart');
-  }).then(function() {
+  }).then(() => {
     animation.startTime = animation.timeline.currentTime - 200 * MS_PER_SEC;
     return eventWatcher.wait_for('animationend');
   });
 }, 'Skipping forward through animation');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = 'anim 100s 100s';
@@ -196,7 +190,7 @@ promise_test(function(t) {
   var previousTimelineTime = animation.timeline.currentTime;
 
   return eventWatcher.wait_for(['animationstart',
-                                'animationend']).then(function() {
+                                'animationend']).then(() => {
     assert_true(document.timeline.currentTime - previousTimelineTime <
                   100 * MS_PER_SEC,
                 'Sanity check that seeking worked rather than the events ' +
@@ -209,14 +203,14 @@ promise_test(function(t) {
     // in the active interval), we now expect an 'animationstart' event
     // because the animation should go from being inactive to active.
     return eventWatcher.wait_for('animationstart');
-  }).then(function() {
+  }).then(() => {
     animation.startTime = animation.timeline.currentTime;
 
     // Despite going backwards from just after the active interval starts to
     // the animation start time, we now expect an animationend event
     // because we went from inside to outside the active interval.
     return eventWatcher.wait_for('animationend');
-  }).then(function() {
+  }).then(() => {
     assert_less_than_equal(animation.startTime, animation.timeline.currentTime,
       'Animation.startTime should be less than the timeline\'s ' +
       'currentTime on the first paint tick after animation creation');
@@ -232,7 +226,7 @@ promise_test(function(t) {
 // have happened, then assume that no events will ever be dispatched for the
 // redundant changes if no events were detected in that time.
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
@@ -244,7 +238,7 @@ promise_test(function(t) {
   return waitForAnimationFrames(2);
 }, 'Redundant change, before -> active, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
@@ -256,13 +250,13 @@ promise_test(function(t) {
   return waitForAnimationFrames(2);
 }, 'Redundant change, before -> after, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
-  var retPromise =  eventWatcher.wait_for('animationstart').then(function() {
+  var retPromise =  eventWatcher.wait_for('animationstart').then(() => {
     animation.startTime = animation.timeline.currentTime - 50 * MS_PER_SEC;
     animation.startTime = animation.timeline.currentTime - 150 * MS_PER_SEC;
 
@@ -274,13 +268,13 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, active -> before, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
-  var retPromise = eventWatcher.wait_for('animationstart').then(function() {
+  var retPromise = eventWatcher.wait_for('animationstart').then(() => {
     animation.startTime = animation.timeline.currentTime - 250 * MS_PER_SEC;
     animation.startTime = animation.timeline.currentTime - 150 * MS_PER_SEC;
 
@@ -292,14 +286,14 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, active -> after, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
   var retPromise = eventWatcher.wait_for(['animationstart',
-                                          'animationend']).then(function() {
+                                          'animationend']).then(() => {
     animation.startTime = animation.timeline.currentTime - 50 * MS_PER_SEC;
     animation.startTime = animation.timeline.currentTime - 250 * MS_PER_SEC;
 
@@ -311,14 +305,14 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, after -> before, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   var eventWatcher = new EventWatcher(t, div, CSS_ANIM_EVENTS);
   div.style.animation = "anim 100s 100s";
   var animation = div.getAnimations()[0];
 
   var retPromise = eventWatcher.wait_for(['animationstart',
-                                          'animationend']).then(function() {
+                                          'animationend']).then(() => {
     animation.startTime = animation.timeline.currentTime - 150 * MS_PER_SEC;
     animation.startTime = animation.timeline.currentTime - 250 * MS_PER_SEC;
 
@@ -331,28 +325,28 @@ promise_test(function(t) {
   return retPromise;
 }, 'Redundant change, after -> active, then back');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s 100s';
   var animation = div.getAnimations()[0];
   var storedCurrentTime;
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     storedCurrentTime = animation.currentTime;
     animation.startTime = null;
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.currentTime, storedCurrentTime,
       'Test that hold time is correct');
   });
 }, 'Setting startTime to null');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s';
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     var savedStartTime = animation.startTime;
 
     assert_not_equals(animation.startTime, null,
@@ -360,7 +354,7 @@ promise_test(function(t) {
 
     animation.pause();
     return animation.ready;
-  }).then(function() {
+  }).then(() => {
     assert_equals(animation.startTime, null,
       'Animation.startTime is null after paused');
     assert_equals(animation.playState, 'paused',
@@ -368,12 +362,12 @@ promise_test(function(t) {
   });
 }, 'Animation.startTime after pausing');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t, {'class': 'animated-div'});
   div.style.animation = 'anim 100s';
   var animation = div.getAnimations()[0];
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     animation.cancel();
     assert_equals(animation.startTime, null,
                   'The startTime of a cancelled animation should be null');
diff --git a/dom/animation/test/css-animations/test_animations-dynamic-changes.html b/dom/animation/test/css-animations/test_animations-dynamic-changes.html
index 91ec7ccc9792..16b3607d42d5 100644
--- a/dom/animation/test/css-animations/test_animations-dynamic-changes.html
+++ b/dom/animation/test/css-animations/test_animations-dynamic-changes.html
@@ -14,7 +14,7 @@
 <script>
 'use strict';
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s';
   var originalAnimation = div.getAnimations()[0];
@@ -23,14 +23,14 @@ promise_test(function(t) {
 
   // Wait a moment so we can confirm the startTime doesn't change (and doesn't
   // simply reflect the current time).
-  return originalAnimation.ready.then(function() {
+  return originalAnimation.ready.then(() => {
     originalStartTime = originalAnimation.startTime;
     originalCurrentTime = originalAnimation.currentTime;
 
     // Wait a moment so we can confirm the startTime doesn't change (and
     // doesn't simply reflect the current time).
     return waitForNextFrame();
-  }).then(function() {
+  }).then(() => {
     div.style.animationDuration = '200s';
     var animation = div.getAnimations()[0];
     assert_equals(animation, originalAnimation,
@@ -46,7 +46,7 @@ promise_test(function(t) {
   });
 }, 'Animations preserve their startTime when changed');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s, anim1 100s';
 
@@ -64,7 +64,7 @@ test(function(t) {
                 'Second Animation is in same position after update');
 }, 'Updated Animations maintain their order in the list');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 200s, anim1 100s';
 
@@ -76,7 +76,7 @@ promise_test(function(t) {
   // Wait before continuing so we can compare start times (otherwise the
   // new Animation objects and existing Animation objects will all have the same
   // start time).
-  return waitForAllAnimations(animations).then(waitForFrame).then(function() {
+  return waitForAllAnimations(animations).then(waitForFrame).then(() => {
     // Swap duration of first and second in list and prepend animation at the
     // same time
     div.style.animation = 'anim1 100s, anim1 100s, anim1 200s';
@@ -91,19 +91,19 @@ promise_test(function(t) {
                   'Old Animations have the same start time');
     // TODO: Check that animations[0].startTime === null
     return animations[0].ready;
-  }).then(function() {
+  }).then(() => {
     assert_greater_than(animations[0].startTime, animations[1].startTime,
                         'New Animation has later start time');
   });
 }, 'Only the startTimes of existing animations are preserved');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s, anim1 100s';
   var secondAnimation = div.getAnimations()[1];
 
   // Wait before continuing so we can compare start times
-  return secondAnimation.ready.then(waitForNextFrame).then(function() {
+  return secondAnimation.ready.then(waitForNextFrame).then(() => {
     // Trim list of animations
     div.style.animationName = 'anim1';
     var animations = div.getAnimations();
@@ -119,7 +119,7 @@ promise_test(function(t) {
 }, 'Animations are removed from the start of the list while preserving'
    + ' the state of existing Animations');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s';
   var firstAddedAnimation = div.getAnimations()[0],
@@ -127,13 +127,13 @@ promise_test(function(t) {
       animations;
 
   // Wait and add second Animation
-  return firstAddedAnimation.ready.then(waitForFrame).then(function() {
+  return firstAddedAnimation.ready.then(waitForFrame).then(() => {
     div.style.animation = 'anim1 100s, anim1 100s';
     secondAddedAnimation = div.getAnimations()[0];
 
     // Wait again and add another Animation
     return secondAddedAnimation.ready.then(waitForFrame);
-  }).then(function() {
+  }).then(() => {
     div.style.animation = 'anim1 100s, anim2 100s, anim1 100s';
     animations = div.getAnimations();
     assert_not_equals(firstAddedAnimation, secondAddedAnimation,
@@ -145,7 +145,7 @@ promise_test(function(t) {
                   'First Animation remains in same position after'
                   + ' interleaving');
     return animations[1].ready;
-  }).then(function() {
+  }).then(() => {
     assert_greater_than(animations[1].startTime, animations[0].startTime,
                         'Interleaved animation starts later than existing ' +
                         'animations');
diff --git a/dom/animation/test/css-animations/test_cssanimation-animationname.html b/dom/animation/test/css-animations/test_cssanimation-animationname.html
index 09b3c8b3e0ee..f0eee95673eb 100644
--- a/dom/animation/test/css-animations/test_cssanimation-animationname.html
+++ b/dom/animation/test/css-animations/test_cssanimation-animationname.html
@@ -13,21 +13,21 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'xyz 100s';
   assert_equals(div.getAnimations()[0].animationName, 'xyz',
                 'Animation name matches keyframes rule name');
 }, 'Animation name makes keyframe rule');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'x\\yz 100s';
   assert_equals(div.getAnimations()[0].animationName, 'xyz',
                 'Escaped animation name matches keyframes rule name');
 }, 'Escaped animation name');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'x\\79 z 100s';
   assert_equals(div.getAnimations()[0].animationName, 'xyz',
diff --git a/dom/animation/test/css-animations/test_document-get-animations.html b/dom/animation/test/css-animations/test_document-get-animations.html
index 8286a35acd2c..0541750e1d32 100644
--- a/dom/animation/test/css-animations/test_document-get-animations.html
+++ b/dom/animation/test/css-animations/test_document-get-animations.html
@@ -28,13 +28,13 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   assert_equals(document.getAnimations().length, 0,
     'getAnimations returns an empty sequence for a document'
     + ' with no animations');
 }, 'getAnimations for non-animated content');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   // Add an animation
@@ -53,7 +53,7 @@ test(function(t) {
                 'getAnimations returns no running CSS Animations');
 }, 'getAnimations for CSS Animations');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'animLeft 100s, animTop 100s, animRight 100s, ' +
                         'animBottom 100s';
@@ -71,7 +71,7 @@ test(function(t) {
                 'Order of fourth animation returned');
 }, 'Order of CSS Animations - within an element');
 
-test(function(t) {
+test(t => {
   var div1 = addDiv(t, { style: 'animation: animLeft 100s' });
   var div2 = addDiv(t, { style: 'animation: animLeft 100s' });
   var div3 = addDiv(t, { style: 'animation: animLeft 100s' });
@@ -112,7 +112,7 @@ test(function(t) {
 
 }, 'Order of CSS Animations - across elements');
 
-test(function(t) {
+test(t => {
   var div1 = addDiv(t, { style: 'animation: animLeft 100s, animTop 100s' });
   var div2 = addDiv(t, { style: 'animation: animBottom 100s' });
 
@@ -122,7 +122,7 @@ test(function(t) {
   var animations = document.getAnimations();
   assert_equals(animations.length, expectedResults.length,
                 'getAnimations returns all running CSS Animations');
-  animations.forEach(function(anim, i) {
+  animations.forEach((anim, i) => {
     assert_equals(anim.effect.target, expectedResults[i][0],
                   'Target of animation in position ' + i);
     assert_equals(anim.animationName, expectedResults[i][1],
@@ -141,7 +141,7 @@ test(function(t) {
   assert_equals(animations.length, expectedResults.length,
                 'getAnimations returns all running CSS Animations after ' +
                 'making changes');
-  animations.forEach(function(anim, i) {
+  animations.forEach((anim, i) => {
     assert_equals(anim.effect.target, expectedResults[i][0],
                   'Target of animation in position ' + i + ' after changes');
     assert_equals(anim.animationName, expectedResults[i][1],
@@ -149,7 +149,7 @@ test(function(t) {
   });
 }, 'Order of CSS Animations - across and within elements');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s, animTop 100s' });
   var animLeft = document.getAnimations()[0];
   assert_equals(animLeft.animationName, 'animLeft',
@@ -167,7 +167,7 @@ test(function(t) {
   assert_equals(animations[1], animLeft, 'Free animations come last');
 }, 'Order of CSS Animations - markup-bound vs free animations');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s, animTop 100s' });
   var animLeft = document.getAnimations()[0];
   var animTop  = document.getAnimations()[1];
@@ -193,7 +193,7 @@ test(function(t) {
                 ' does not change');
 }, 'Order of CSS Animations - free animations');
 
-test(function(t) {
+test(t => {
   // Add an animation first
   var div = addDiv(t, { style: 'animation: animLeft 100s' });
   div.style.top = '0px';
@@ -212,34 +212,34 @@ test(function(t) {
   assert_class_string(animations[1], 'CSSAnimation', 'Animation comes second');
 }, 'Order of CSS Animations and CSS Transitions');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s forwards' });
   div.getAnimations()[0].finish();
   assert_equals(document.getAnimations().length, 1,
                 'Forwards-filling CSS animations are returned');
 }, 'Finished but filling CSS Animations are returned');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s' });
   div.getAnimations()[0].finish();
   assert_equals(document.getAnimations().length, 0,
                 'Non-filling finished CSS animations are not returned');
 }, 'Finished but not filling CSS Animations are not returned');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s 100s' });
   assert_equals(document.getAnimations().length, 1,
                 'Yet-to-start CSS animations are returned');
 }, 'Yet-to-start CSS Animations are returned');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s' });
   div.getAnimations()[0].cancel();
   assert_equals(document.getAnimations().length, 0,
                 'CSS animations cancelled by the API are not returned');
 }, 'CSS Animations cancelled via the API are not returned');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: animLeft 100s' });
   var anim = div.getAnimations()[0];
   anim.cancel();
@@ -249,7 +249,7 @@ test(function(t) {
                 'returned');
 }, 'CSS Animations cancelled and restarted via the API are returned');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '#parent::after': 'animation: animLeft 10s;',
                 '#parent::before': 'animation: animRight 10s;' });
   // create two divs with these arrangement:
diff --git a/dom/animation/test/css-animations/test_effect-target.html b/dom/animation/test/css-animations/test_effect-target.html
index 93010dbf9353..29977f840120 100644
--- a/dom/animation/test/css-animations/test_effect-target.html
+++ b/dom/animation/test/css-animations/test_effect-target.html
@@ -17,7 +17,7 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim 100s';
   var animation = div.getAnimations()[0];
@@ -25,7 +25,7 @@ test(function(t) {
     'Animation.target is the animatable div');
 }, 'Returned CSS animations have the correct effect target');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '.after::after': 'animation: anim 10s, anim 100s;' });
   var div = addDiv(t, { class: 'after' });
   var anims = document.getAnimations();
@@ -35,7 +35,7 @@ test(function(t) {
                 'Both animations return the same target object');
 }, 'effect.target should return the same CSSPseudoElement object each time');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '.after::after': 'animation: anim 10s;' });
   var div = addDiv(t, { class: 'after' });
   var pseudoTarget = document.getAnimations()[0].effect.target;
diff --git a/dom/animation/test/css-animations/test_element-get-animations.html b/dom/animation/test/css-animations/test_element-get-animations.html
index 6ab7a1a18225..4435f9ad9d9a 100644
--- a/dom/animation/test/css-animations/test_element-get-animations.html
+++ b/dom/animation/test/css-animations/test_element-get-animations.html
@@ -26,14 +26,14 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   assert_equals(div.getAnimations().length, 0,
     'getAnimations returns an empty sequence for an element'
     + ' with no animations');
 }, 'getAnimations for non-animated content');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
 
   // FIXME: This test does too many things. It should be split up.
@@ -43,7 +43,7 @@ promise_test(function(t) {
   var animations = div.getAnimations();
   assert_equals(animations.length, 1,
     'getAnimations returns an Animation running CSS Animations');
-  return animations[0].ready.then(function() {
+  return animations[0].ready.then(() => {
     var startTime = animations[0].startTime;
     assert_true(startTime > 0 && startTime <= document.timeline.currentTime,
       'CSS animation has a sensible start time');
@@ -53,7 +53,7 @@ promise_test(function(t) {
     // We wait for the next frame so that we can test that the start times of
     // the animations differ.
     return waitForFrame();
-  }).then(function() {
+  }).then(() => {
     div.style.animation = 'anim1 100s, anim2 100s';
     animations = div.getAnimations();
     assert_equals(animations.length, 2,
@@ -63,20 +63,20 @@ promise_test(function(t) {
     // (We don't make any assumptions about the order of the Animations since
     //  that is the purpose of the following test.)
     return waitForAllAnimations(animations);
-  }).then(function() {
+  }).then(() => {
     assert_true(animations[0].startTime < animations[1].startTime,
       'Additional Animations for CSS animations start after the original'
       + ' animation and appear later in the list');
   });
 }, 'getAnimations for CSS Animations');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { style: 'animation: anim1 100s' });
   assert_class_string(div.getAnimations()[0], 'CSSAnimation',
                       'Interface of returned animation is CSSAnimation');
 }, 'getAnimations returns CSSAnimation objects for CSS Animations');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   // Add an animation that targets multiple properties
@@ -86,7 +86,7 @@ test(function(t) {
     + ' that targets multiple properties');
 }, 'getAnimations for multi-property animations');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
 
   // Add an animation
@@ -96,7 +96,7 @@ promise_test(function(t) {
 
   // Wait until a frame after the animation starts, then add a transition
   var animations = div.getAnimations();
-  return animations[0].ready.then(waitForFrame).then(function() {
+  return animations[0].ready.then(waitForFrame).then(() => {
     div.style.transition = 'all 100s';
     div.style.backgroundColor = 'green';
 
@@ -111,11 +111,11 @@ promise_test(function(t) {
   });
 }, 'getAnimations for both CSS Animations and CSS Transitions at once');
 
-async_test(function(t) {
+async_test(t => {
   var div = addDiv(t);
 
   // Set up event listener
-  div.addEventListener('animationend', t.step_func(function() {
+  div.addEventListener('animationend', t.step_func(() => {
     assert_equals(div.getAnimations().length, 0,
       'getAnimations does not return Animations for finished '
       + ' (and non-forwards-filling) CSS Animations');
@@ -126,11 +126,11 @@ async_test(function(t) {
   div.style.animation = 'anim1 0.01s';
 }, 'getAnimations for CSS Animations that have finished');
 
-async_test(function(t) {
+async_test(t => {
   var div = addDiv(t);
 
   // Set up event listener
-  div.addEventListener('animationend', t.step_func(function() {
+  div.addEventListener('animationend', t.step_func(() => {
     assert_equals(div.getAnimations().length, 1,
       'getAnimations returns Animations for CSS Animations that have'
       + ' finished but are filling forwards');
@@ -142,7 +142,7 @@ async_test(function(t) {
 }, 'getAnimations for CSS Animations that have finished but are'
    + ' forwards filling');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'none 100s';
 
@@ -158,7 +158,7 @@ test(function(t) {
     + ' animation-name is not none');
 }, 'getAnimations for CSS Animations with animation-name: none');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'missing 100s';
   var animations = div.getAnimations();
@@ -173,7 +173,7 @@ test(function(t) {
     + ' animation-name is found');
 }, 'getAnimations for CSS Animations with animation-name: missing');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s, notyet 100s';
   var animations = div.getAnimations();
@@ -181,7 +181,7 @@ promise_test(function(t) {
     'getAnimations initally only returns Animations for CSS Animations whose'
     + ' animation-name is found');
 
-  return animations[0].ready.then(waitForFrame).then(function() {
+  return animations[0].ready.then(waitForFrame).then(() => {
     var keyframes = '@keyframes notyet { to { left: 100px; } }';
     document.styleSheets[0].insertRule(keyframes, 0);
     animations = div.getAnimations();
@@ -189,7 +189,7 @@ promise_test(function(t) {
       'getAnimations includes Animation when @keyframes rule is added'
       + ' later');
     return waitForAllAnimations(animations);
-  }).then(function() {
+  }).then(() => {
     assert_true(animations[0].startTime < animations[1].startTime,
       'Newly added animation has a later start time');
     document.styleSheets[0].deleteRule(0);
@@ -197,7 +197,7 @@ promise_test(function(t) {
 }, 'getAnimations for CSS Animations where the @keyframes rule is added'
    + ' later');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s, anim1 100s';
   assert_equals(div.getAnimations().length, 2,
@@ -205,7 +205,7 @@ test(function(t) {
     + ' even if the names are duplicated');
 }, 'getAnimations for CSS Animations with duplicated animation-name');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'empty 100s';
   assert_equals(div.getAnimations().length, 1,
@@ -213,21 +213,21 @@ test(function(t) {
     + ' empty keyframes rule');
 }, 'getAnimations for CSS Animations with empty keyframes rule');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s 100s';
   var animations = div.getAnimations();
   assert_equals(animations.length, 1,
     'getAnimations returns animations for CSS animations whose'
     + ' delay makes them start later');
-  return animations[0].ready.then(waitForFrame).then(function() {
+  return animations[0].ready.then(waitForFrame).then(() => {
     assert_true(animations[0].startTime <= document.timeline.currentTime,
       'For CSS Animations in delay phase, the start time of the Animation is'
       + ' not in the future');
   });
 }, 'getAnimations for CSS animations in delay phase');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 0s 100s';
   assert_equals(div.getAnimations().length, 1,
@@ -236,7 +236,7 @@ test(function(t) {
   div.remove();
 }, 'getAnimations for zero-duration CSS Animations');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s';
   var originalAnimation = div.getAnimations()[0];
@@ -260,7 +260,7 @@ test(function(t) {
                 + ' duration changes');
 }, 'getAnimations returns objects with the same identity');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim1 100s';
 
@@ -279,11 +279,11 @@ test(function(t) {
 
 }, 'getAnimations for CSS Animations that are cancelled');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim2 100s';
 
-  return div.getAnimations()[0].ready.then(function() {
+  return div.getAnimations()[0].ready.then(() => {
     // Prepend to the list and test that even though anim1 was triggered
     // *after* anim2, it should come first because it appears first
     // in the animation-name property.
@@ -308,7 +308,7 @@ promise_test(function(t) {
   });
 }, 'getAnimations for CSS Animations follows animation-name order');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '#target::after': 'animation: anim1 10s;',
                 '#target::before': 'animation: anim1 10s;' });
   var target = addDiv(t, { 'id': 'target' });
@@ -321,7 +321,7 @@ test(function(t) {
                 'Effect target should be the element');
 }, 'Test AnimationFilter{ subtree: false } with single element');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '#target::after': 'animation: anim1 10s;',
                 '#target::before': 'animation: anim1 10s;' });
   var target = addDiv(t, { 'id': 'target' });
@@ -342,7 +342,7 @@ test(function(t) {
                 'should be returned last');
 }, 'Test AnimationFilter{ subtree: true } with single element');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '#parent::after': 'animation: anim1 10s;',
                 '#parent::before': 'animation: anim1 10s;',
                 '#child::after': 'animation: anim1 10s;',
@@ -360,7 +360,7 @@ test(function(t) {
                 'Effect target shuld be the element');
 }, 'Test AnimationFilter{ subtree: false } with element that has a child');
 
-test(function(t) {
+test(t => {
   addStyle(t, { '#parent::after': 'animation: anim1 10s;',
                 '#parent::before': 'animation: anim1 10s;',
                 '#child::after': 'animation: anim1 10s;',
@@ -404,7 +404,7 @@ test(function(t) {
                 'This ::after element should be child of child element');
 }, 'Test AnimationFilter{ subtree: true } with element that has a child');
 
-test(function(t) {
+test(t => {
   var parent = addDiv(t, { 'id': 'parent' });
   var child1 = addDiv(t, { 'id': 'child1' });
   var grandchild1 = addDiv(t, { 'id': 'grandchild1' });
diff --git a/dom/animation/test/css-animations/test_event-dispatch.html b/dom/animation/test/css-animations/test_event-dispatch.html
index de4c4595d0e4..7138bc143eba 100644
--- a/dom/animation/test/css-animations/test_event-dispatch.html
+++ b/dom/animation/test/css-animations/test_event-dispatch.html
@@ -44,7 +44,7 @@ AnimationEventHandler.prototype.clear = () => {
   this.animationcancel    = undefined;
 }
 
-function setupAnimation(t, animationStyle) {
+const setupAnimation = (t, animationStyle) => {
   const div = addDiv(t, { style: 'animation: ' + animationStyle });
   // Note that this AnimationEventHandler should be created before EventWatcher
   // to capture all events in the handler prior to the EventWatcher since
@@ -57,7 +57,7 @@ function setupAnimation(t, animationStyle) {
   const animation = div.getAnimations()[0];
 
   return { animation, watcher, div, handler };
-}
+};
 
 promise_test(t => {
   // Add 1ms delay to ensure that the delay is not included in the elapsedTime.
diff --git a/dom/animation/test/css-animations/test_event-order.html b/dom/animation/test/css-animations/test_event-order.html
index 4f816a90e982..9ac45b867c5e 100644
--- a/dom/animation/test/css-animations/test_event-order.html
+++ b/dom/animation/test/css-animations/test_event-order.html
@@ -23,7 +23,7 @@
  *        events, each having the form:
  *          [ event type, target element, elapsed time ]
  */
-function checkEvents(actualEvents, ...expectedEvents) {
+const checkEvents = (actualEvents, ...expectedEvents) => {
   assert_equals(actualEvents.length, expectedEvents.length,
                 `Number of actual events (${actualEvents.length}: \
 ${actualEvents.map(event => event.type).join(', ')}) should match expected \
@@ -37,9 +37,9 @@ events (${expectedEvents.map(event => event.type).join(', ')})`);
     assert_equals(expectedEvents[i][2], actualEvent.elapsedTime,
                   'Event\'s elapsed time should match');
   });
-}
+};
 
-function setupAnimation(t, animationStyle, receiveEvents) {
+const setupAnimation = (t, animationStyle, receiveEvents) => {
   const div = addDiv(t, { style: "animation: " + animationStyle });
 
   ['start', 'iteration', 'end'].forEach(name => {
@@ -57,7 +57,7 @@ function setupAnimation(t, animationStyle, receiveEvents) {
   const animation = div.getAnimations()[0];
 
   return [animation, watcher, div];
-}
+};
 
 promise_test(t => {
   let events = [];
diff --git a/dom/animation/test/css-animations/test_keyframeeffect-getkeyframes.html b/dom/animation/test/css-animations/test_keyframeeffect-getkeyframes.html
index b7e279b9d7f1..d4fb87900993 100644
--- a/dom/animation/test/css-animations/test_keyframeeffect-getkeyframes.html
+++ b/dom/animation/test/css-animations/test_keyframeeffect-getkeyframes.html
@@ -159,11 +159,9 @@
 <script>
 "use strict";
 
-function getKeyframes(e) {
-  return e.getAnimations()[0].effect.getKeyframes();
-}
+const getKeyframes = elem => elem.getAnimations()[0].effect.getKeyframes();
 
-function assert_frames_equal(a, b, name) {
+const assert_frames_equal = (a, b, name) => {
   assert_equals(Object.keys(a).sort().toString(),
                 Object.keys(b).sort().toString(),
                 "properties on " + name);
@@ -175,7 +173,7 @@ function assert_frames_equal(a, b, name) {
       assert_equals(a[p], b[p], "value for '" + p + "' on " + name);
     }
   }
-}
+};
 
 // animation-timing-function values to test with, where the value
 // is exactly the same as its serialization, sorted by the order
@@ -195,7 +193,7 @@ const kTimingFunctionValues = [
   "cubic-bezier(0, 0.25, 0.75, 1)"
 ];
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-empty 100s';
@@ -218,7 +216,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns no frames for various kinds'
    + ' of empty enimations');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-simple 100s';
@@ -239,7 +237,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected frames for a simple'
    + ' animation');
 
-test(function(t) {
+test(t => {
   kTimingFunctionValues.forEach(function(easing) {
     var div = addDiv(t);
 
@@ -257,7 +255,7 @@ test(function(t) {
    + ' values, when the easing comes from animation-timing-function on the'
    + ' element');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-simple-timing 100s';
@@ -273,7 +271,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns frames with expected easing'
    + ' values, when the easing is specified on each keyframe');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-simple-timing-some 100s step-start';
@@ -289,7 +287,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns frames with expected easing'
    + ' values, when the easing is specified on some keyframes');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-simple-shorthand 100s';
@@ -312,7 +310,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected frames for a simple'
    + ' animation that specifies a single shorthand property');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-omit-to 100s';
@@ -334,7 +332,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with a 0% keyframe and no 100% keyframe');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-omit-from 100s';
@@ -356,7 +354,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with a 100% keyframe and no 0% keyframe');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-omit-from-to 100s';
@@ -380,7 +378,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected frames for an ' +
    'animation with no 0% or 100% keyframe but with a 50% keyframe');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-partially-omit-to 100s';
@@ -403,7 +401,7 @@ test(function(t) {
    'animation with a partially complete 100% keyframe (because the ' +
    '!important rule is ignored)');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-different-props 100s';
@@ -429,7 +427,7 @@ test(function(t) {
    'animation with different properties on different keyframes, all ' +
    'with the same easing function');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-different-props-and-easing 100s';
@@ -455,7 +453,7 @@ test(function(t) {
    'animation with different properties on different keyframes, with ' +
    'a different easing function on each');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-merge-offset 100s';
@@ -477,7 +475,7 @@ test(function(t) {
    'animation with multiple keyframes for the same time, and all with ' +
    'the same easing function');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-merge-offset-and-easing 100s';
@@ -502,7 +500,7 @@ test(function(t) {
    'animation with multiple keyframes for the same time and with ' +
    'different easing functions');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-no-merge-equiv-easing 100s';
@@ -526,7 +524,7 @@ test(function(t) {
    'animation with multiple keyframes for the same time and with ' +
    'different but equivalent easing functions');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-overriding 100s';
@@ -558,7 +556,7 @@ test(function(t) {
 // Gecko-specific test case: We are specifically concerned here that the
 // computed value for filter, "none", is correctly represented.
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-filter 100s';
@@ -579,7 +577,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with filter properties and missing keyframes');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-filter-drop-shadow 100s';
@@ -604,7 +602,7 @@ test(function(t) {
 // computed value for text-shadow and a "none" specified on a keyframe
 // are correctly represented.
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.textShadow = '1px 1px 2px rgb(0, 0, 0), ' +
@@ -634,7 +632,7 @@ test(function(t) {
 // initial value for background-size and the specified list are correctly
 // represented.
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
 
   div.style.animation = 'anim-background-size 100s';
@@ -666,7 +664,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with background-size properties and missing keyframes');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim-variables 100s';
 
@@ -686,7 +684,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with CSS variables as keyframe values');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim-variables-shorthand 100s';
 
@@ -712,7 +710,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with CSS variables as keyframe values in a shorthand property');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim-custom-property-in-keyframe 100s';
 
@@ -732,7 +730,7 @@ test(function(t) {
 }, 'KeyframeEffect.getKeyframes() returns expected values for ' +
    'animations with a CSS variable which is overriden by the value in keyframe');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim-only-custom-property-in-keyframe 100s';
 
diff --git a/dom/animation/test/css-animations/test_pseudoElement-get-animations.html b/dom/animation/test/css-animations/test_pseudoElement-get-animations.html
index ce8648ff803d..96d4797eff77 100644
--- a/dom/animation/test/css-animations/test_pseudoElement-get-animations.html
+++ b/dom/animation/test/css-animations/test_pseudoElement-get-animations.html
@@ -28,7 +28,7 @@
 <script>
 'use strict';
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { class: 'before' });
   var pseudoTarget = document.getAnimations()[0].effect.target;
   assert_equals(pseudoTarget.getAnimations().length, 1,
@@ -37,7 +37,7 @@ test(function(t) {
                 'CSS animation name matches');
 }, 'getAnimations returns CSSAnimation objects');
 
-test(function(t) {
+test(t => {
   var div = addDiv(t, { class: 'after-with-mix-anims-trans' });
   // Trigger transitions
   flushComputedStyle(div);
diff --git a/dom/animation/test/css-animations/test_setting-effect.html b/dom/animation/test/css-animations/test_setting-effect.html
index 083acc63212e..54eb16c204b1 100644
--- a/dom/animation/test/css-animations/test_setting-effect.html
+++ b/dom/animation/test/css-animations/test_setting-effect.html
@@ -18,14 +18,14 @@
 <script>
 'use strict';
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim 100s';
 
   var watcher = new EventWatcher(t, div, [ 'animationend',
                                            'animationcancel' ]);
   var animation = div.getAnimations()[0];
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     animation.currentTime = 50 * MS_PER_SEC;
     animation.effect = null;
     assert_equals(animation.playState, 'finished');
@@ -34,12 +34,12 @@ promise_test(function(t) {
   });
 }, 'Setting a null effect on a running animation fires an animationend event');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim 100s';
 
   var animation = div.getAnimations()[0];
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     animation.currentTime = 50 * MS_PER_SEC;
     animation.effect = new KeyframeEffect(div,
                                           { left: [ '0px' , '100px'] },
@@ -51,12 +51,12 @@ promise_test(function(t) {
 }, 'Replacing an animation\'s effect with an effect that targets a different ' +
    'property should update both properties');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim 100s';
 
   var animation = div.getAnimations()[0];
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     animation.currentTime = 50 * MS_PER_SEC;
     animation.effect = new KeyframeEffect(div,
                                           { left: [ '0px' , '100px'] },
@@ -66,7 +66,7 @@ promise_test(function(t) {
 }, 'Replacing an animation\'s effect with a shorter one that should have ' +
    'already finished, the animation finishes immediately');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   div.style.animation = 'anim 100s';
 
@@ -78,13 +78,13 @@ promise_test(function(t) {
                                         100 * MS_PER_SEC);
   assert_true(animation.pending);
 
-  return animation.ready.then(function() {
+  return animation.ready.then(() => {
     assert_false(animation.pending);
   });
 }, 'A play-pending animation\'s effect whose effect is replaced still exits ' +
    'the pending state');
 
-promise_test(function(t) {
+promise_test(t => {
   var div1 = addDiv(t);
   var div2 = addDiv(t);
 
@@ -99,7 +99,7 @@ promise_test(function(t) {
                                         { left: [ '0px', '100px' ] },
                                         100 * MS_PER_SEC);
 
-  return watcher1.wait_for('animationstart').then(function() {
+  return watcher1.wait_for('animationstart').then(() => {
     assert_equals(animation.effect.target, div2);
 
     // Then wait a couple of frames and check that no event was dispatched.
@@ -108,7 +108,7 @@ promise_test(function(t) {
 }, 'The event is dispatched at the original element even after setting an ' +
    'effect with a different target element');
 
-promise_test(function(t) {
+promise_test(t => {
   var div = addDiv(t);
   var watcher = new EventWatcher(t, div, [ 'animationstart',
                                            'animationend',
@@ -118,7 +118,7 @@ promise_test(function(t) {
   animation.finish();
 
   return watcher.wait_for([ 'animationstart',
-                            'animationend' ]).then(function(evt) {
+                            'animationend' ]).then(evt => {
     // Set a longer effect
     animation.effect = new KeyframeEffect(div,
                                           { left: [ '0px', '100px' ] },