author | Daisuke Akatsuka <dakatsuka@mozilla.com> |
Tue, 03 Apr 2018 12:26:10 +0900 | |
changeset 411518 | 64c98c77e0f930c5bca2786670d66b0e7d6cf9bf |
parent 411517 | 6ef7e2cd46f5e5d033f823ad4d604112a5aaf832 |
child 411519 | d51d434ff1a9a4e4e857caad671fba9c98d485c0 |
push id | 101686 |
push user | aciure@mozilla.com |
push date | Tue, 03 Apr 2018 21:59:31 +0000 |
treeherder | mozilla-inbound@8d846598d35d [default view] [failures only] |
perfherder | [talos] [build metrics] [platform microbench] (compared to previous push) |
reviewers | pbro |
bugs | 1448732 |
milestone | 61.0a1 |
first release with | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
last release without | nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
|
--- a/devtools/client/inspector/animation/test/browser.ini +++ b/devtools/client/inspector/animation/test/browser.ini @@ -1,13 +1,14 @@ [DEFAULT] tags = devtools subsuite = devtools support-files = doc_custom_playback_rate.html + doc_frame_script.js doc_multi_easings.html doc_multi_keyframes.html doc_multi_timings.html doc_simple_animation.html head.js !/devtools/client/inspector/test/head.js !/devtools/client/inspector/test/shared-head.js !/devtools/client/shared/test/frame-script-utils.js
--- a/devtools/client/inspector/animation/test/browser_animation_animated-property-list.js +++ b/devtools/client/inspector/animation/test/browser_animation_animated-property-list.js @@ -15,16 +15,17 @@ const TEST_DATA = [ { targetClass: "compositor-notall", expectedNumber: 3, }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { inspector, panel } = await openAnimationInspector(); info("Checking animated property list and items existence at initial"); ok(!panel.querySelector(".animated-property-list"), "The animated-property-list should not be in the DOM at initial"); for (const { targetClass, expectedNumber } of TEST_DATA) { info(`Checking animated-property-list and items existence at ${ targetClass }`);
--- a/devtools/client/inspector/animation/test/browser_animation_animated-property-list_unchanged-items.js +++ b/devtools/client/inspector/animation/test/browser_animation_animated-property-list_unchanged-items.js @@ -18,20 +18,20 @@ const TEST_DATA = [ { property: "background-size", isUnchanged: true }, { property: "padding-bottom", isUnchanged: true }, { property: "padding-right", isUnchanged: true }, { property: "padding-top", isUnchanged: true }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); - const { inspector, panel } = await openAnimationInspector(); + await removeAnimatedElementsExcept([".longhand"]); + const { panel } = await openAnimationInspector(); info("Checking unchanged animated property item"); - await selectNodeAndWaitForAnimations(".longhand", inspector); const itemEls = panel.querySelectorAll(".animated-property-item"); is(itemEls.length, TEST_DATA.length, `Count of animated property item should be ${ TEST_DATA.length }`); for (let i = 0; i < TEST_DATA.length; i++) { const { property, isUnchanged } = TEST_DATA[i]; const itemEl = itemEls[i];
--- a/devtools/client/inspector/animation/test/browser_animation_animated-property-name.js +++ b/devtools/client/inspector/animation/test/browser_animation_animated-property-name.js @@ -19,21 +19,20 @@ const TEST_DATA = [ }, { property: "width", }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); - const { inspector, panel } = await openAnimationInspector(); + await removeAnimatedElementsExcept([".compositor-notall"]); + const { panel } = await openAnimationInspector(); info("Checking animated property name component"); - await selectNodeAndWaitForAnimations(".compositor-notall", inspector); - const animatedPropertyNameEls = panel.querySelectorAll(".animated-property-name"); is(animatedPropertyNameEls.length, TEST_DATA.length, `Number of animated property name elements should be ${ TEST_DATA.length }`); for (const [index, animatedPropertyNameEl] of animatedPropertyNameEls.entries()) { const { property, isOnCompositor,
--- a/devtools/client/inspector/animation/test/browser_animation_animation-detail_close-button.js +++ b/devtools/client/inspector/animation/test/browser_animation_animation-detail_close-button.js @@ -1,17 +1,17 @@ /* Any copyright is dedicated to the Public Domain. http://creativecommons.org/publicdomain/zero/1.0/ */ "use strict"; // Test that whether close button in header of animation detail works. add_task(async function() { - await addTab(URL_ROOT + "doc_multi_timings.html"); + await addTab(URL_ROOT + "doc_custom_playback_rate.html"); const { animationInspector, panel } = await openAnimationInspector(); info("Checking close button in header of animation detail"); await clickOnAnimation(animationInspector, panel, 0); const detailEl = panel.querySelector("#animation-container .controlled"); const win = panel.ownerGlobal; isnot(win.getComputedStyle(detailEl).display, "none", "detailEl should be visibled before clicking close button");
--- a/devtools/client/inspector/animation/test/browser_animation_animation-detail_title.js +++ b/devtools/client/inspector/animation/test/browser_animation_animation-detail_title.js @@ -17,16 +17,17 @@ const TEST_DATA = [ { targetClass: "easing-step", expectedTitle: "Script Animation", }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { inspector, panel } = await openAnimationInspector(); info("Checking title in each header of animation detail"); for (const { targetClass, expectedTitle } of TEST_DATA) { info(`Checking title at ${ targetClass }`); await selectNodeAndWaitForAnimations(`.${ targetClass }`, inspector); const titleEl = panel.querySelector(".animation-detail-title");
--- a/devtools/client/inspector/animation/test/browser_animation_animation-detail_visibility.js +++ b/devtools/client/inspector/animation/test/browser_animation_animation-detail_visibility.js @@ -3,17 +3,17 @@ "use strict"; // Test that whether animations detail could be displayed if there is selected animation. requestLongerTimeout(2); add_task(async function() { - await addTab(URL_ROOT + "doc_multi_timings.html"); + await addTab(URL_ROOT + "doc_custom_playback_rate.html"); const { animationInspector, inspector, panel } = await openAnimationInspector(); info("Checking animation detail visibility if animation was unselected"); const detailEl = panel.querySelector("#animation-container .controlled"); ok(detailEl, "The detail pane should be in the DOM"); const win = panel.ownerGlobal; is(win.getComputedStyle(detailEl).display, "none", "detailEl should be unvisibled"); @@ -22,12 +22,12 @@ add_task(async function() { isnot(win.getComputedStyle(detailEl).display, "none", "detailEl should be visibled"); info("Checking animation detail visibility when choose node which has animations"); await selectNodeAndWaitForAnimations("html", inspector); is(win.getComputedStyle(detailEl).display, "none", "detailEl should be unvisibled after choose html node"); info("Checking animation detail visibility when choose node which has an animation"); - await selectNodeAndWaitForAnimations(".cssanimation-normal", inspector); + await selectNodeAndWaitForAnimations("div", inspector); isnot(win.getComputedStyle(detailEl).display, "none", "detailEl should be visibled after choose .cssanimation-normal node"); });
--- a/devtools/client/inspector/animation/test/browser_animation_animation-list.js +++ b/devtools/client/inspector/animation/test/browser_animation_animation-list.js @@ -2,17 +2,17 @@ http://creativecommons.org/publicdomain/zero/1.0/ */ "use strict"; // Test that whether animations ui could be displayed add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); - + await removeAnimatedElementsExcept([".animated", ".long"]); const { animationInspector, inspector, panel } = await openAnimationInspector(); info("Checking animation list and items existence"); ok(panel.querySelector(".animation-list"), "The animation-list is in the DOM"); is(panel.querySelectorAll(".animation-list .animation-item").length, animationInspector.state.animations.length, "The number of animations displayed matches the number of animations"); @@ -22,13 +22,12 @@ add_task(async function() { const evenColor = panel.ownerGlobal.getComputedStyle(animationItemEls[0]).backgroundColor; const oddColor = panel.ownerGlobal.getComputedStyle(animationItemEls[1]).backgroundColor; isnot(evenColor, oddColor, "Background color of an even animation should be different from odd"); info("Checking list and items existence after select a element which has an animation"); - const animatedNode = await getNodeFront(".animated", inspector); - await selectNodeAndWaitForAnimations(animatedNode, inspector); + await selectNodeAndWaitForAnimations(".animated", inspector); is(panel.querySelectorAll(".animation-list .animation-item").length, 1, "The number of animations displayed should be 1 for .animated element"); });
--- a/devtools/client/inspector/animation/test/browser_animation_animation-target.js +++ b/devtools/client/inspector/animation/test/browser_animation_animation-target.js @@ -5,16 +5,17 @@ // Test for following AnimationTarget component works. // * element existance // * number of elements // * content of element add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); + await removeAnimatedElementsExcept([".animated", ".long"]); const { animationInspector, inspector, panel } = await openAnimationInspector(); info("Checking the animation target elements existance"); const animationItemEls = panel.querySelectorAll(".animation-list .animation-item"); is(animationItemEls.length, animationInspector.state.animations.length, "Number of animation target element should be same to number of animations " + "that displays");
--- a/devtools/client/inspector/animation/test/browser_animation_animation-timeline-tick.js +++ b/devtools/client/inspector/animation/test/browser_animation_animation-timeline-tick.js @@ -13,16 +13,17 @@ const { findOptimalTimeInterval } = require("devtools/client/inspector/animation/utils/utils"); // Should be kept in sync with TIME_GRADUATION_MIN_SPACING in // AnimationTimeTickList component. const TIME_GRADUATION_MIN_SPACING = 40; add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); + await removeAnimatedElementsExcept([".end-delay", ".negative-delay"]); const { animationInspector, inspector, panel } = await openAnimationInspector(); const timeScale = new TimeScale(animationInspector.state.animations); info("Checking animation list header element existence"); const listContainerEl = panel.querySelector(".animation-list-container"); const listHeaderEl = listContainerEl.querySelector(".devtools-toolbar"); ok(listHeaderEl, "The header element should be in animation list container element");
--- a/devtools/client/inspector/animation/test/browser_animation_current-time-label.js +++ b/devtools/client/inspector/animation/test/browser_animation_current-time-label.js @@ -4,24 +4,24 @@ "use strict"; // Test for following CurrentTimeLabel component: // * element existence // * label content at plural timing add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - const { animationInspector, inspector, panel } = await openAnimationInspector(); + await removeAnimatedElementsExcept([".keyframes-easing-step"]); + const { animationInspector, panel } = await openAnimationInspector(); info("Checking current time label existence"); const labelEl = panel.querySelector(".current-time-label"); ok(labelEl, "current time label should exist"); info("Checking current time label content"); - await selectNodeAndWaitForAnimations(".keyframes-easing-step", inspector); await clickOnCurrentTimeScrubberController(animationInspector, panel, 0.5); assertLabelContent(labelEl, animationInspector.state.animations[0].state.currentTime); await clickOnCurrentTimeScrubberController(animationInspector, panel, 0.2); assertLabelContent(labelEl, animationInspector.state.animations[0].state.currentTime); info("Checking current time label content during running"); // Resume await clickOnPauseResumeButton(animationInspector, panel);
--- a/devtools/client/inspector/animation/test/browser_animation_current-time-scrubber.js +++ b/devtools/client/inspector/animation/test/browser_animation_current-time-scrubber.js @@ -6,28 +6,28 @@ // Test for following CurrentTimeScrubber and CurrentTimeScrubberController components: // * element existence // * scrubber position validity // * make animations currentTime to change by click on the controller // * mouse drag on the scrubber add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); - const { animationInspector, inspector, panel } = await openAnimationInspector(); + await removeAnimatedElementsExcept([".long"]); + const { animationInspector, panel } = await openAnimationInspector(); info("Checking scrubber controller existence"); const controllerEl = panel.querySelector(".current-time-scrubber-controller"); ok(controllerEl, "scrubber controller should exist"); info("Checking scrubber existence"); const scrubberEl = controllerEl.querySelector(".current-time-scrubber"); ok(scrubberEl, "scrubber should exist"); info("Checking scrubber changes current time of animation and the position"); - await selectNodeAndWaitForAnimations(".long", inspector); const duration = animationInspector.state.timeScale.getDuration(); await clickOnCurrentTimeScrubberController(animationInspector, panel, 0); assertAnimationsCurrentTime(animationInspector, 0); assertPosition(scrubberEl, controllerEl, 0, animationInspector); await clickOnCurrentTimeScrubberController(animationInspector, panel, 1); assertAnimationsCurrentTime(animationInspector, duration); assertPosition(scrubberEl, controllerEl, duration, animationInspector);
--- a/devtools/client/inspector/animation/test/browser_animation_empty_on_invalid_nodes.js +++ b/devtools/client/inspector/animation/test/browser_animation_empty_on_invalid_nodes.js @@ -3,17 +3,17 @@ "use strict"; requestLongerTimeout(2); // Test that the panel shows no animation data for invalid or not animated nodes add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); - + await removeAnimatedElementsExcept([".animated", ".long", ".still"]); const { inspector, panel } = await openAnimationInspector(); info("Checking animation list and error message existence for a still node"); const stillNode = await getNodeFront(".still", inspector); await selectNodeAndWaitForAnimations(stillNode, inspector); ok(panel.querySelector(".animation-error-message"), "Element which has animation-error-message class should exist for a still node");
--- a/devtools/client/inspector/animation/test/browser_animation_keyframes-graph_computed-value-path.js +++ b/devtools/client/inspector/animation/test/browser_animation_keyframes-graph_computed-value-path.js @@ -407,17 +407,16 @@ const TEST_DATA = [ ], }, ], }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_keyframes.html"); - const { inspector, panel } = await openAnimationInspector(); for (const { properties, targetClass } of TEST_DATA) { info(`Checking keyframes graph for ${ targetClass }`); await selectNodeAndWaitForAnimations(`.${ targetClass }`, inspector); for (const property of properties) { const {
--- a/devtools/client/inspector/animation/test/browser_animation_keyframes-graph_computed-value-path_easing-hint.js +++ b/devtools/client/inspector/animation/test/browser_animation_keyframes-graph_computed-value-path_easing-hint.js @@ -186,17 +186,17 @@ const TEST_DATA = [ ], }, ], }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_easings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { inspector, panel } = await openAnimationInspector(); for (const { properties, targetClass } of TEST_DATA) { info(`Checking keyframes graph for ${ targetClass }`); await selectNodeAndWaitForAnimations(`.${ targetClass }`, inspector); for (const { name, expectedHints } of properties) { const testTarget = `${ name } in ${ targetClass }`;
--- a/devtools/client/inspector/animation/test/browser_animation_keyframes-graph_keyframe-marker.js +++ b/devtools/client/inspector/animation/test/browser_animation_keyframes-graph_keyframe-marker.js @@ -130,17 +130,17 @@ const TEST_DATA = [ ], }, ], } ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_keyframes.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { inspector, panel } = await openAnimationInspector(); for (const { properties, targetClass } of TEST_DATA) { info(`Checking keyframe marker for ${ targetClass }`); await selectNodeAndWaitForAnimations(`.${ targetClass }`, inspector); for (const { name, expectedValues } of properties) { const testTarget = `${ name } in ${ targetClass }`;
--- a/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js +++ b/devtools/client/inspector/animation/test/browser_animation_keyframes-progress-bar.js @@ -51,16 +51,17 @@ const TEST_DATA = [ targetClass: "fill-both-width-delay-iterationstart", scrubberPositions: [0, 0.33, 0.66, 0.833, 1], expectedPositions: [0.5, 0.5, 0.99, 0.25, 0.5], }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { animationInspector, inspector, panel } = await openAnimationInspector(); info("Checking progress bar position in multi effect timings"); for (const testdata of TEST_DATA) { const { targetClass, scrubberPositions,
--- a/devtools/client/inspector/animation/test/browser_animation_logic_auto-stop.js +++ b/devtools/client/inspector/animation/test/browser_animation_logic_auto-stop.js @@ -7,16 +7,17 @@ // after end of animation duration except iterations infinity. // Test followings: // * state of animations and UI components after end of animation duration // * state of animations and UI components after end of animation duration // but iteration count is infinity add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); + await removeAnimatedElementsExcept([".compositor-all", ".long"]); const { animationInspector, inspector, panel } = await openAnimationInspector(); info("Checking state after end of animation duration"); await selectNodeAndWaitForAnimations(".long", inspector); const pixelsData = getDurationAndRate(animationInspector, panel, 5); await clickOnCurrentTimeScrubberController(animationInspector, panel, 1 - pixelsData.rate); await clickOnPauseResumeButton(animationInspector, panel);
--- a/devtools/client/inspector/animation/test/browser_animation_logic_mutations.js +++ b/devtools/client/inspector/animation/test/browser_animation_logic_mutations.js @@ -5,16 +5,18 @@ // Test for following mutations: // * add animation // * remove animation // * modify animation add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); + await removeAnimatedElementsExcept( + [".compositor-all", ".compositor-notall", ".no-compositor", ".still"]); const { animationInspector, inspector, panel } = await openAnimationInspector(); info("Checking the mutation for add an animation"); const originalAnimationCount = animationInspector.state.animations.length; await setClassAttribute(animationInspector, ".still", "ball no-compositor"); is(animationInspector.state.animations.length, originalAnimationCount + 1, "Count of animation should be plus one to original count");
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_animation-name.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_animation-name.js @@ -26,17 +26,17 @@ const TEST_DATA = [ }, { targetClass: "easing-step", }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedLabel } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); info(`Checking animation name element existance for ${ targetClass }`); const animationNameEl = animationItemEl.querySelector(".animation-name");
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_compositor.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_compositor.js @@ -3,17 +3,18 @@ "use strict"; // 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() { await addTab(URL_ROOT + "doc_simple_animation.html"); - + await removeAnimatedElementsExcept( + [".compositor-all", ".compositor-notall", ".no-compositor"]); const { inspector, panel } = await openAnimationInspector(); info("Select a test node we know has an animation running on the compositor"); await selectNodeAndWaitForAnimations(".compositor-all", inspector); const summaryGraphEl = panel.querySelector(".animation-summary-graph"); ok(summaryGraphEl.classList.contains("compositor"), "The element has the compositor css class");
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_computed-timing-path.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_computed-timing-path.js @@ -386,17 +386,16 @@ const TEST_DATA = [ { x: 999999, y: 50 }, ] ], }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - const { panel } = await openAnimationInspector(); for (const testData of TEST_DATA) { const { expectedDelayPath, expectedEndDelayPath, expectedForwardsPath, expectedIterationPathList,
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_computed-timing-path_different-timescale.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_computed-timing-path_different-timescale.js @@ -2,16 +2,17 @@ http://creativecommons.org/publicdomain/zero/1.0/ */ "use strict"; // Test the Computed Timing Path component for different time scales. add_task(async function() { await addTab(URL_ROOT + "doc_simple_animation.html"); + await removeAnimatedElementsExcept([".animated", ".end-delay"]); const { inspector, panel } = await openAnimationInspector(); info("Checking the path for different time scale"); await selectNodeAndWaitForAnimations(".animated", inspector); const pathStringA = panel.querySelector(".animation-iteration-path").getAttribute("d"); info("Select animation which has different time scale from no-compositor"); await selectNodeAndWaitForAnimations(".end-delay", inspector);
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_delay-sign.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_delay-sign.js @@ -46,17 +46,17 @@ const TEST_DATA = [ }, { targetClass: "keyframes-easing-step", }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedResult } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); info(`Checking delay sign existance for ${ targetClass }`); const delaySignEl = animationItemEl.querySelector(".animation-delay-sign");
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_effect-timing-path.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_effect-timing-path.js @@ -26,17 +26,17 @@ const TEST_DATA = [ }, { targetClass: "keyframes-easing-step", }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedPath } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); info(`Checking effect timing path existance for ${ targetClass }`); const effectTimingPathEl =
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_end-delay-sign.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_end-delay-sign.js @@ -32,23 +32,23 @@ const TEST_DATA = [ left: "75%", width: "25%", }, }, { targetClass: "enddelay-with-iterations-infinity", }, { - targetClass: "keyframes-easing-step", + targetClass: "delay-negative", }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedResult } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); info(`Checking endDelay sign existance for ${ targetClass }`); const endDelaySignEl = animationItemEl.querySelector(".animation-end-delay-sign");
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_negative-delay-path.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_negative-delay-path.js @@ -19,17 +19,17 @@ const TEST_DATA = [ { x: 0, y: 50 }, { x: 0, y: 0 }, ], }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedPath } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); info(`Checking negative delay path existence for ${ targetClass }`); const negativeDelayPathEl =
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_negative-end-delay-path.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_negative-end-delay-path.js @@ -20,17 +20,17 @@ const TEST_DATA = [ { x: 1000000, y: 100 }, { x: 1000000, y: 0 }, ], }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedPath } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); info(`Checking negative endDelay path existance for ${ targetClass }`); const negativeEndDelayPathEl =
--- a/devtools/client/inspector/animation/test/browser_animation_summary-graph_tooltip.js +++ b/devtools/client/inspector/animation/test/browser_animation_summary-graph_tooltip.js @@ -171,17 +171,17 @@ const TEST_DATA = [ nameAndType: "Script Animation", duration: "1,000s", }, }, ]; add_task(async function() { await addTab(URL_ROOT + "doc_multi_timings.html"); - + await removeAnimatedElementsExcept(TEST_DATA.map(t => `.${ t.targetClass }`)); const { panel } = await openAnimationInspector(); for (const { targetClass, expectedResult } of TEST_DATA) { const animationItemEl = findAnimationItemElementsByTargetClassName(panel, targetClass); const summaryGraphEl = animationItemEl.querySelector(".animation-summary-graph"); info(`Checking tooltip for ${ targetClass }`);
new file mode 100644 --- /dev/null +++ b/devtools/client/inspector/animation/test/doc_frame_script.js @@ -0,0 +1,29 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ +/* globals addMessageListener, sendAsyncMessage */ + +"use strict"; + +// A helper frame-script for animation inspector. + +addMessageListener("Test:RemoveAnimatedElementsExcept", function(msg) { + const { selectors } = msg.data; + + for (const animation of content.document.getAnimations()) { + if (isRemovableElement(animation, selectors)) { + animation.effect.target.remove(); + } + } + + sendAsyncMessage("Test:RemoveAnimatedElementsExcept"); +}); + +function isRemovableElement(animation, selectors) { + for (const selector of selectors) { + if (animation.effect.target.matches(selector)) { + return false; + } + } + + return true; +}
--- a/devtools/client/inspector/animation/test/head.js +++ b/devtools/client/inspector/animation/test/head.js @@ -80,16 +80,26 @@ addTab = async function(url) { const browser = tab.linkedBrowser; info("Loading the helper frame script " + FRAME_SCRIPT_URL); browser.messageManager.loadFrameScript(FRAME_SCRIPT_URL, false); loadFrameScriptUtils(browser); return tab; }; /** + * Remove animated elements from document except given selectors. + * + * @param {Array} selectors + * @return {Promise} + */ +const removeAnimatedElementsExcept = async function(selectors) { + return executeInContent("Test:RemoveAnimatedElementsExcept", { selectors }); +}; + +/** * Click on an animation in the timeline to select it. * * @param {AnimationInspector} animationInspector. * @param {AnimationsPanel} panel * The panel instance. * @param {Number} index * The index of the animation to click on. */