diff options
Diffstat (limited to 'browser/components/customizableui/test/browser_customization_context_menus.js')
| -rw-r--r-- | browser/components/customizableui/test/browser_customization_context_menus.js | 632 |
1 files changed, 632 insertions, 0 deletions
diff --git a/browser/components/customizableui/test/browser_customization_context_menus.js b/browser/components/customizableui/test/browser_customization_context_menus.js new file mode 100644 index 0000000000..56646ded92 --- /dev/null +++ b/browser/components/customizableui/test/browser_customization_context_menus.js @@ -0,0 +1,632 @@ +/* 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"; + +requestLongerTimeout(2); + +const isOSX = Services.appinfo.OS === "Darwin"; + +const overflowButton = document.getElementById("nav-bar-overflow-button"); +const overflowPanel = document.getElementById("widget-overflow"); + +// Right-click on the stop/reload button should +// show a context menu with options to move it. +add_task(async function home_button_context() { + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + let stopReloadButton = document.getElementById("stop-reload-button"); + EventUtils.synthesizeMouse(stopReloadButton, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToPanel", true], + [".customize-context-removeFromToolbar", true], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", true] + ); + checkContextMenu(contextMenu, expectedEntries); + + let hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; +}); + +// Right-click on an empty bit of tabstrip should +// show a context menu without options to move it, +// but with tab-specific options instead. +add_task(async function tabstrip_context() { + // ensure there are tabs to reload/bookmark: + let extraTab = await BrowserTestUtils.openNewForegroundTab( + gBrowser, + "http://example.com/" + ); + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + let tabstrip = document.getElementById("tabbrowser-tabs"); + let rect = tabstrip.getBoundingClientRect(); + EventUtils.synthesizeMouse(tabstrip, rect.width - 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let closedTabsAvailable = SessionStore.getClosedTabCount(window) == 0; + info("Closed tabs: " + closedTabsAvailable); + let expectedEntries = [ + ["#toolbar-context-openANewTab", true], + ["---"], + ["#toolbar-context-reloadSelectedTab", true], + ["#toolbar-context-bookmarkSelectedTab", true], + ["#toolbar-context-selectAllTabs", true], + ["#toolbar-context-undoCloseTab", !closedTabsAvailable], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", true] + ); + checkContextMenu(contextMenu, expectedEntries); + + let hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; + BrowserTestUtils.removeTab(extraTab); +}); + +// Right-click on the title bar spacer before the tabstrip should show a +// context menu without options to move it and no tab-specific options. +add_task(async function titlebar_spacer_context() { + if (!TabsInTitlebar.enabled) { + info("Skipping test that requires tabs in the title bar."); + return; + } + + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + let spacer = document.querySelector( + "#TabsToolbar .titlebar-spacer[type='pre-tabs']" + ); + EventUtils.synthesizeMouseAtCenter(spacer, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToPanel", false], + [".customize-context-removeFromToolbar", false], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", true] + ); + checkContextMenu(contextMenu, expectedEntries); + + let hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; +}); + +// Right-click on an empty bit of extra toolbar should +// show a context menu with moving options disabled, +// and a toggle option for the extra toolbar +add_task(async function empty_toolbar_context() { + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + let toolbar = createToolbarWithPlacements("880164_empty_toolbar", []); + toolbar.setAttribute("context", "toolbar-context-menu"); + toolbar.setAttribute("toolbarname", "Fancy Toolbar for Context Menu"); + EventUtils.synthesizeMouseAtCenter(toolbar, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToPanel", false], + [".customize-context-removeFromToolbar", false], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["#toggle_880164_empty_toolbar", true], + ["---"], + [".viewCustomizeToolbar", true] + ); + checkContextMenu(contextMenu, expectedEntries); + + let hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; + removeCustomToolbars(); +}); + +// Right-click on the urlbar-container should +// show a context menu with disabled options to move it. +add_task(async function urlbar_context() { + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + let urlBarContainer = document.getElementById("urlbar-container"); + // Need to make sure not to click within an edit field. + EventUtils.synthesizeMouse(urlBarContainer, 100, 1, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToPanel", false], + [".customize-context-removeFromToolbar", false], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", true] + ); + checkContextMenu(contextMenu, expectedEntries); + + let hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; +}); + +// Right-click on the searchbar and moving it to the menu +// and back should move the search-container instead. +add_task(async function searchbar_context_move_to_panel_and_back() { + // This is specifically testing the addToPanel function for the search bar, so + // we have to move it to its correct position in the navigation toolbar first. + // The preference will be restored when the customizations are reset later. + Services.prefs.setBoolPref("browser.search.widget.inNavBar", true); + + let searchbar = document.getElementById("searchbar"); + // This fails if the screen resolution is small and the search bar overflows + // from the nav bar. + await gCustomizeMode.addToPanel(searchbar); + let placement = CustomizableUI.getPlacementOfWidget("search-container"); + is( + placement.area, + CustomizableUI.AREA_FIXED_OVERFLOW_PANEL, + "Should be in panel" + ); + + await waitForOverflowButtonShown(); + + let shownPanelPromise = popupShown(overflowPanel); + overflowButton.click(); + await shownPanelPromise; + let hiddenPanelPromise = popupHidden(overflowPanel); + overflowPanel.hidePopup(); + await hiddenPanelPromise; + + gCustomizeMode.addToToolbar(searchbar); + placement = CustomizableUI.getPlacementOfWidget("search-container"); + is(placement.area, CustomizableUI.AREA_NAVBAR, "Should be in navbar"); + await gCustomizeMode.removeFromArea(searchbar); + placement = CustomizableUI.getPlacementOfWidget("search-container"); + is(placement, null, "Should be in palette"); + CustomizableUI.reset(); + placement = CustomizableUI.getPlacementOfWidget("search-container"); + is(placement, null, "Should be in palette"); +}); + +// Right-click on an item within the panel should +// show a context menu with options to move it. +add_task(async function context_within_panel() { + CustomizableUI.addWidgetToArea( + "new-window-button", + CustomizableUI.AREA_FIXED_OVERFLOW_PANEL + ); + + await waitForOverflowButtonShown(); + + let shownPanelPromise = popupShown(overflowPanel); + overflowButton.click(); + await shownPanelPromise; + + let contextMenu = document.getElementById( + "customizationPanelItemContextMenu" + ); + let shownContextPromise = popupShown(contextMenu); + let newWindowButton = document.getElementById("new-window-button"); + ok(newWindowButton, "new-window-button was found"); + EventUtils.synthesizeMouse(newWindowButton, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownContextPromise; + + is(overflowPanel.state, "open", "The overflow panel should still be open."); + + let expectedEntries = [ + [".customize-context-moveToToolbar", true], + [".customize-context-removeFromPanel", true], + ["---"], + [".viewCustomizeToolbar", true], + ]; + checkContextMenu(contextMenu, expectedEntries); + + let hiddenContextPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenContextPromise; + + let hiddenPromise = popupHidden(overflowPanel); + overflowPanel.hidePopup(); + await hiddenPromise; + + CustomizableUI.removeWidgetFromArea("new-window-button"); +}); + +// Right-click on the stop/reload button while in customization mode +// should show a context menu with options to move it. +add_task(async function context_home_button_in_customize_mode() { + await startCustomizing(); + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + let stopReloadButton = document.getElementById("wrapper-stop-reload-button"); + EventUtils.synthesizeMouse(stopReloadButton, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToPanel", true], + [".customize-context-removeFromToolbar", true], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", false] + ); + checkContextMenu(contextMenu, expectedEntries); + + let hiddenContextPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenContextPromise; +}); + +// Right-click on an item in the palette should +// show a context menu with options to move it. +add_task(async function context_click_in_palette() { + let contextMenu = document.getElementById( + "customizationPaletteItemContextMenu" + ); + let shownPromise = popupShown(contextMenu); + let openFileButton = document.getElementById("wrapper-open-file-button"); + EventUtils.synthesizeMouse(openFileButton, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-addToToolbar", true], + [".customize-context-addToPanel", true], + ]; + checkContextMenu(contextMenu, expectedEntries); + + let hiddenContextPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenContextPromise; +}); + +// Right-click on an item in the panel while in customization mode +// should show a context menu with options to move it. +add_task(async function context_click_in_customize_mode() { + CustomizableUI.addWidgetToArea( + "new-window-button", + CustomizableUI.AREA_FIXED_OVERFLOW_PANEL + ); + let contextMenu = document.getElementById( + "customizationPanelItemContextMenu" + ); + let shownPromise = popupShown(contextMenu); + let newWindowButton = document.getElementById("wrapper-new-window-button"); + EventUtils.synthesizeMouse(newWindowButton, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToToolbar", true], + [".customize-context-removeFromPanel", true], + ["---"], + [".viewCustomizeToolbar", false], + ]; + checkContextMenu(contextMenu, expectedEntries); + + let hiddenContextPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenContextPromise; + CustomizableUI.removeWidgetFromArea("new-window-button"); + await endCustomizing(); +}); + +// Test the toolbarbutton panel context menu in customization mode +// without opening the panel before customization mode +add_task(async function context_click_customize_mode_panel_not_opened() { + CustomizableUI.addWidgetToArea( + "new-window-button", + CustomizableUI.AREA_FIXED_OVERFLOW_PANEL + ); + this.otherWin = await openAndLoadWindow(null, true); + + await new Promise(resolve => waitForFocus(resolve, this.otherWin)); + + await startCustomizing(this.otherWin); + + let contextMenu = this.otherWin.document.getElementById( + "customizationPanelItemContextMenu" + ); + let shownPromise = popupShown(contextMenu); + let newWindowButton = this.otherWin.document.getElementById( + "wrapper-new-window-button" + ); + EventUtils.synthesizeMouse( + newWindowButton, + 2, + 2, + { type: "contextmenu", button: 2 }, + this.otherWin + ); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToToolbar", true], + [".customize-context-removeFromPanel", true], + ["---"], + [".viewCustomizeToolbar", false], + ]; + checkContextMenu(contextMenu, expectedEntries, this.otherWin); + + let hiddenContextPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenContextPromise; + await endCustomizing(this.otherWin); + CustomizableUI.removeWidgetFromArea("new-window-button"); + await promiseWindowClosed(this.otherWin); + this.otherWin = null; + + await new Promise(resolve => waitForFocus(resolve, window)); +}); + +// Bug 945191 - Combined buttons show wrong context menu options +// when they are in the toolbar. +add_task(async function context_combined_buttons_toolbar() { + CustomizableUI.addWidgetToArea( + "zoom-controls", + CustomizableUI.AREA_FIXED_OVERFLOW_PANEL + ); + await startCustomizing(); + let contextMenu = document.getElementById( + "customizationPanelItemContextMenu" + ); + let shownPromise = popupShown(contextMenu); + let zoomControls = document.getElementById("wrapper-zoom-controls"); + EventUtils.synthesizeMouse(zoomControls, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + // Execute the command to move the item from the panel to the toolbar. + let moveToToolbar = contextMenu.querySelector( + ".customize-context-moveToToolbar" + ); + moveToToolbar.doCommand(); + let hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; + await endCustomizing(); + + zoomControls = document.getElementById("zoom-controls"); + is( + zoomControls.parentNode.id, + "nav-bar-customization-target", + "Zoom-controls should be on the nav-bar" + ); + + contextMenu = document.getElementById("toolbar-context-menu"); + shownPromise = popupShown(contextMenu); + EventUtils.synthesizeMouse(zoomControls, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + [".customize-context-moveToPanel", true], + [".customize-context-removeFromToolbar", true], + ["---"], + ]; + if (!isOSX) { + expectedEntries.push(["#toggle_toolbar-menubar", true]); + } + expectedEntries.push( + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", true] + ); + checkContextMenu(contextMenu, expectedEntries); + + hiddenPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenPromise; + await resetCustomization(); +}); + +// Bug 947586 - After customization, panel items show wrong context menu options +add_task(async function context_after_customization_panel() { + info("Check panel context menu is correct after customization"); + await startCustomizing(); + await endCustomizing(); + + CustomizableUI.addWidgetToArea( + "new-window-button", + CustomizableUI.AREA_FIXED_OVERFLOW_PANEL + ); + let shownPanelPromise = popupShown(overflowPanel); + overflowButton.click(); + await shownPanelPromise; + + let contextMenu = document.getElementById( + "customizationPanelItemContextMenu" + ); + let shownContextPromise = popupShown(contextMenu); + let newWindowButton = document.getElementById("new-window-button"); + ok(newWindowButton, "new-window-button was found"); + EventUtils.synthesizeMouse(newWindowButton, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownContextPromise; + + is(overflowPanel.state, "open", "The panel should still be open."); + + let expectedEntries = [ + [".customize-context-moveToToolbar", true], + [".customize-context-removeFromPanel", true], + ["---"], + [".viewCustomizeToolbar", true], + ]; + checkContextMenu(contextMenu, expectedEntries); + + let hiddenContextPromise = popupHidden(contextMenu); + contextMenu.hidePopup(); + await hiddenContextPromise; + + let hiddenPromise = popupHidden(overflowPanel); + overflowPanel.hidePopup(); + await hiddenPromise; + CustomizableUI.removeWidgetFromArea("new-window-button"); +}); + +// Bug 982027 - moving icon around removes custom context menu. +add_task(async function custom_context_menus() { + let widgetId = "custom-context-menu-toolbarbutton"; + let expectedContext = "myfancycontext"; + let widget = createDummyXULButton(widgetId, "Test ctxt menu"); + widget.setAttribute("context", expectedContext); + CustomizableUI.addWidgetToArea(widgetId, CustomizableUI.AREA_NAVBAR); + is( + widget.getAttribute("context"), + expectedContext, + "Should have context menu when added to the toolbar." + ); + + await startCustomizing(); + is( + widget.getAttribute("context"), + "", + "Should not have own context menu in the toolbar now that we're customizing." + ); + is( + widget.getAttribute("wrapped-context"), + expectedContext, + "Should keep own context menu wrapped when in toolbar." + ); + + let panel = document.getElementById("widget-overflow-fixed-list"); + simulateItemDrag(widget, panel); + is( + widget.getAttribute("context"), + "", + "Should not have own context menu when in the panel." + ); + is( + widget.getAttribute("wrapped-context"), + expectedContext, + "Should keep own context menu wrapped now that we're in the panel." + ); + + simulateItemDrag( + widget, + CustomizableUI.getCustomizationTarget(document.getElementById("nav-bar")) + ); + is( + widget.getAttribute("context"), + "", + "Should not have own context menu when back in toolbar because we're still customizing." + ); + is( + widget.getAttribute("wrapped-context"), + expectedContext, + "Should keep own context menu wrapped now that we're back in the toolbar." + ); + + await endCustomizing(); + is( + widget.getAttribute("context"), + expectedContext, + "Should have context menu again now that we're out of customize mode." + ); + CustomizableUI.removeWidgetFromArea(widgetId); + widget.remove(); + ok( + CustomizableUI.inDefaultState, + "Should be in default state after removing button." + ); +}); + +// Bug 1690575 - 'pin to overflow menu' and 'remove from toolbar' should be hidden +// for flexible spaces +add_task(async function flexible_space_context_menu() { + CustomizableUI.addWidgetToArea("spring", "nav-bar"); + let springs = document.querySelectorAll("#nav-bar toolbarspring"); + let lastSpring = springs[springs.length - 1]; + ok(lastSpring, "we added a spring"); + let contextMenu = document.getElementById("toolbar-context-menu"); + let shownPromise = popupShown(contextMenu); + EventUtils.synthesizeMouse(lastSpring, 2, 2, { + type: "contextmenu", + button: 2, + }); + await shownPromise; + + let expectedEntries = [ + ["#toggle_PersonalToolbar", true], + ["---"], + [".viewCustomizeToolbar", true], + ]; + + if (!isOSX) { + expectedEntries.unshift(["#toggle_toolbar-menubar", true]); + } + + checkContextMenu(contextMenu, expectedEntries); + contextMenu.hidePopup(); + gCustomizeMode.removeFromArea(lastSpring); + ok(!lastSpring.parentNode, "Spring should have been removed successfully."); +}); |