diff options
author | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
---|---|---|
committer | Matt A. Tobin <mattatobin@localhost.localdomain> | 2018-02-02 04:16:08 -0500 |
commit | 5f8de423f190bbb79a62f804151bc24824fa32d8 (patch) | |
tree | 10027f336435511475e392454359edea8e25895d /devtools/client/inspector/test/browser_inspector_delete-selected-node-02.js | |
parent | 49ee0794b5d912db1f95dce6eb52d781dc210db5 (diff) | |
download | UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.gz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.lz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.tar.xz UXP-5f8de423f190bbb79a62f804151bc24824fa32d8.zip |
Add m-esr52 at 52.6.0
Diffstat (limited to 'devtools/client/inspector/test/browser_inspector_delete-selected-node-02.js')
-rw-r--r-- | devtools/client/inspector/test/browser_inspector_delete-selected-node-02.js | 154 |
1 files changed, 154 insertions, 0 deletions
diff --git a/devtools/client/inspector/test/browser_inspector_delete-selected-node-02.js b/devtools/client/inspector/test/browser_inspector_delete-selected-node-02.js new file mode 100644 index 000000000..fbd008a89 --- /dev/null +++ b/devtools/client/inspector/test/browser_inspector_delete-selected-node-02.js @@ -0,0 +1,154 @@ +/* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */ +/* vim: set ts=2 et sw=2 tw=80: */ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ +"use strict"; + +// Test that when nodes are being deleted in the page, the current selection +// and therefore the markup view, css rule view, computed view, font view, +// box model view, and breadcrumbs, reset accordingly to show the right node + +const TEST_PAGE = URL_ROOT + + "doc_inspector_delete-selected-node-02.html"; + +add_task(function* () { + let { inspector } = yield openInspectorForURL(TEST_PAGE); + + yield testManuallyDeleteSelectedNode(); + yield testAutomaticallyDeleteSelectedNode(); + yield testDeleteSelectedNodeContainerFrame(); + yield testDeleteWithNonElementNode(); + + function* testManuallyDeleteSelectedNode() { + info("Selecting a node, deleting it via context menu and checking that " + + "its parent node is selected and breadcrumbs are updated."); + + yield deleteNodeWithContextMenu("#deleteManually"); + + info("Performing checks."); + yield assertNodeSelectedAndPanelsUpdated("#selectedAfterDelete", + "li#selectedAfterDelete"); + } + + function* testAutomaticallyDeleteSelectedNode() { + info("Selecting a node, deleting it via javascript and checking that " + + "its parent node is selected and breadcrumbs are updated."); + + let div = yield getNodeFront("#deleteAutomatically", inspector); + yield selectNode(div, inspector); + + info("Deleting selected node via javascript."); + yield inspector.walker.removeNode(div); + + info("Waiting for inspector to update."); + yield inspector.once("inspector-updated"); + + info("Inspector updated, performing checks."); + yield assertNodeSelectedAndPanelsUpdated("#deleteChildren", + "ul#deleteChildren"); + } + + function* testDeleteSelectedNodeContainerFrame() { + info("Selecting a node inside iframe, deleting the iframe via javascript " + + "and checking the parent node of the iframe is selected and " + + "breadcrumbs are updated."); + + info("Selecting an element inside iframe."); + let iframe = yield getNodeFront("#deleteIframe", inspector); + let div = yield getNodeFrontInFrame("#deleteInIframe", iframe, inspector); + yield selectNode(div, inspector); + + info("Deleting selected node via javascript."); + yield inspector.walker.removeNode(iframe); + + info("Waiting for inspector to update."); + yield inspector.once("inspector-updated"); + + info("Inspector updated, performing checks."); + yield assertNodeSelectedAndPanelsUpdated("body", "body"); + } + + function* testDeleteWithNonElementNode() { + info("Selecting a node, deleting it via context menu and checking that " + + "its parent node is selected and breadcrumbs are updated " + + "when the node is followed by a non-element node"); + + yield deleteNodeWithContextMenu("#deleteWithNonElement"); + + let expectedCrumbs = ["html", "body", "div#deleteToMakeSingleTextNode"]; + yield assertNodeSelectedAndCrumbsUpdated(expectedCrumbs, + Node.TEXT_NODE); + + // Delete node with key, as cannot delete text node with + // context menu at this time. + inspector.markup._frame.focus(); + EventUtils.synthesizeKey("VK_DELETE", {}); + yield inspector.once("inspector-updated"); + + expectedCrumbs = ["html", "body", "div#deleteToMakeSingleTextNode"]; + yield assertNodeSelectedAndCrumbsUpdated(expectedCrumbs, + Node.ELEMENT_NODE); + } + + function* deleteNodeWithContextMenu(selector) { + yield selectNode(selector, inspector); + let nodeToBeDeleted = inspector.selection.nodeFront; + + info("Getting the node container in the markup view."); + let container = yield getContainerForSelector(selector, inspector); + + let allMenuItems = openContextMenuAndGetAllItems(inspector, { + target: container.tagLine, + }); + let menuItem = allMenuItems.find(item => item.id === "node-menu-delete"); + + info("Clicking 'Delete Node' in the context menu."); + is(menuItem.disabled, false, "delete menu item is enabled"); + menuItem.click(); + + // close the open context menu + EventUtils.synthesizeKey("VK_ESCAPE", {}); + + info("Waiting for inspector to update."); + yield inspector.once("inspector-updated"); + + // Since the mutations are sent asynchronously from the server, the + // inspector-updated event triggered by the deletion might happen before + // the mutation is received and the element is removed from the + // breadcrumbs. See bug 1284125. + if (inspector.breadcrumbs.indexOf(nodeToBeDeleted) > -1) { + info("Crumbs haven't seen deletion. Waiting for breadcrumbs-updated."); + yield inspector.once("breadcrumbs-updated"); + } + + return menuItem; + } + + function* assertNodeSelectedAndCrumbsUpdated(expectedCrumbs, + expectedNodeType) { + info("Performing checks"); + let actualNodeType = inspector.selection.nodeFront.nodeType; + is(actualNodeType, expectedNodeType, "The node has the right type"); + + let breadcrumbs = inspector.panelDoc.querySelectorAll( + "#inspector-breadcrumbs .html-arrowscrollbox-inner > *"); + is(breadcrumbs.length, expectedCrumbs.length, + "Have the correct number of breadcrumbs"); + for (let i = 0; i < breadcrumbs.length; i++) { + is(breadcrumbs[i].textContent, expectedCrumbs[i], + "Text content for button " + i + " is correct"); + } + } + + function* assertNodeSelectedAndPanelsUpdated(selector, crumbLabel) { + let nodeFront = yield getNodeFront(selector, inspector); + is(inspector.selection.nodeFront, nodeFront, "The right node is selected"); + + let breadcrumbs = inspector.panelDoc.querySelector( + "#inspector-breadcrumbs .html-arrowscrollbox-inner"); + is(breadcrumbs.querySelector("button[checked=true]").textContent, + crumbLabel, + "The right breadcrumb is selected"); + } +}); |