--- a/devtools/client/animationinspector/animation-controller.js
+++ b/devtools/client/animationinspector/animation-controller.js
@@ -25,17 +25,17 @@ const L10N =
// Global toolbox/inspector, set when startup is called.
var gToolbox, gInspector;
/**
* Startup the animationinspector controller and view, called by the sidebar
* widget when loading/unloading the iframe into the tab.
*/
-var startup = async function(inspector) {
+var startup = async function (inspector) {
gInspector = inspector;
gToolbox = inspector.toolbox;
// Don't assume that AnimationsPanel is defined here, it's in another file.
if (!typeof AnimationsPanel === "undefined") {
throw new Error("AnimationsPanel was not loaded in the " +
"animationinspector window");
}
@@ -46,17 +46,17 @@ var startup = async function(inspector)
await AnimationsController.initialize();
await AnimationsPanel.initialize();
};
/**
* Shutdown the animationinspector controller and view, called by the sidebar
* widget when loading/unloading the iframe into the tab.
*/
-var shutdown = async function() {
+var shutdown = async function () {
await AnimationsController.destroy();
// Don't assume that AnimationsPanel is defined here, it's in another file.
if (typeof AnimationsPanel !== "undefined") {
await AnimationsPanel.destroy();
}
gToolbox = gInspector = null;
};
@@ -69,17 +69,17 @@ function destroy() {
}
/**
* Get all the server-side capabilities (traits) so the UI knows whether or not
* features should be enabled/disabled.
* @param {Target} target The current toolbox target.
* @return {Object} An object with boolean properties.
*/
-var getServerTraits = async function(target) {
+var getServerTraits = async function (target) {
let config = [
{ name: "hasToggleAll", actor: "animations",
method: "toggleAll" },
{ name: "hasToggleSeveral", actor: "animations",
method: "toggleSeveral" },
{ name: "hasSetCurrentTime", actor: "animationplayer",
method: "setCurrentTime" },
{ name: "hasMutationEvents", actor: "animations",
--- a/devtools/client/animationinspector/test/browser_animation_animated_properties_displayed.js
+++ b/devtools/client/animationinspector/test/browser_animation_animated_properties_displayed.js
@@ -26,17 +26,17 @@ const EXPECTED_PROPERTIES = [
"background-image",
"background-origin",
"background-position-x",
"background-position-y",
"background-repeat",
"background-size"
].sort();
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_keyframes.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
let propertiesList = timeline.rootWrapperEl
.querySelector(".animated-properties");
// doc_keyframes.html has only one animation,
// so the propertiesList shoud be shown.
--- a/devtools/client/animationinspector/test/browser_animation_animated_properties_for_delayed_starttime_animations.js
+++ b/devtools/client/animationinspector/test/browser_animation_animated_properties_for_delayed_starttime_animations.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test for animations that have different starting time.
// We should check progress indicator working well even if the start time is not zero.
// Also, check that there is no duplication display.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_delayed_starttime_animations.html");
const { panel } = await openAnimationInspector();
await setStyle(null, panel, "animation", "anim 100s", "#target2");
await setStyle(null, panel, "animation", "anim 100s", "#target3");
await setStyle(null, panel, "animation", "anim 100s", "#target4");
await setStyle(null, panel, "animation", "anim 100s", "#target5");
const timelineComponent = panel.animationsTimelineComponent;
--- a/devtools/client/animationinspector/test/browser_animation_animated_properties_path.js
+++ b/devtools/client/animationinspector/test/browser_animation_animated_properties_path.js
@@ -327,17 +327,17 @@ const TEST_CASES = [
{ x: 500, y: 0 },
{ x: 750, y: 0.5 },
{ x: 1000, y: 1 },
]
}
}
];
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_multiple_property_types.html");
const {panel} = await openAnimationInspector();
const timelineComponent = panel.animationsTimelineComponent;
const detailEl = timelineComponent.details.containerEl;
const hasClosePath = true;
for (let i = 0; i < TEST_CASES.length; i++) {
info(`Click to select the animation[${ i }]`);
--- a/devtools/client/animationinspector/test/browser_animation_animated_properties_progress_indicator.js
+++ b/devtools/client/animationinspector/test/browser_animation_animated_properties_progress_indicator.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test progress indicator in animated properties.
// Since this indicator works with the timeline, after selecting each animation,
// click the timeline header to change the current time and check the change.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_multiple_property_types.html");
const { panel } = await openAnimationInspector();
const timelineComponent = panel.animationsTimelineComponent;
const detailsComponent = timelineComponent.details;
info("Click to select the animation");
await clickOnAnimation(panel, 0);
let progressIndicatorEl = detailsComponent.progressIndicatorEl;
--- a/devtools/client/animationinspector/test/browser_animation_click_selects_animation.js
+++ b/devtools/client/animationinspector/test/browser_animation_click_selects_animation.js
@@ -2,17 +2,17 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Check that animations displayed in the timeline can be selected by clicking
// them, and that this emits the right events and adds the right classes.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
let selected = timeline.rootWrapperEl.querySelectorAll(".animation.selected");
ok(!selected.length, "There are no animations selected by default");
info("Click on the first animation, expect the right event and right class");
--- a/devtools/client/animationinspector/test/browser_animation_controller_exposes_document_currentTime.js
+++ b/devtools/client/animationinspector/test/browser_animation_controller_exposes_document_currentTime.js
@@ -2,17 +2,17 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test that the controller provides the document.timeline currentTime (at least
// the last known version since new animations were added).
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, controller} = await openAnimationInspector();
ok(controller.documentCurrentTime, "The documentCurrentTime getter exists");
checkDocumentTimeIsCorrect(controller);
let time1 = controller.documentCurrentTime;
await startNewAnimation(controller, panel);
--- a/devtools/client/animationinspector/test/browser_animation_detail_displayed.js
+++ b/devtools/client/animationinspector/test/browser_animation_detail_displayed.js
@@ -11,17 +11,17 @@
// 3. Display after click on an animation.
// 4. Display from first time if displayed animation is only one.
// 5. Close the animation-detail element by clicking on close button.
// 6. Stay selected animation even if refresh all UI.
// 7. Close the animation-detail element again and click selected animation again.
requestLongerTimeout(5);
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_multiple_property_types.html");
const { panel, inspector } = await openAnimationInspector();
const timelineComponent = panel.animationsTimelineComponent;
const animationDetailEl =
timelineComponent.rootWrapperEl.querySelector(".animation-detail");
const splitboxControlledEl =
timelineComponent.rootWrapperEl.querySelector(".controlled");
--- a/devtools/client/animationinspector/test/browser_animation_detail_easings.js
+++ b/devtools/client/animationinspector/test/browser_animation_detail_easings.js
@@ -43,17 +43,17 @@ const TEST_CASES = {
},
"css-animations": {
opacity: {
expectedValues: ["ease", "ease"],
}
},
};
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_multiple_easings.html");
const { panel } = await openAnimationInspector();
const timelineComponent = panel.animationsTimelineComponent;
const timeBlocks = getAnimationTimeBlocks(panel);
for (let i = 0; i < timeBlocks.length; i++) {
await clickOnAnimation(panel, i);
--- a/devtools/client/animationinspector/test/browser_animation_empty_on_invalid_nodes.js
+++ b/devtools/client/animationinspector/test/browser_animation_empty_on_invalid_nodes.js
@@ -2,17 +2,17 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test that the panel shows no animation data for invalid or not animated nodes
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel, window} = await openAnimationInspector();
let {document} = window;
info("Select node .still and check that the panel is empty");
let stillNode = await getNodeFront(".still", inspector);
await selectNodeAndWaitForAnimations(stillNode, inspector);
--- a/devtools/client/animationinspector/test/browser_animation_keyframe_markers.js
+++ b/devtools/client/animationinspector/test/browser_animation_keyframe_markers.js
@@ -16,17 +16,17 @@ const EXPECTED_PROPERTIES = [
"borderTopLeftRadius",
"borderTopRightRadius",
"filter",
"height",
"transform",
"width"
];
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_keyframes.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
// doc_keyframes.html has only one animation.
// So we don't need to click the animation since already the animation detail shown.
ok(timeline.rootWrapperEl.querySelectorAll(".frames .keyframes").length,
--- a/devtools/client/animationinspector/test/browser_animation_mutations_with_same_names.js
+++ b/devtools/client/animationinspector/test/browser_animation_mutations_with_same_names.js
@@ -4,17 +4,17 @@
"use strict";
// Check that when animations are added later (through animation mutations) and
// if these animations have the same names, then all of them are still being
// displayed (which should be true as long as these animations apply to
// different nodes).
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_negative_animation.html");
const {controller, panel} = await openAnimationInspector();
const timeline = panel.animationsTimelineComponent;
const areTracksReady = () => timeline.animations.every(a => {
return timeline.componentsMap[a.actorID];
});
--- a/devtools/client/animationinspector/test/browser_animation_panel_exists.js
+++ b/devtools/client/animationinspector/test/browser_animation_panel_exists.js
@@ -1,17 +1,17 @@
/* vim: set ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test that the animation panel sidebar exists
-add_task(async function() {
+add_task(async function () {
await addTab("data:text/html;charset=utf-8,welcome to the animation panel");
let {panel, controller} = await openAnimationInspector();
ok(controller,
"The animation controller exists");
ok(controller.animationsFront,
"The animation controller has been initialized");
ok(panel,
--- a/devtools/client/animationinspector/test/browser_animation_participate_in_inspector_update.js
+++ b/devtools/client/animationinspector/test/browser_animation_participate_in_inspector_update.js
@@ -5,17 +5,17 @@
"use strict";
requestLongerTimeout(2);
// Test that the update of the animation panel participate in the
// inspector-updated event. This means that the test verifies that the
// inspector-updated event is emitted *after* the animation panel is ready.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel, controller} = await openAnimationInspector();
info("Listen for the players-updated, ui-updated and " +
"inspector-updated events");
let receivedEvents = [];
controller.once(controller.PLAYERS_UPDATED_EVENT, () => {
receivedEvents.push(controller.PLAYERS_UPDATED_EVENT);
--- a/devtools/client/animationinspector/test/browser_animation_playerFronts_are_refreshed.js
+++ b/devtools/client/animationinspector/test/browser_animation_playerFronts_are_refreshed.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Check that the AnimationPlayerFront objects lifecycle is managed by the
// AnimationController.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {controller, inspector} = await openAnimationInspector();
info("Selecting an animated node");
// selectNode waits for the inspector-updated event before resolving, which
// means the controller.PLAYERS_UPDATED_EVENT event has been emitted before
// and players are ready.
await selectNodeAndWaitForAnimations(".animated", inspector);
--- a/devtools/client/animationinspector/test/browser_animation_playerWidgets_appear_on_panel_init.js
+++ b/devtools/client/animationinspector/test/browser_animation_playerWidgets_appear_on_panel_init.js
@@ -4,17 +4,17 @@
"use strict";
// Test that player widgets are displayed right when the animation panel is
// initialized, if the selected node (<body> by default) is animated.
const { ANIMATION_TYPES } = require("devtools/server/actors/animation");
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_multiple_animation_types.html");
let {panel} = await openAnimationInspector();
is(panel.animationsTimelineComponent.animations.length, 3,
"Three animations are handled by the timeline after init");
assertAnimationsDisplayed(panel, 3,
"Three animations are displayed after init");
is(
--- a/devtools/client/animationinspector/test/browser_animation_playerWidgets_target_nodes.js
+++ b/devtools/client/animationinspector/test/browser_animation_playerWidgets_target_nodes.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test that player widgets display information about target nodes
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Select the simple animated node");
await selectNodeAndWaitForAnimations(".animated", inspector);
let targetNodeComponent = getAnimationTargetNodes(panel)[0];
let {previewer} = targetNodeComponent;
--- a/devtools/client/animationinspector/test/browser_animation_pseudo_elements.js
+++ b/devtools/client/animationinspector/test/browser_animation_pseudo_elements.js
@@ -1,17 +1,17 @@
/* vim: set ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test that animated pseudo-elements do show in the timeline.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_pseudo_elements.html");
let {inspector, panel} = await openAnimationInspector();
info("With <body> selected by default check the content of the timeline");
is(getAnimationTimeBlocks(panel).length, 3, "There are 3 animations in the timeline");
let targetNodes = getAnimationTargetNodes(panel);
let getTargetNodeText = index => {
--- a/devtools/client/animationinspector/test/browser_animation_refresh_on_added_animation.js
+++ b/devtools/client/animationinspector/test/browser_animation_refresh_on_added_animation.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test that the panel content refreshes when new animations are added.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Select a non animated node");
await selectNodeAndWaitForAnimations(".still", inspector);
assertAnimationsDisplayed(panel, 0);
--- a/devtools/client/animationinspector/test/browser_animation_refresh_on_removed_animation.js
+++ b/devtools/client/animationinspector/test/browser_animation_refresh_on_removed_animation.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test that the panel content refreshes when animations are removed.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
await testRefreshOnRemove(inspector, panel);
});
async function testRefreshOnRemove(inspector, panel) {
info("Select a animated node");
--- a/devtools/client/animationinspector/test/browser_animation_refresh_when_active.js
+++ b/devtools/client/animationinspector/test/browser_animation_refresh_when_active.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test that the panel only refreshes when it is visible in the sidebar.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
await testRefresh(inspector, panel);
});
async function testRefresh(inspector, panel) {
info("Select a non animated node");
--- a/devtools/client/animationinspector/test/browser_animation_refresh_when_active_after_mutations.js
+++ b/devtools/client/animationinspector/test/browser_animation_refresh_when_active_after_mutations.js
@@ -9,17 +9,17 @@ requestLongerTimeout(2);
// Test that refresh animation UI while the panel is hidden.
const EXPECTED_GRAPH_PATH_SEGMENTS = [{ x: 0, y: 0 },
{ x: 49999, y: 0.0 },
{ x: 50000, y: 0.5 },
{ x: 99999, y: 0.5 },
{ x: 100000, y: 0 }];
-add_task(async function() {
+add_task(async function () {
info("Open animation inspector once so that activate animation mutations listener");
await addTab("data:text/html;charset=utf8,<div id='target'>test</div>");
const { controller, inspector, panel } = await openAnimationInspector();
info("Select other tool to hide animation inspector");
await inspector.sidebar.select("ruleview");
// Count players-updated event in controller.
--- a/devtools/client/animationinspector/test/browser_animation_running_on_compositor.js
+++ b/devtools/client/animationinspector/test/browser_animation_running_on_compositor.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Test that when animations displayed in the timeline are running on the
// compositor, they get a special icon and information in the tooltip.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
info("Select a test node we know has an animation running on the compositor");
await selectNodeAndWaitForAnimations(".compositor-all", inspector);
let animationEl = timeline.animationsEl.querySelector(".animation");
--- a/devtools/client/animationinspector/test/browser_animation_same_nb_of_playerWidgets_and_playerFronts.js
+++ b/devtools/client/animationinspector/test/browser_animation_same_nb_of_playerWidgets_and_playerFronts.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Check that when playerFronts are updated, the same number of playerWidgets
// are created in the panel.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel, controller} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
info("Selecting the test animated node again");
await selectNodeAndWaitForAnimations(".multi", inspector);
is(controller.animationPlayers.length,
--- a/devtools/client/animationinspector/test/browser_animation_shows_player_on_valid_node.js
+++ b/devtools/client/animationinspector/test/browser_animation_shows_player_on_valid_node.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Test that the panel shows an animation player when an animated node is
// selected.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Select node .animated and check that the panel is not empty");
let node = await getNodeFront(".animated", inspector);
await selectNodeAndWaitForAnimations(node, inspector);
assertAnimationsDisplayed(panel, 1);
--- a/devtools/client/animationinspector/test/browser_animation_spacebar_toggles_animations.js
+++ b/devtools/client/animationinspector/test/browser_animation_spacebar_toggles_animations.js
@@ -5,17 +5,17 @@
"use strict";
// Test that the spacebar key press toggles the toggleAll button state
// when a node with no animation is selected.
// This test doesn't need to test if animations actually pause/resume
// because there's an other test that does this :
// browser_animation_toggle_button_toggles_animation.js
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, inspector, window, controller} = await openAnimationInspector();
let {toggleAllButtonEl} = panel;
// select a node without animations
await selectNodeAndWaitForAnimations(".still", inspector);
// ensure the focus is on the animation panel
--- a/devtools/client/animationinspector/test/browser_animation_spacebar_toggles_node_animations.js
+++ b/devtools/client/animationinspector/test/browser_animation_spacebar_toggles_node_animations.js
@@ -8,17 +8,17 @@
// This test doesn't need to test if animations actually pause/resume
// because there's an other test that does this.
// There are animations in the test page and since, by default, the <body> node
// is selected, animations will be displayed in the timeline, so the timeline
// play/resume button will be displayed
requestLongerTimeout(2);
-add_task(async function() {
+add_task(async function () {
requestLongerTimeout(2);
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, window} = await openAnimationInspector();
let {playTimelineButtonEl} = panel;
// ensure the focus is on the animation panel
window.focus();
--- a/devtools/client/animationinspector/test/browser_animation_summarygraph_for_multiple_easings.js
+++ b/devtools/client/animationinspector/test/browser_animation_summarygraph_for_multiple_easings.js
@@ -138,17 +138,17 @@ const TEST_CASES = {
{ x: 50000, y: 0.5 },
{ x: 75000, y: 0.5 },
{ x: 99999, y: 0.5 },
]
]
},
};
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_multiple_easings.html");
const { panel } = await openAnimationInspector();
getAnimationTimeBlocks(panel).forEach(timeBlock => {
const state = timeBlock.animation.state;
const testcase = TEST_CASES[state.name];
if (!testcase) {
return;
}
--- a/devtools/client/animationinspector/test/browser_animation_target_highlight_select.js
+++ b/devtools/client/animationinspector/test/browser_animation_target_highlight_select.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Test that the DOM element targets displayed in animation player widgets can
// be used to highlight elements in the DOM and select them in the inspector.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {toolbox, inspector, panel} = await openAnimationInspector();
info("Select the simple animated node");
await selectNodeAndWaitForAnimations(".animated", inspector);
let targets = getAnimationTargetNodes(panel);
--- a/devtools/client/animationinspector/test/browser_animation_target_highlighter_lock.js
+++ b/devtools/client/animationinspector/test/browser_animation_target_highlighter_lock.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Test that the DOM element targets displayed in animation player widgets can
// be used to highlight elements in the DOM and select them in the inspector.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let targets = getAnimationTargetNodes(panel);
info("Click on the highlighter icon for the first animated node");
let domNodePreview1 = targets[0].previewer;
await lockHighlighterOn(domNodePreview1);
--- a/devtools/client/animationinspector/test/browser_animation_timeline_add_animation.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_add_animation.js
@@ -2,17 +2,17 @@
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Test re-used animation element since we re-use existent animation element
// for the render performance.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_add_animation.html");
let {panel, controller} = await openAnimationInspector();
const timelineComponent = panel.animationsTimelineComponent;
// Add new animation which has delay and endDelay.
await startNewAnimation(controller, panel, "#target2");
const previousAnimationEl =
timelineComponent.animationsEl.querySelector(".animation:nth-child(2)");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_currentTime.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_currentTime.js
@@ -6,17 +6,17 @@
"use strict";
requestLongerTimeout(2);
// Check that the timeline toolbar displays the current time, and that it
// changes when animations are playing, gets back to 0 when animations are
// rewound, and stops when animations are paused.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let label = panel.timelineCurrentTimeEl;
ok(label, "The current time label exists");
// On page load animations are playing so the time shoud change, although we
// don't want to test the exact value of the time displayed, just that it
--- a/devtools/client/animationinspector/test/browser_animation_timeline_header.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_header.js
@@ -9,17 +9,17 @@ requestLongerTimeout(2);
// Check that the timeline shows correct time graduations in the header.
const {findOptimalTimeInterval, TimeScale} = require("devtools/client/animationinspector/utils");
// Should be kept in sync with TIME_GRADUATION_MIN_SPACING in
// animation-timeline.js
const TIME_GRADUATION_MIN_SPACING = 40;
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
// System scrollbar is enabled by default on our testing envionment and it
// would shrink width of inspector and affect number of time-ticks causing
// unexpected results. So, we set it wider to avoid this kind of edge case.
await pushPref("devtools.toolsidebar-width.inspector", 350);
let {panel} = await openAnimationInspector();
--- a/devtools/client/animationinspector/test/browser_animation_timeline_iterationStart.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_iterationStart.js
@@ -1,17 +1,17 @@
/* vim: set ts=2 et sw=2 tw=80: */
/* Any copyright is dedicated to the Public Domain.
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
// Check that the iteration start is displayed correctly in time blocks.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_script_animation.html");
let {panel} = await openAnimationInspector();
let timelineComponent = panel.animationsTimelineComponent;
let timeBlockComponents = getAnimationTimeBlocks(panel);
let detailsComponent = timelineComponent.details;
for (let i = 0; i < timeBlockComponents.length; i++) {
info(`Expand time block ${i} so its keyframes are visible`);
--- a/devtools/client/animationinspector/test/browser_animation_timeline_pause_button_01.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_pause_button_01.js
@@ -5,17 +5,17 @@
"use strict";
requestLongerTimeout(2);
// Check that the timeline toolbar contains a pause button and that this pause button can
// be clicked. Check that when it is, the button changes state and the scrubber stops and
// resumes.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let btn = panel.playTimelineButtonEl;
ok(btn, "The play/pause button exists");
ok(!btn.classList.contains("paused"), "The play/pause button is in its playing state");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_pause_button_02.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_pause_button_02.js
@@ -7,17 +7,17 @@
requestLongerTimeout(2);
ChromeUtils.defineModuleGetter(this, "Preferences",
"resource://gre/modules/Preferences.jsm");
// Checks that the play/pause button goes to the right state when the scrubber has reached
// the end of the timeline but there are infinite animations playing.
-add_task(async function() {
+add_task(async function () {
// TODO see if this is needed?
// let timerPrecision = Preferences.get("privacy.reduceTimerPrecision");
// Preferences.set("privacy.reduceTimerPrecision", false);
// registerCleanupFunction(function () {
// Preferences.set("privacy.reduceTimerPrecision", timerPrecision);
// });
--- a/devtools/client/animationinspector/test/browser_animation_timeline_pause_button_03.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_pause_button_03.js
@@ -7,17 +7,17 @@
requestLongerTimeout(2);
// Also checks that the button goes to the right state when the scrubber has
// reached the end of the timeline: continues to be in playing mode for infinite
// animations, goes to paused mode otherwise.
// And test that clicking the button once the scrubber has reached the end of
// the timeline does the right thing.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, inspector} = await openAnimationInspector();
let btn = panel.playTimelineButtonEl;
// For a finite animation, once the scrubber reaches the end of the timeline, the pause
// button should go back to paused mode.
info("Select a finite animation and wait for the animation to complete");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_rate_selector.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_rate_selector.js
@@ -7,17 +7,17 @@
requestLongerTimeout(2);
// Check that the timeline toolbar contains a playback rate selector UI and that
// it can be used to change the playback rate of animations in the timeline.
// Also check that it displays the rate of the current animations in case they
// all have the same rate, or that it displays the empty value in case they
// have mixed rates.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, controller, inspector, toolbox} = await openAnimationInspector();
// In this test, we disable the highlighter on purpose because of the way
// events are simulated to select an option in the playbackRate <select>.
// Indeed, this may cause mousemove events to be triggered on the nodes that
// are underneath the <select>, and these are AnimationTargetNode instances.
--- a/devtools/client/animationinspector/test/browser_animation_timeline_rewind_button.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_rewind_button.js
@@ -8,17 +8,17 @@
requestLongerTimeout(2);
// Check that the timeline toolbar contains a rewind button and that it can be
// clicked. Check that when it is, the current animations displayed in the
// timeline get their playstates changed to paused, and their currentTimes
// reset to 0, and that the scrubber stops moving and is positioned to the
// start.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, controller} = await openAnimationInspector();
let players = controller.animationPlayers;
let btn = panel.rewindTimelineButtonEl;
ok(btn, "The rewind button exists");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_scrubber_exists.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_scrubber_exists.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Check that the timeline does have a scrubber element.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
let scrubberEl = timeline.scrubberEl;
ok(scrubberEl, "The scrubber element exists");
ok(scrubberEl.classList.contains("scrubber"), "It has the right classname");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_scrubber_movable.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_scrubber_movable.js
@@ -7,17 +7,17 @@
requestLongerTimeout(2);
// Check that the scrubber in the timeline can be moved by clicking & dragging
// in the header area.
// Also check that doing so changes the timeline's play/pause button to paused
// state.
// Finally, also check that the scrubber can be moved using the scrubber handle.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
let {win, timeHeaderEl, scrubberEl, scrubberHandleEl} = timeline;
let playTimelineButtonEl = panel.playTimelineButtonEl;
ok(!playTimelineButtonEl.classList.contains("paused"),
--- a/devtools/client/animationinspector/test/browser_animation_timeline_scrubber_moves.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_scrubber_moves.js
@@ -7,17 +7,17 @@
requestLongerTimeout(2);
// Check that the scrubber in the timeline moves when animations are playing.
// The animations in the test page last for a very long time, so the test just
// measures the position of the scrubber once, then waits for some time to pass
// and measures its position again.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
let scrubberEl = timeline.scrubberEl;
let startPos = scrubberEl.getBoundingClientRect().left;
info("Wait for some time to check that the scrubber moves");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_setCurrentTime.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_setCurrentTime.js
@@ -13,17 +13,17 @@ requestLongerTimeout(2);
// the animation progress is 0.5 at 700ms because the progress stops as 0.5 at
// 500ms in original animation. However, if you set as
// animation.currentTime = 700 manually, the progress will be 0.7.
// So we modify setCurrentTime method since
// AnimationInspector should re-produce same as original animation.
// In these tests,
// we confirm the behavior of setCurrentTime by delay and endDelay.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_timing_combination_animation.html");
const { panel, controller } = await openAnimationInspector();
await clickTimelinePlayPauseButton(panel);
const timeBlockComponents = getAnimationTimeBlocks(panel);
// Test -5000ms.
--- a/devtools/client/animationinspector/test/browser_animation_timeline_short_duration.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_short_duration.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test short duration (e.g. 1ms) animation.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_short_duration_animation.html");
const { panel, inspector } = await openAnimationInspector();
info("Check the listed time blocks");
const timeBlocks = getAnimationTimeBlocks(panel);
for (let i = 0; i < timeBlocks.length; i++) {
info(`Check the time block ${i}`);
const {containerEl, animation: {state}} = timeBlocks[i];
--- a/devtools/client/animationinspector/test/browser_animation_timeline_shows_delay.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_shows_delay.js
@@ -6,17 +6,17 @@
requestLongerTimeout(2);
// Check that animation delay is visualized in the timeline when the animation
// is delayed.
// Also check that negative delays do not overflow the UI, and are shown like
// positive delays.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Selecting a delayed animated node");
await selectNodeAndWaitForAnimations(".delayed", inspector);
let timelineEl = panel.animationsTimelineComponent.rootWrapperEl;
checkDelayAndName(timelineEl, true);
let animationEl = timelineEl.querySelector(".animation");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_shows_endDelay.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_shows_endDelay.js
@@ -6,17 +6,17 @@
requestLongerTimeout(2);
// Check that animation endDelay is visualized in the timeline when the
// animation is delayed.
// Also check that negative endDelays do not overflow the UI, and are shown
// like positive endDelays.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_end_delay.html");
let {inspector, panel} = await openAnimationInspector();
let selectors = ["#target1", "#target2", "#target3", "#target4"];
for (let i = 0; i < selectors.length; i++) {
let selector = selectors[i];
await selectNode(selector, inspector);
await waitForAnimationSelecting(panel);
--- a/devtools/client/animationinspector/test/browser_animation_timeline_shows_iterations.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_shows_iterations.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Check that the timeline is displays as many iteration elements as there are
// iterations in an animation.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Selecting the test node");
await selectNodeAndWaitForAnimations(".delayed", inspector);
info("Getting the animation element from the panel");
const timelineComponent = panel.animationsTimelineComponent;
--- a/devtools/client/animationinspector/test/browser_animation_timeline_shows_name_label.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_shows_name_label.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Check the text content and width of name label.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Selecting 'simple-animation' animation which is running on compositor");
await selectNodeAndWaitForAnimations(".animated", inspector);
checkNameLabel(panel.animationsTimelineComponent.rootWrapperEl, "simple-animation");
info("Selecting 'no-compositor' animation which is not running on compositor");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_shows_time_info.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_shows_time_info.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Check that the timeline displays animations' duration, delay iteration
// counts and iteration start in tooltips.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, controller} = await openAnimationInspector();
info("Getting the animation element from the panel");
let timelineEl = panel.animationsTimelineComponent.rootWrapperEl;
let timeBlockNameEls = timelineEl.querySelectorAll(".time-block .name");
// Verify that each time-block's name element has a tooltip that looks sort of
--- a/devtools/client/animationinspector/test/browser_animation_timeline_takes_rate_into_account.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_takes_rate_into_account.js
@@ -6,17 +6,17 @@
// Check that if an animation has had its playbackRate changed via the DOM, then
// the timeline UI shows the right delay and duration.
// Indeed, the header in the timeline UI always shows the unaltered time,
// because there might be multiple animations displayed at the same time, some
// of which may have a different rate than others. Those that have had their
// rate changed have a delay = delay/rate and a duration = duration/rate.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_modify_playbackRate.html");
let {panel} = await openAnimationInspector();
let timelineEl = panel.animationsTimelineComponent.rootWrapperEl;
let timeBlocks = timelineEl.querySelectorAll(".time-block");
is(timeBlocks.length, 2, "2 animations are displayed");
--- a/devtools/client/animationinspector/test/browser_animation_timeline_ui.js
+++ b/devtools/client/animationinspector/test/browser_animation_timeline_ui.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Check that the timeline contains the right elements.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
let timeline = panel.animationsTimelineComponent;
let el = timeline.rootWrapperEl;
ok(el.querySelector(".time-header"),
"The header element is in the DOM of the timeline");
--- a/devtools/client/animationinspector/test/browser_animation_toggle_button_resets_on_navigate.js
+++ b/devtools/client/animationinspector/test/browser_animation_toggle_button_resets_on_navigate.js
@@ -3,17 +3,17 @@
http://creativecommons.org/publicdomain/zero/1.0/ */
"use strict";
requestLongerTimeout(2);
// Test that a page navigation resets the state of the global toggle button.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, panel} = await openAnimationInspector();
info("Select the non-animated test node");
await selectNodeAndWaitForAnimations(".still", inspector);
ok(!panel.toggleAllButtonEl.classList.contains("paused"),
"The toggle button is in its running state by default");
--- a/devtools/client/animationinspector/test/browser_animation_toggle_button_toggles_animations.js
+++ b/devtools/client/animationinspector/test/browser_animation_toggle_button_toggles_animations.js
@@ -6,17 +6,17 @@
requestLongerTimeout(2);
// Test that the main toggle button actually toggles animations.
// This test doesn't need to be extra careful about checking that *all*
// animations have been paused (including inside iframes) because there's an
// actor test in /devtools/server/tests/browser/ that does this.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel} = await openAnimationInspector();
info("Click the toggle button");
await panel.toggleAll();
await checkState("paused");
info("Click again the toggle button");
--- a/devtools/client/animationinspector/test/browser_animation_toolbar_exists.js
+++ b/devtools/client/animationinspector/test/browser_animation_toolbar_exists.js
@@ -6,17 +6,17 @@
requestLongerTimeout(2);
// Test that the animation panel has a top toolbar that contains the play/pause
// button and that is displayed at all times.
// Also test that this toolbar gets replaced by the timeline toolbar when there
// are animations to be displayed.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {inspector, window} = await openAnimationInspector();
let doc = window.document;
let toolbar = doc.querySelector("#global-toolbar");
ok(toolbar, "The panel contains the toolbar element with the new UI");
ok(!isNodeVisible(toolbar),
"The toolbar is hidden while there are animations");
--- a/devtools/client/animationinspector/test/browser_animation_ui_updates_when_animation_data_changes.js
+++ b/devtools/client/animationinspector/test/browser_animation_ui_updates_when_animation_data_changes.js
@@ -4,17 +4,17 @@
"use strict";
requestLongerTimeout(2);
// Verify that if the animation's duration, iterations or delay change in
// content, then the widget reflects the changes.
-add_task(async function() {
+add_task(async function () {
await addTab(URL_ROOT + "doc_simple_animation.html");
let {panel, controller, inspector} = await openAnimationInspector();
info("Select the test node");
await selectNodeAndWaitForAnimations(".animated", inspector);
let animation = controller.animationPlayers[0];
await setStyle(animation, panel, "animationDuration", "5.5s", ".animated");
--- a/devtools/client/animationinspector/test/head.js
+++ b/devtools/client/animationinspector/test/head.js
@@ -12,17 +12,17 @@ Services.scriptloader.loadSubScript(
this);
const FRAME_SCRIPT_URL = CHROME_URL_ROOT + "doc_frame_script.js";
const TAB_NAME = "animationinspector";
const ANIMATION_L10N =
new LocalizationHelper("devtools/client/locales/animationinspector.properties");
// Auto clean-up when a test ends
-registerCleanupFunction(async function() {
+registerCleanupFunction(async function () {
await closeAnimationInspector();
while (gBrowser.tabs.length > 1) {
gBrowser.removeCurrentTab();
}
});
// Clean-up all prefs that might have been changed during a test run
@@ -81,17 +81,17 @@ async function reloadTab(inspector) {
* The instance of InspectorPanel currently
* loaded in the toolbox
* @param {String} reason
* Defaults to "test" which instructs the inspector not
* to highlight the node upon selection
* @return {Promise} Resolves when the inspector is updated with the new node
and animations of its subtree are properly displayed.
*/
-var selectNodeAndWaitForAnimations = async function(data, inspector, reason = "test") {
+var selectNodeAndWaitForAnimations = async function (data, inspector, reason = "test") {
// We want to make sure the rest of the test waits for the animations to
// be properly displayed (wait for all target DOM nodes to be previewed).
let {AnimationsController, AnimationsPanel} =
inspector.sidebar.getWindowForTab(TAB_NAME);
let onUiUpdated = AnimationsPanel.once(AnimationsPanel.UI_UPDATED_EVENT);
await selectNode(data, inspector, reason);
@@ -119,17 +119,17 @@ function assertAnimationsDisplayed(panel
/**
* Takes an Inspector panel that was just created, and waits
* for a "inspector-updated" event as well as the animation inspector
* sidebar to be ready. Returns a promise once these are completed.
*
* @param {InspectorPanel} inspector
* @return {Promise}
*/
-var waitForAnimationInspectorReady = async function(inspector) {
+var waitForAnimationInspectorReady = async function (inspector) {
let win = inspector.sidebar.getWindowForTab(TAB_NAME);
let updated = inspector.once("inspector-updated");
// In e10s, if we wait for underlying toolbox actors to
// load (by setting DevToolsUtils.testing to true), we miss the
// "animationinspector-ready" event on the sidebar, so check to see if the
// iframe is already loaded.
let tabReady = win.document.readyState === "complete" ?
@@ -139,17 +139,17 @@ var waitForAnimationInspectorReady = asy
return promise.all([updated, tabReady]);
};
/**
* Open the toolbox, with the inspector tool visible and the animationinspector
* sidebar selected.
* @return a promise that resolves when the inspector is ready.
*/
-var openAnimationInspector = async function() {
+var openAnimationInspector = async function () {
let {inspector, toolbox} = await openInspectorSidebarTab(TAB_NAME);
info("Waiting for the inspector and sidebar to be ready");
await waitForAnimationInspectorReady(inspector);
let win = inspector.sidebar.getWindowForTab(TAB_NAME);
let {AnimationsController, AnimationsPanel} = win;
@@ -173,17 +173,17 @@ var openAnimationInspector = async funct
window: win
};
};
/**
* Close the toolbox.
* @return a promise that resolves when the toolbox has closed.
*/
-var closeAnimationInspector = async function() {
+var closeAnimationInspector = async function () {
let target = TargetFactory.forTab(gBrowser.selectedTab);
await gDevTools.closeToolbox(target);
};
/**
* Wait for a content -> chrome message on the message manager (the window
* messagemanager is used).
* @param {String} name The message name
@@ -226,17 +226,17 @@ function executeInContent(name, data = {
}
return promise.resolve();
}
/**
* Get the current playState of an animation player on a given node.
*/
-var getAnimationPlayerState = async function(selector,
+var getAnimationPlayerState = async function (selector,
animationIndex = 0) {
let playState = await executeInContent("Test:GetAnimationPlayerState",
{selector, animationIndex});
return playState;
};
/**
* Is the given node visible in the page (rendered in the frame tree).
@@ -250,17 +250,17 @@ function isNodeVisible(node) {
/**
* Wait for all AnimationTargetNode instances to be fully loaded
* (fetched their related actor and rendered), and return them.
* This method should be called after "animation-timeline-rendering-completed" is emitted,
* since we get all the AnimationTargetNode instances using getAnimationTargetNodes().
* @param {AnimationsPanel} panel
* @return {Array} all AnimationTargetNode instances
*/
-var waitForAllAnimationTargets = async function(panel) {
+var waitForAllAnimationTargets = async function (panel) {
let targets = getAnimationTargetNodes(panel);
await promise.all(targets.map(t => {
if (!t.previewer.nodeFront) {
return t.once("target-retrieved");
}
return false;
}));
return targets;