From b4931271811b43aa985fe5c496f2c60eb31dc05c Mon Sep 17 00:00:00 2001
From: Magnus Melin <mkmelin+mozilla@iki.fi>
Date: Thu, 23 May 2019 22:13:45 +0200
Subject: [PATCH] Bug 1547233 - [de-xbl] convert toolbar.xml#menu-button
 binding to custom element. r=khushil

---
 calendar/base/content/calendar-task-view.xul  |  2 +-
 .../dialogs/calendar-summary-dialog.xul       | 13 ++--
 .../lightning/content/imip-bar-overlay.xul    | 12 ++--
 .../lightning/content/lightning-toolbar.xul   | 30 ++-------
 mail/base/content/bindings.css                |  4 --
 mail/base/content/customElements.js           |  1 +
 mail/base/content/mainMailToolbox.inc.xul     | 20 +++---
 mail/base/content/msgAttachmentView.inc.xul   |  6 +-
 mail/base/content/msgHdrView.inc.xul          | 14 ++--
 .../base/content/toolbarbutton-menu-button.js | 67 +++++++++++++++++++
 mail/base/jar.mn                              |  1 +
 .../compose/content/messengercompose.xul      | 44 ++++++------
 12 files changed, 133 insertions(+), 81 deletions(-)
 create mode 100644 mail/base/content/toolbarbutton-menu-button.js

diff --git a/calendar/base/content/calendar-task-view.xul b/calendar/base/content/calendar-task-view.xul
index 10f4d660a3..55baa03c19 100644
--- a/calendar/base/content/calendar-task-view.xul
+++ b/calendar/base/content/calendar-task-view.xul
@@ -121,7 +121,7 @@
                                 <menuseparator />
                               </menupopup>
                           </toolbarbutton>
-                          <toolbarbutton id="task-actions-markcompleted"
+                          <toolbarbutton is="toolbarbutton-menu-button" id="task-actions-markcompleted"
                                          type="menu-button"
                                          label="&calendar.context.markcompleted.label;"
                                          tooltiptext="&calendar.task.complete.button.tooltip;"
diff --git a/calendar/base/content/dialogs/calendar-summary-dialog.xul b/calendar/base/content/dialogs/calendar-summary-dialog.xul
index 7fde51288b..60b358af58 100644
--- a/calendar/base/content/dialogs/calendar-summary-dialog.xul
+++ b/calendar/base/content/dialogs/calendar-summary-dialog.xul
@@ -43,6 +43,7 @@
   <script src="chrome://calendar/content/calendar-item-editing.js"/>
   <script src="chrome://calendar/content/calApplicationUtils.js"/>
   <script src="chrome://calendar/content/calendar-item-bindings.js"/>
+  <script src="chrome://messenger/content/customElements.js"/>
 
   <toolbox id="summary-toolbox"
            class="mail-toolbox"
@@ -63,12 +64,12 @@
                      label="&summary.dialog.saveclose.label;"
                      oncommand="saveAndClose();"
                      class="cal-event-toolbarbutton toolbarbutton-1 saveandcloseButton"/>
-      <toolbarbutton id="acceptButton"
+      <toolbarbutton is="toolbarbutton-menu-button" id="acceptButton"
+                     type="menu-button"
                      tooltiptext="&summary.dialog.accept.tooltiptext;"
                      label="&summary.dialog.accept.label;"
                      oncommand="if (event.target.id == this.id) { reply('AUTO', 'ACCEPTED'); }"
                      value="ACCEPTED"
-                     type="menu-button"
                      class="cal-event-toolbarbutton toolbarbutton-1 replyButton">
         <menupopup id="acceptDropdown">
           <menuitem id="acceptButton_Send"
@@ -81,12 +82,12 @@
                     oncommand="reply('NONE', 'ACCEPTED');"/>
         </menupopup>
       </toolbarbutton>
-      <toolbarbutton id="tentativeButton"
+      <toolbarbutton is="toolbarbutton-menu-button" id="tentativeButton"
+                     type="menu-button"
                      tooltiptext="&summary.dialog.tentative.tooltiptext;"
                      label="&summary.dialog.tentative.label;"
                      oncommand="if (event.target.id == this.id) { reply('AUTO', 'TENTATIVE'); }"
                      value="TENTATIVE"
-                     type="menu-button"
                      class="cal-event-toolbarbutton toolbarbutton-1 replyButton">
         <menupopup id="tentativeDropdown">
           <menuitem id="tenatativeButton_Send"
@@ -99,11 +100,11 @@
                     oncommand="reply('NONE', 'TENTATIVE');"/>
         </menupopup>
       </toolbarbutton>
-      <toolbarbutton id="declineButton"
+      <toolbarbutton is="toolbarbutton-menu-button" id="declineButton"
+                     type="menu-button"
                      tooltiptext="&summary.dialog.decline.tooltiptext;"
                      label="&summary.dialog.decline.label;"
                      oncommand="if (event.target.id == this.id) { reply('AUTO', 'DECLINED'); }"
-                     type="menu-button"
                      value="DECLINED"
                      class="cal-event-toolbarbutton toolbarbutton-1 replyButton">
         <menupopup id="declineDropdown">
diff --git a/calendar/lightning/content/imip-bar-overlay.xul b/calendar/lightning/content/imip-bar-overlay.xul
index c15601426d..1d3d9ae499 100644
--- a/calendar/lightning/content/imip-bar-overlay.xul
+++ b/calendar/lightning/content/imip-bar-overlay.xul
@@ -121,7 +121,7 @@
                              hidden="true"/>
 
               <!-- accept -->
-              <toolbarbutton id="imipAcceptButton"
+              <toolbarbutton is="toolbarbutton-menu-button" id="imipAcceptButton"
                              tooltiptext="&lightning.imipbar.btnAccept2.tooltiptext;"
                              label="&lightning.imipbar.btnAccept.label;"
                              oncommand="if (event.target.id == this.id) { ltnImipBar.executeAction('ACCEPTED', 'AUTO'); }"
@@ -159,7 +159,7 @@
               </toolbarbutton>
 
               <!-- accept recurrences -->
-              <toolbarbutton id="imipAcceptRecurrencesButton"
+              <toolbarbutton is="toolbarbutton-menu-button" id="imipAcceptRecurrencesButton"
                              tooltiptext="&lightning.imipbar.btnAcceptRecurrences2.tooltiptext;"
                              label="&lightning.imipbar.btnAcceptRecurrences.label;"
                              oncommand="if (event.target.id == this.id) { ltnImipBar.executeAction('ACCEPTED', 'AUTO'); }"
@@ -198,7 +198,7 @@
 
               <!-- tentative; should only be used, if no imipMoreButton is used and
                  - imipDeclineButton/imipAcceptButton have no visible menuitems //-->
-              <toolbarbutton id="imipTentativeButton"
+              <toolbarbutton is="toolbarbutton-menu-button" id="imipTentativeButton"
                              label="&lightning.imipbar.btnTentative.label;"
                              tooltiptext="&lightning.imipbar.btnTentative2.tooltiptext;"
                              class="toolbarbutton-1 msgHeaderView-button imipTentativeButton"
@@ -220,7 +220,7 @@
 
               <!-- tentative recurrences; should only be used, if no imipMoreButton is used and
                  - imipDeclineRecurrencesButton/imipAcceptRecurrencesButton have no visible menuitems //-->
-              <toolbarbutton id="imipTentativeRecurrencesButton"
+              <toolbarbutton is="toolbarbutton-menu-button" id="imipTentativeRecurrencesButton"
                              label="&lightning.imipbar.btnTentativeRecurrences.label;"
                              tooltiptext="&lightning.imipbar.btnTentativeRecurrences2.tooltiptext;"
                              class="toolbarbutton-1 msgHeaderView-button imipTentativeRecurrencesButton"
@@ -241,7 +241,7 @@
               </toolbarbutton>
 
               <!-- decline -->
-              <toolbarbutton id="imipDeclineButton"
+              <toolbarbutton is="toolbarbutton-menu-button" id="imipDeclineButton"
                              tooltiptext="&lightning.imipbar.btnDecline2.tooltiptext;"
                              label="&lightning.imipbar.btnDecline.label;"
                              oncommand="if (event.target.id == this.id) { ltnImipBar.executeAction('DECLINED', 'AUTO'); }"
@@ -262,7 +262,7 @@
               </toolbarbutton>
 
               <!-- decline recurrences -->
-              <toolbarbutton id="imipDeclineRecurrencesButton"
+              <toolbarbutton is="toolbarbutton-menu-button" id="imipDeclineRecurrencesButton"
                              tooltiptext="&lightning.imipbar.btnDeclineRecurrences2.tooltiptext;"
                              label="&lightning.imipbar.btnDeclineRecurrences.label;"
                              oncommand="if (event.target.id == this.id) { ltnImipBar.executeAction('DECLINED'); }"
diff --git a/calendar/lightning/content/lightning-toolbar.xul b/calendar/lightning/content/lightning-toolbar.xul
index 35d3b61263..2eb47fa308 100644
--- a/calendar/lightning/content/lightning-toolbar.xul
+++ b/calendar/lightning/content/lightning-toolbar.xul
@@ -35,28 +35,6 @@
     </menupopup>
   </popupset>
 
-  <!-- The popup id here must match the popup id in the SeaMonkey
-       New Message button. See Bug 506461 -->
-  <toolbarbutton id="button-newmsg"
-                 type="menu-button">
-    <menupopup id="button-newMsgPopup">
-      <menuitem id="newMsgButton-mail-menuitem"
-                label="&newMessageCmd.label;"
-                class="menuitem-iconic"
-                oncommand="event.stopPropagation(); MsgNewMessage(event)"/>
-      <menuitem id="newMsgButton-calendar-menuitem"
-                label="&lightning.toolbar.newevent.label;"
-                class="menuitem-iconic"
-                command="calendar_new_event_command"
-                observes="calendar_new_event_command"/>
-      <menuitem id="newMsgButton-task-menuitem"
-                label="&lightning.toolbar.newtask.label;"
-                class="menuitem-iconic"
-                command="calendar_new_todo_command"
-                observes="calendar_new_todo_command"/>
-    </menupopup>
-  </toolbarbutton>
-
   <toolbarpalette id="MailToolbarPalette">
     <toolbarbutton id="lightning-button-calendar"
                    class="toolbarbutton-1"
@@ -68,9 +46,9 @@
                    label="&lightning.toolbar.task.label;"
                    tooltiptext="&lightning.toolbar.task.tooltip;"
                    command="new_task_tab"/>
-    <toolbarbutton id="extractEventButton"
-                   class="toolbarbutton-1"
+    <toolbarbutton is="toolbarbutton-menu-button" id="extractEventButton"
                    type="menu-button"
+                   class="toolbarbutton-1"
                    label="&calendar.extract.event.button;"
                    tooltiptext="&calendar.extract.event.button.tooltip;"
                    oncommand="calendarExtract.extractFromEmail(true);">
@@ -78,9 +56,9 @@
                  oncommand="calendarExtract.extractWithLocale(event, true);"
                  onpopupshowing="calendarExtract.onShowLocaleMenu(event.target);"/>
     </toolbarbutton>
-    <toolbarbutton id="extractTaskButton"
-                   class="toolbarbutton-1"
+    <toolbarbutton is="toolbarbutton-menu-button" id="extractTaskButton"
                    type="menu-button"
+                   class="toolbarbutton-1"
                    label="&calendar.extract.task.button;"
                    tooltiptext="&calendar.extract.task.button.tooltip;"
                    oncommand="calendarExtract.extractFromEmail(false);">
diff --git a/mail/base/content/bindings.css b/mail/base/content/bindings.css
index e8c5559432..2064aa1b51 100644
--- a/mail/base/content/bindings.css
+++ b/mail/base/content/bindings.css
@@ -20,10 +20,6 @@ toolbar[type="menubar"][autohide="true"] {
 }
 %endif
 
-toolbarbutton[type="menu-button"] {
-  -moz-binding: url("chrome://messenger/content/toolbar.xml#menu-button");
-}
-
 toolbarpaletteitem {
   -moz-binding: url("chrome://messenger/content/toolbar.xml#toolbarpaletteitem");
 }
diff --git a/mail/base/content/customElements.js b/mail/base/content/customElements.js
index 3e20e6be68..c65450c296 100644
--- a/mail/base/content/customElements.js
+++ b/mail/base/content/customElements.js
@@ -18,6 +18,7 @@ if (!isDummyDocument) {
     "chrome://messenger/content/statuspanel.js",
     "chrome://messenger/content/foldersummary.js",
     "chrome://messenger/content/addressbook/menulist-addrbooks.js",
+    "chrome://messenger/content/toolbarbutton-menu-button.js",
   ]) {
     Services.scriptloader.loadSubScript(script, window);
   }
diff --git a/mail/base/content/mainMailToolbox.inc.xul b/mail/base/content/mainMailToolbox.inc.xul
index c78d713672..ea60e752cd 100644
--- a/mail/base/content/mainMailToolbox.inc.xul
+++ b/mail/base/content/mainMailToolbox.inc.xul
@@ -14,7 +14,7 @@
          defaultlabelalign="end">
 
   <toolbarpalette id="MailToolbarPalette">
-    <toolbarbutton id="button-getmsg"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-getmsg"
                    type="menu-button"
                    class="toolbarbutton-1"
                    label="&getMsgButton1.label;"
@@ -57,7 +57,7 @@
                    tooltiptext="&replyListButton.tooltip;"
                    observes="button_replylist"
                    command="cmd_replylist"/>
-    <toolbarbutton id="button-forward"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-forward"
                    type="menu-button"
                    class="toolbarbutton-1"
                    label="&forwardButton.label;"
@@ -102,9 +102,9 @@
                    tooltiptext="&openConversationButton.tooltip;"
                    observes="button_showconversation"
                    oncommand="gConversationOpener.openConversationForMessages(gFolderDisplay.selectedMessages)"/>
-    <toolbarbutton id="button-goback"
-                   class="toolbarbutton-1"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-goback"
                    type="menu-button"
+                   class="toolbarbutton-1"
                    label="&backButton1.label;"
                    oncommand="goDoCommand('cmd_goBack')"
                    tooltiptext="&goBackButton.tooltip;"
@@ -114,9 +114,9 @@
         <menuseparator id="button-goBackSeparator"/>
       </menupopup>
     </toolbarbutton>
-    <toolbarbutton id="button-goforward"
-                   class="toolbarbutton-1"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-goforward"
                    type="menu-button"
+                   class="toolbarbutton-1"
                    label="&goForwardButton1.label;"
                    oncommand="goDoCommand('cmd_goForward')"
                    tooltiptext="&goForwardButton.tooltip;"
@@ -202,13 +202,13 @@
                    oncommand="goDoCommand('cmd_print')"
                    tooltiptext="&printButton.tooltip;"/>
 #else
-    <toolbarbutton id="button-print"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-print"
+                   type="menu-button"
                    class="toolbarbutton-1"
                    label="&printButton.label;"
                    observes="button_print"
                    oncommand="goDoCommand('cmd_print')"
-                   tooltiptext="&printButton.tooltip;"
-                   type="menu-button">
+                   tooltiptext="&printButton.tooltip;">
       <menupopup id="printMenu" onpopupshowing="goUpdateCommand('cmd_printpreview');">
         <menuitem id="button-printMenu"
                   label="&printCmd.label;"
@@ -222,7 +222,7 @@
       </menupopup>
     </toolbarbutton>
 #endif
-    <toolbarbutton id="button-mark"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-mark"
                    type="menu-button"
                    class="toolbarbutton-1"
                    label="&markButton.label;"
diff --git a/mail/base/content/msgAttachmentView.inc.xul b/mail/base/content/msgAttachmentView.inc.xul
index 94dbd9c112..e4a6838a14 100644
--- a/mail/base/content/msgAttachmentView.inc.xul
+++ b/mail/base/content/msgAttachmentView.inc.xul
@@ -32,7 +32,8 @@
                                   context="attachment-toolbar-context-menu">
                               <toolbaritem id="attachmentSaveAll"
                                            title="&saveAllAttachmentsButton1.label;">
-                                <toolbarbutton type="menu-button" id="attachmentSaveAllSingle"
+                                <toolbarbutton is="toolbarbutton-menu-button" id="attachmentSaveAllSingle"
+                                               type="menu-button"
                                                class="toolbarbutton-1 msgHeaderView-button"
                                                label="&saveAttachmentButton1.label;"
                                                tooltiptext="&saveAttachmentButton1.tooltip;"
@@ -60,7 +61,8 @@
                                               accesskey="&deleteAttachmentCmd.accesskey;"/>
                                   </menupopup>
                                 </toolbarbutton>
-                                <toolbarbutton type="menu-button" id="attachmentSaveAllMultiple"
+                                <toolbarbutton is="toolbarbutton-menu-button" id="attachmentSaveAllMultiple"
+                                               type="menu-button"
                                                class="toolbarbutton-1 msgHeaderView-button"
                                                label="&saveAllAttachmentsButton1.label;"
                                                tooltiptext="&saveAllAttachmentsButton1.tooltip;"
diff --git a/mail/base/content/msgHdrView.inc.xul b/mail/base/content/msgHdrView.inc.xul
index 459fa5c943..2fa1fa2d68 100644
--- a/mail/base/content/msgHdrView.inc.xul
+++ b/mail/base/content/msgHdrView.inc.xul
@@ -44,13 +44,13 @@
                                                      oncommand="MsgReplySender(event); RestoreFocusAfterHdrButton();"
                                                      observes="button_reply"
                                                      class="toolbarbutton-1 msgHeaderView-button hdrReplyButton"/>
-                                      <toolbarbutton id="hdrReplyAllButton"
+                                      <toolbarbutton is="toolbarbutton-menu-button" id="hdrReplyAllButton"
+                                                     type="menu-button"
                                                      label="&hdrReplyAllButton1.label;"
                                                      tooltiptext="&hdrReplyAllButton1.tooltip;"
                                                      oncommand="MsgReplyToAllMessage(event); RestoreFocusAfterHdrButton();"
                                                      observes="button_replyall"
                                                      class="toolbarbutton-1 msgHeaderView-button hdrReplyButton hdrReplyAllButton"
-                                                     type="menu-button"
                                                      hidden="true">
                                         <menupopup id="hdrReplyAllDropdown">
                                           <menuitem id="hdrReplyAll_ReplyAllSubButton"
@@ -66,13 +66,13 @@
                                                                RestoreFocusAfterHdrButton();"/>
                                         </menupopup>
                                       </toolbarbutton>
-                                      <toolbarbutton id="hdrReplyListButton"
+                                      <toolbarbutton is="toolbarbutton-menu-button" id="hdrReplyListButton"
+                                                     type="menu-button"
                                                      label="&hdrReplyListButton1.label;"
                                                      tooltiptext="&hdrReplyListButton1.tooltip;"
                                                      oncommand="MsgReplyToListMessage(event); RestoreFocusAfterHdrButton();"
                                                      observes="button_replylist"
                                                      class="toolbarbutton-1 msgHeaderView-button hdrReplyButton hdrReplyListButton"
-                                                     type="menu-button"
                                                      hidden="true">
                                         <menupopup id="hdrReplyListDropdown">
                                           <menuitem id="hdrReplyList_ReplyListSubButton"
@@ -94,12 +94,12 @@
                                                                RestoreFocusAfterHdrButton();"/>
                                         </menupopup>
                                       </toolbarbutton>
-                                      <toolbarbutton id="hdrFollowupButton" label="&hdrFollowupButton1.label;"
+                                      <toolbarbutton is="toolbarbutton-menu-button" id="hdrFollowupButton" label="&hdrFollowupButton1.label;"
+                                                     type="menu-button"
                                                      tooltiptext="&hdrFollowupButton1.tooltip;"
                                                      oncommand="MsgReplyGroup(event); RestoreFocusAfterHdrButton();"
                                                      observes="button_followup"
-                                                     class="toolbarbutton-1 msgHeaderView-button hdrFollowupButton"
-                                                     type="menu-button">
+                                                     class="toolbarbutton-1 msgHeaderView-button hdrFollowupButton">
                                         <menupopup id="hdrFollowupDropdown">
                                           <menuitem id="hdrFollowup_FollowupSubButton"
                                                     label="&hdrFollowupButton1.label;"
diff --git a/mail/base/content/toolbarbutton-menu-button.js b/mail/base/content/toolbarbutton-menu-button.js
new file mode 100644
index 0000000000..80070f6241
--- /dev/null
+++ b/mail/base/content/toolbarbutton-menu-button.js
@@ -0,0 +1,67 @@
+/* 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";
+
+/* global MozXULElement */
+
+// Wrap in a block to prevent leaking to window scope.
+{
+  /**
+   * The MozToolbarButtonMenuButton widget is a toolbarbutton with
+   * type="menu-button". Place a menupopup element inside the button to create
+   * the menu popup. When the dropmarker in the toobarbutton is pressed the
+   * menupopup will open. When clicking the main area of the button it works
+   * like a normal toolbarbutton.
+   *
+   * @extends MozToolbarbutton
+   */
+  class MozToolbarButtonMenuButton extends customElements.get("toolbarbutton") {
+    static get inheritedAttributes() {
+      return {
+        ...super.inheritedAttributes,
+        ".toolbarbutton-menubutton-button": "disabled",
+        ".toolbarbutton-menubutton-dropmarker": "open,disabled",
+      };
+    }
+    static get menubuttonFragment() {
+      let frag = document.importNode(MozXULElement.parseXULToFragment(`
+        <toolbarbutton class="box-inherit toolbarbutton-menubutton-button" flex="1" allowevents="true"></toolbarbutton>
+        <dropmarker type="menu-button" class="toolbarbutton-menubutton-dropmarker"></dropmarker>
+      `), true);
+      Object.defineProperty(this, "menubuttonFragment", {value: frag});
+      return frag;
+    }
+
+    /** @override */
+    get _hasConnected() {
+      return (this.querySelector(":scope > toolbarbutton > .toolbarbutton-text") != null);
+    }
+
+    /** @override */
+    render() {
+      this.appendChild(this.constructor.menubuttonFragment.cloneNode(true));
+      this.initializeAttributeInheritance();
+    }
+
+    connectedCallback() {
+      if (this.delayConnectedCallback() || this._hasConnected) {
+        return;
+      }
+
+      // Defer creating DOM elements for content inside popups.
+      // These will be added in the popupshown handler above.
+      let panel = this.closest("panel");
+      if (panel && !panel.hasAttribute("hasbeenopened")) {
+        return;
+      }
+      this.setAttribute("is", "toolbarbutton-menu-button");
+      this.setAttribute("type", "menu-button");
+
+      this.render();
+    }
+  }
+  customElements.define("toolbarbutton-menu-button", MozToolbarButtonMenuButton,
+                        { extends: "toolbarbutton" });
+}
diff --git a/mail/base/jar.mn b/mail/base/jar.mn
index d9ed78e549..05da855179 100644
--- a/mail/base/jar.mn
+++ b/mail/base/jar.mn
@@ -29,6 +29,7 @@ messenger.jar:
     content/messenger/mailWidgets.xml               (content/mailWidgets.xml)
     content/messenger/mailWidgets.js                (content/mailWidgets.js)
     content/messenger/button-menu-button.js         (content/button-menu-button.js)
+    content/messenger/toolbarbutton-menu-button.js  (content/toolbarbutton-menu-button.js)
     content/messenger/customElements.js             (content/customElements.js)
     content/messenger/customizeToolbar.css          (../../common/src/customizeToolbar.css)
     content/messenger/customizeToolbar.js           (../../common/src/customizeToolbar.js)
diff --git a/mail/components/compose/content/messengercompose.xul b/mail/components/compose/content/messengercompose.xul
index afbec5c282..5b1c122401 100644
--- a/mail/components/compose/content/messengercompose.xul
+++ b/mail/components/compose/content/messengercompose.xul
@@ -1780,13 +1780,15 @@
                autoCheck="false" type="checkbox"
                oncommand="toggleAddressPicker();"/>
 
-    <toolbarbutton class="toolbarbutton-1" type="menu-button"
-               id="button-attach" label="&attachButton.label;"
-               tooltiptext="&attachButton.tooltip2;"
-               command="cmd_attachFile"
-               ondragover="nsDragAndDrop.dragOver(event, envelopeDragObserver);"
-               ondrop="nsDragAndDrop.drop(event, envelopeDragObserver);"
-               ondragexit="nsDragAndDrop.dragExit(event, envelopeDragObserver);">
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-attach"
+                   type="menu-button"
+                   class="toolbarbutton-1"
+                   label="&attachButton.label;"
+                   tooltiptext="&attachButton.tooltip2;"
+                   command="cmd_attachFile"
+                   ondragover="nsDragAndDrop.dragOver(event, envelopeDragObserver);"
+                   ondrop="nsDragAndDrop.drop(event, envelopeDragObserver);"
+                   ondragexit="nsDragAndDrop.dragExit(event, envelopeDragObserver);">
       <menupopup id="button-attachPopup" onpopupshowing="updateAttachmentItems();">
         <menuitem id="button-attachPopup_attachFileItem"
                   label="&attachFileCmd.label;"
@@ -1817,7 +1819,7 @@
       </menupopup>
     </toolbarbutton>
 
-    <toolbarbutton id="button-security"
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-security"
                    type="menu-button"
                    class="toolbarbutton-1"
                    label="&securityButton.label;"
@@ -1842,20 +1844,24 @@
       </menupopup>
     </toolbarbutton>
 
-    <toolbarbutton class="toolbarbutton-1" type="menu-button"
-               id="spellingButton" label="&spellingButton.label;"
-               tooltiptext="&spellingButton.tooltip;"
-               command="cmd_spelling">
+    <toolbarbutton is="toolbarbutton-menu-button" id="spellingButton"
+                   type="menu-button"
+                   class="toolbarbutton-1"
+                   label="&spellingButton.label;"
+                   tooltiptext="&spellingButton.tooltip;"
+                   command="cmd_spelling">
       <!-- workaround for the bug that split menu doesn't take popup="popupID" -->
       <menupopup onpopupshowing="event.preventDefault();
                                  showPopupById('languageMenuList',
                                                'spellingButton');"/>
     </toolbarbutton>
 
-    <toolbarbutton class="toolbarbutton-1" type="menu-button"
-               id="button-save" label="&saveButton.label;"
-               tooltiptext="&saveButton.tooltip;"
-               command="cmd_saveDefault">
+    <toolbarbutton is="toolbarbutton-menu-button" id="button-save"
+                   type="menu-button"
+                   class="toolbarbutton-1"
+                   label="&saveButton.label;"
+                   tooltiptext="&saveButton.tooltip;"
+                   command="cmd_saveDefault">
          <menupopup id="button-savePopup" onpopupshowing="InitFileSaveAsMenu();">
            <menuitem id="savePopup_saveAsFile"
                      label="&saveAsFileCmd.label;" accesskey="&saveAsFileCmd.accesskey;"
@@ -1877,12 +1883,12 @@
                    command="cmd_print"
                    tooltiptext="&printButton.tooltip;"/>
 #else
-    <toolbarbutton id="button-print"
+    <toolbarbutton is="toolbarbutton-menu-button"  id="button-print"
+                   type="menu-button"
                    class="toolbarbutton-1"
                    label="&printButton.label;"
                    command="cmd_print"
-                   tooltiptext="&printButton.tooltip;"
-                   type="menu-button">
+                   tooltiptext="&printButton.tooltip;">
       <menupopup id="button-printPopup"
                  onpopupshowing="goUpdateCommand('cmd_printpreview');">
         <menuitem id="button-printMenu"