Bug 1418757 - new tab button isn't adjacent to the last tab when customizing in customize mode, r?jaws
MozReview-Commit-ID: bQoNfDD2sX
--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -5855,20 +5855,33 @@
break;
}
}
]]></body>
</method>
<method name="_updateNewTabVisibility">
<body><![CDATA[
+ let isCustomizing = this.tabContainer.parentNode.getAttribute("customizing") == "true";
+
+ // Confusingly, the <tabs> are never wrapped in <toolbarpaletteitem>s in customize mode,
+ // but the other items will be.
let sib = this.tabContainer.nextElementSibling;
+ if (isCustomizing) {
+ sib = sib && sib.firstElementChild;
+ }
while (sib && sib.hidden) {
- sib = sib.nextElementSibling;
- }
+ if (isCustomizing) {
+ sib = sib.parentNode.nextElementSibling;
+ sib = sib && sib.firstElementChild;
+ } else {
+ sib = sib.nextElementSibling;
+ }
+ }
+
const kAttr = "hasadjacentnewtabbutton";
if (sib && sib.id == "new-tab-button") {
this.tabContainer.setAttribute(kAttr, "true");
} else {
this.tabContainer.removeAttribute(kAttr);
}
]]></body>
</method>
--- a/browser/components/customizableui/test/browser.ini
+++ b/browser/components/customizableui/test/browser.ini
@@ -155,12 +155,13 @@ tags = fullscreen
[browser_remove_customized_specials.js]
[browser_switch_to_customize_mode.js]
[browser_synced_tabs_menu.js]
[browser_backfwd_enabled_post_customize.js]
[browser_check_tooltips_in_navbar.js]
[browser_editcontrols_update.js]
subsuite = clipboard
[browser_customization_context_menus.js]
+[browser_newtab_button_customizemode.js]
[browser_open_from_popup.js]
[browser_sidebar_toggle.js]
[browser_remote_tabs_button.js]
[browser_widget_animation.js]
new file mode 100644
--- /dev/null
+++ b/browser/components/customizableui/test/browser_newtab_button_customizemode.js
@@ -0,0 +1,106 @@
+/* Any copyright is dedicated to the Public Domain.
+ * http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * Tests in this file check that user customizations to the tabstrip show
+ * the correct type of new tab button while the tabstrip isn't overflowing.
+ */
+
+const kGlobalNewTabButton = document.getElementById("new-tab-button");
+const kInnerNewTabButton = document.getAnonymousElementByAttribute(gBrowser.tabContainer, "anonid", "tabs-newtab-button");
+
+function assertNewTabButton(which) {
+ if (which == "global") {
+ isnot(kGlobalNewTabButton.getBoundingClientRect().width, 0,
+ "main new tab button should be visible");
+ is(kInnerNewTabButton.getBoundingClientRect().width, 0,
+ "inner new tab button should be hidden");
+ } else if (which == "inner") {
+ is(kGlobalNewTabButton.getBoundingClientRect().width, 0,
+ "main new tab button should be hidden");
+ isnot(kInnerNewTabButton.getBoundingClientRect().width, 0,
+ "inner new tab button should be visible");
+ } else {
+ ok(false, "Unexpected button: " + which);
+ }
+}
+
+/**
+ * Add and remove items *after* the new tab button in customize mode.
+ */
+add_task(async function addremove_after_newtab_customizemode() {
+ await startCustomizing();
+ simulateItemDrag(document.getElementById("home-button"),
+ kGlobalNewTabButton.parentNode.nextElementSibling);
+ ok(gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should have the adjacent newtab attribute");
+ await endCustomizing();
+ assertNewTabButton("inner");
+
+ await startCustomizing();
+ simulateItemDrag(document.getElementById("home-button"),
+ document.getElementById("stop-reload-button").parentNode.nextElementSibling);
+ ok(gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should still have the adjacent newtab attribute");
+ await endCustomizing();
+ assertNewTabButton("inner");
+ ok(CustomizableUI.inDefaultState, "Should be in default state");
+});
+
+/**
+ * Add and remove items *before* the new tab button in customize mode.
+ */
+add_task(async function addremove_before_newtab_customizemode() {
+ await startCustomizing();
+ simulateItemDrag(document.getElementById("home-button"), kGlobalNewTabButton);
+ ok(!gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should no longer have the adjacent newtab attribute");
+ await endCustomizing();
+ assertNewTabButton("global");
+ await startCustomizing();
+ simulateItemDrag(document.getElementById("home-button"),
+ document.getElementById("stop-reload-button").parentNode.nextElementSibling);
+ ok(gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should have the adjacent newtab attribute again");
+ await endCustomizing();
+ assertNewTabButton("inner");
+ ok(CustomizableUI.inDefaultState, "Should be in default state");
+});
+
+/**
+ * Add and remove items *after* the new tab button outside of customize mode.
+ */
+add_task(async function addremove_after_newtab_api() {
+ CustomizableUI.addWidgetToArea("home-button", "TabsToolbar");
+ ok(gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should have the adjacent newtab attribute");
+ assertNewTabButton("inner");
+
+ CustomizableUI.reset();
+ ok(gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should still have the adjacent newtab attribute");
+ assertNewTabButton("inner");
+ ok(CustomizableUI.inDefaultState, "Should be in default state");
+
+});
+
+/**
+ * Add and remove items *before* the new tab button outside of customize mode.
+ */
+add_task(async function addremove_before_newtab_api() {
+ let index = CustomizableUI.getWidgetIdsInArea("TabsToolbar").indexOf("new-tab-button");
+ CustomizableUI.addWidgetToArea("home-button", "TabsToolbar", index);
+ ok(!gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should no longer have the adjacent newtab attribute");
+ assertNewTabButton("global");
+
+ CustomizableUI.removeWidgetFromArea("home-button");
+ ok(gBrowser.tabContainer.hasAttribute("hasadjacentnewtabbutton"),
+ "tabs should have the adjacent newtab attribute again");
+ assertNewTabButton("inner");
+
+ CustomizableUI.reset();
+ ok(CustomizableUI.inDefaultState, "Should be in default state");
+});