Bug 1506835 - Resize browser languages dialog when error appears r=jaws

***

Differential Revision: https://phabricator.services.mozilla.com/D12985

--HG--
extra : moz-landing-system : lando

browser/components/preferences/browserLanguages.js

@@ -511,15 +511,20 @@ var gBrowserLanguagesDialog = {
   },
 
   showError() {
-    document.querySelectorAll(".warning-message-separator")
-      .forEach(separator => separator.classList.add("thin"));
     document.getElementById("warning-message").hidden = false;
     this._availableLocales.enableWithMessageId("browser-languages-select-language");
+
+    // The height has likely changed, find our SubDialog and tell it to resize.
+    requestAnimationFrame(() => {
+      let dialogs = window.opener.gSubDialog._dialogs;
+      let index = dialogs.findIndex(d => d._frame.contentDocument == document);
+      if (index != -1) {
+        dialogs[index].resizeDialog();
+      }
+    });
   },
 
   hideError() {
-    document.querySelectorAll(".warning-message-separator")
-      .forEach(separator => separator.classList.remove("thin"));
     document.getElementById("warning-message").hidden = true;
   },
 

browser/components/preferences/browserLanguages.xul

@@ -58,10 +58,8 @@
       </row>
     </rows>
   </grid>
-  <separator class="warning-message-separator"/>
   <hbox id="warning-message" class="message-bar message-bar-warning" hidden="true">
     <image class="message-bar-icon"/>
     <description class="message-bar-description" data-l10n-id="browser-languages-error"/>
   </hbox>
-  <separator class="warning-message-separator"/>
 </dialog>

browser/components/preferences/in-content/subdialogs.js

@@ -279,6 +279,10 @@ SubDialog.prototype = {
       await aEvent.target.contentDocument.mozSubdialogReady;
     }
 
+    await this.resizeDialog();
+  },
+
+  async resizeDialog() {
     // Do this on load to wait for the CSS to load and apply before calculating the size.
     let docEl = this._frame.contentDocument.documentElement;
 

browser/themes/shared/incontentprefs/preferences.inc.css

@@ -857,8 +857,8 @@ menulist[indicator=true] > menupopup menuitem[indicator=true]:not([image]) > .me
   margin-inline-end: 0;
 }
 
-#requestedLocales {
-  min-height: 200px;
+#selectedLocales {
+  height: 150px;
 }
 
 #availableLanguages,
@@ -871,6 +871,10 @@ menulist[indicator=true] > menupopup menuitem[indicator=true]:not([image]) > .me
   width: 32em;
 }
 
+#warning-message {
+  margin-top: 8px;
+}
+
 .add-web-language,
 .add-browser-language {
   margin: 0;