diff options
Diffstat (limited to 'devtools/client/inspector/animation/test/browser_animation_fission_switch-target.js')
-rw-r--r-- | devtools/client/inspector/animation/test/browser_animation_fission_switch-target.js | 99 |
1 files changed, 99 insertions, 0 deletions
diff --git a/devtools/client/inspector/animation/test/browser_animation_fission_switch-target.js b/devtools/client/inspector/animation/test/browser_animation_fission_switch-target.js new file mode 100644 index 0000000000..5a50e4098f --- /dev/null +++ b/devtools/client/inspector/animation/test/browser_animation_fission_switch-target.js @@ -0,0 +1,99 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Test that the animation inspector works after switching targets. + +const PAGE_ON_CONTENT = `data:text/html;charset=utf-8, +<!DOCTYPE html> +<style type="text/css"> + div { + opacity: 0; + transition-duration: 5000ms; + transition-property: opacity; + } + + div:hover { + opacity: 1; + } +</style> +<div class="anim">animation</div> +`; +const PAGE_ON_MAIN = "about:networking"; + +add_task(async function () { + await pushPref("devtools.inspector.three-pane-enabled", false); + + info("Open a page that runs on the content process and has animations"); + const tab = await addTab(PAGE_ON_CONTENT); + const { animationInspector, inspector } = await openAnimationInspector(); + + info("Check the length of the initial animations of the content process"); + is( + animationInspector.state.animations.length, + 0, + "The length of the initial animation is correct" + ); + + info("Check whether the mutation on content process page is worked or not"); + await assertAnimationsMutation(tab, "div", animationInspector, 1); + + info("Load a page that runs on the main process"); + await navigateTo( + PAGE_ON_MAIN, + tab.linkedBrowser, + animationInspector, + inspector + ); + await waitUntil(() => animationInspector.state.animations.length === 0); + ok(true, "The animations are replaced"); + + info("Check whether the mutation on main process page is worked or not"); + await assertAnimationsMutation(tab, "#category-http", animationInspector, 1); + + info("Load a content process page again"); + await navigateTo( + PAGE_ON_CONTENT, + tab.linkedBrowser, + animationInspector, + inspector + ); + await waitUntil(() => animationInspector.state.animations.length === 0); + ok(true, "The animations are replaced again"); + + info("Check the mutation on content process again"); + await assertAnimationsMutation(tab, "div", animationInspector, 1); +}); + +async function assertAnimationsMutation( + tab, + selector, + animationInspector, + expectedAnimationCount +) { + await hover(tab, selector); + await waitUntil( + () => animationInspector.state.animations.length === expectedAnimationCount + ); + ok(true, "Animations mutation is worked"); +} + +async function navigateTo(uri, browser, animationInspector, inspector) { + const previousAnimationsFront = animationInspector.animationsFront; + const onReloaded = inspector.once("reloaded"); + const onUpdated = inspector.once("inspector-updated"); + BrowserTestUtils.startLoadingURIString(browser, uri); + await waitUntil( + () => previousAnimationsFront !== animationInspector.animationsFront + ); + ok(true, "Target is switched correctly"); + await Promise.all([onReloaded, onUpdated]); +} + +async function hover(tab, selector) { + await SpecialPowers.spawn(tab.linkedBrowser, [selector], async s => { + const element = content.wrappedJSObject.document.querySelector(s); + InspectorUtils.addPseudoClassLock(element, ":hover", true); + }); +} |