Bug 1364660 - Port bug 1358645 to TB [Close the preference dialog when the user clicks the overlay background]. r=jorgk

mail/components/preferences/subdialogs.js

@@ -129,6 +129,13 @@ var gSubDialog = {
 
   handleEvent: function(aEvent) {
     switch (aEvent.type) {
+      case "click":
+        // Close the dialog if the user clicked the overlay background, just
+        // like when the user presses the ESC key (case "command" below).
+        if (aEvent.target === this._overlay) {
+          this._frame.contentWindow.close();
+        }
+        break;
       case "command":
         this._frame.contentWindow.close();
         break;
@@ -391,10 +398,13 @@ var gSubDialog = {
     this._frame.addEventListener("load", this);
 
     chromeBrowser.addEventListener("unload", this, true);
+
     // Ensure we get <esc> keypresses even if nothing in the subdialog is focusable
     // (happens on OS X when only text inputs and lists are focusable, and
     //  the subdialog only has checkboxes/radiobuttons/buttons)
     window.addEventListener("keydown", this, true);
+
+    this._overlay.addEventListener("click", this, true);
   },
 
   _removeDialogEventListeners: function() {
@@ -408,6 +418,9 @@ var gSubDialog = {
     this._frame.removeEventListener("load", this);
     this._frame.contentWindow.removeEventListener("dialogclosing", this);
     window.removeEventListener("keydown", this, true);
+
+    this._overlay.removeEventListener("click", this, true);
+
     if (this._resizeObserver) {
       this._resizeObserver.disconnect();
       this._resizeObserver = null;

mail/themes/shared/mail/incontentprefs/aboutPreferences.css

@@ -266,6 +266,7 @@ tabs {
   -moz-box-pack: center;
   width: 100%;
   height: 100%;
+  pointer-events: none;
 }
 
 #dialogBox {
@@ -280,6 +281,7 @@ tabs {
   display: -moz-box;
   margin: 0;
   padding: 0;
+  pointer-events: auto;
 }
 
 #dialogBox[resizable="true"] {