Bug 1422934 - Make the tab close button an image, and remove the extends from its binding. r=Gijs
MozReview-Commit-ID: HF0Rqeq8fh8
--- a/accessible/tests/mochitest/tree/test_tabbrowser.xul
+++ b/accessible/tests/mochitest/tree/test_tabbrowser.xul
@@ -110,37 +110,27 @@
{
// xul:tab ("about:license")
role: ROLE_PAGETAB,
children: [
{
// xul:text, i.e. the tab label text
role: ROLE_TEXT_LEAF,
children: []
- },
- {
- // xul:toolbarbutton ("Close Tab")
- role: ROLE_PUSHBUTTON,
- children: []
}
]
},
{
// tab ("about:mozilla")
role: ROLE_PAGETAB,
children: [
{
// xul:text, i.e. the tab label text
role: ROLE_TEXT_LEAF,
children: []
- },
- {
- // xul:toolbarbutton ("Close Tab")
- role: ROLE_PUSHBUTTON,
- children: []
}
]
},
{
// xul:toolbarbutton ("Open a new tab")
role: ROLE_PUSHBUTTON,
children: newTabChildren
}
--- a/browser/base/content/tabbrowser.xml
+++ b/browser/base/content/tabbrowser.xml
@@ -7733,18 +7733,17 @@
</handlers>
</binding>
<!-- close-tab-button binding
This binding relies on the structure of the tabbrowser binding.
Therefore it should only be used as a child of the tab or the tabs
element (in both cases, when they are anonymous nodes of <tabbrowser>).
-->
- <binding id="tabbrowser-close-tab-button"
- extends="chrome://global/content/bindings/toolbarbutton.xml#toolbarbutton-image">
+ <binding id="tabbrowser-close-tab-button">
<handlers>
<handler event="click" button="0"><![CDATA[
var bindingParent = document.getBindingParent(this);
var tabContainer = bindingParent.parentNode;
tabContainer.tabbrowser.removeTab(bindingParent, {animate: true,
byMouse: event.mozInputSource == MouseEvent.MOZ_SOURCE_MOUSE});
// This enables double-click protection for the tab container
// (see tabbrowser-tabs 'click' handler).
@@ -7811,19 +7810,20 @@
<xul:label class="tab-text tab-label"
xbl:inherits="xbl:text=label,accesskey,fadein,pinned,selected=visuallyselected,attention"
role="presentation"/>
</xul:hbox>
<xul:image xbl:inherits="soundplaying,soundplaying-scheduledremoval,pinned,muted,blocked,selected=visuallyselected,activemedia-blocked"
anonid="soundplaying-icon"
class="tab-icon-sound"
role="presentation"/>
- <xul:toolbarbutton anonid="close-button"
- xbl:inherits="fadein,pinned,selected=visuallyselected"
- class="tab-close-button close-icon"/>
+ <xul:image anonid="close-button"
+ xbl:inherits="fadein,pinned,selected=visuallyselected"
+ class="tab-close-button close-icon"
+ role="presentation"/>
</xul:hbox>
</xul:stack>
</content>
<implementation>
<constructor><![CDATA[
if (!("_lastAccessed" in this)) {
this.updateLastAccessed();
--- a/browser/themes/osx/browser.css
+++ b/browser/themes/osx/browser.css
@@ -841,30 +841,16 @@ html|span.ac-emphasize-text-url {
@media (min-resolution: 2dppx) {
.tab-drop-indicator {
list-style-image: url(chrome://browser/skin/tabbrowser/tabDragIndicator@2x.png);
width: 12px;
}
}
-/**
- * In-tab close button
- */
-
-.tab-close-button > .toolbarbutton-icon {
- margin-inline-end: 0px !important;
-}
-
-.tab-close-button {
- border: none !important;
- background: none;
- cursor: default;
-}
-
/* Bookmarks toolbar */
#PlacesToolbarDropIndicator {
list-style-image: url(chrome://browser/skin/places/toolbarDropMarker.png);
}
/* Bookmark drag and drop styles */
.bookmark-item[dragover-into="true"] {
--- a/browser/themes/shared/tabs.inc.css
+++ b/browser/themes/shared/tabs.inc.css
@@ -355,17 +355,16 @@ tabbrowser {
.tab-label {
margin-inline-end: 0;
margin-inline-start: 0;
}
.tab-close-button {
margin-inline-end: -2px;
- padding: 0;
-moz-context-properties: fill, fill-opacity, stroke-opacity;
stroke-opacity: var(--toolbarbutton-icon-fill-opacity);
}
:root[uidensity=touch] .tab-close-button {
margin-inline-end: -@horizontalTabPadding@;
padding: 10px calc(@horizontalTabPadding@ - 2px);
}
--- a/browser/themes/windows/browser.css
+++ b/browser/themes/windows/browser.css
@@ -784,22 +784,16 @@ html|span.ac-emphasize-text-url {
/* Tab DnD indicator */
.tab-drop-indicator {
list-style-image: url(chrome://browser/skin/tabbrowser/tabDragIndicator.png);
margin-bottom: -9px;
z-index: 3;
}
-/* Tab close button */
-.tab-close-button {
- -moz-appearance: none;
- border: none;
-}
-
/* All tabs menupopup */
.alltabs-item[selected="true"] {
font-weight: bold;
}
/* Bookmarks toolbar */
#PlacesToolbarDropIndicator {
--- a/testing/firefox-ui/tests/puppeteer/test_tabbar.py
+++ b/testing/firefox-ui/tests/puppeteer/test_tabbar.py
@@ -123,17 +123,17 @@ class TestTab(PuppeteerMixin, Marionette
super(TestTab, self).tearDown()
def test_basic(self):
tab = self.browser.tabbar.tabs[0]
self.assertEqual(tab.window, self.browser)
self.assertEqual(tab.tab_element.get_property('localName'), 'tab')
- self.assertEqual(tab.close_button.get_property('localName'), 'toolbarbutton')
+ self.assertEqual(tab.close_button.get_property('localName'), 'image')
def test_certificate(self):
url = self.marionette.absolute_url('layout/mozilla.html')
with self.marionette.using_context(self.marionette.CONTEXT_CONTENT):
self.marionette.navigate(url)
with self.assertRaises(NoCertificateError):
self.browser.tabbar.tabs[0].certificate