Bug 1602477 - Implement min-width for the message compose recipient area. r=mkmelin
authorAlessandro Castellani <alessandro@thunderbird.net>
Wed, 06 May 2020 10:50:30 -0700
changeset 38249 6c1be4cedbacab59d2e36706d5aa92df3c0c3722
parent 38248 2bd6adda19764077cad6db53586f51916aa2dd56
child 38250 1950b809c9898a96340349a70d6f1ada4b6f8e76
push id2607
push userclokep@gmail.com
push dateMon, 01 Jun 2020 20:50:20 +0000
treeherdercomm-beta@9d45cd34927b [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmkmelin
bugs1602477
Bug 1602477 - Implement min-width for the message compose recipient area. r=mkmelin
mail/components/compose/content/MsgComposeCommands.js
mail/components/compose/content/addressingWidgetOverlay.js
--- a/mail/components/compose/content/MsgComposeCommands.js
+++ b/mail/components/compose/content/MsgComposeCommands.js
@@ -3757,16 +3757,18 @@ function ComposeLoad() {
   }
 
   setEncSigStatusUI();
 
   ExtensionParent.apiManager.emit(
     "extension-browser-inserted",
     GetCurrentEditorElement()
   );
+
+  setDefaultHeaderMinHeight();
 }
 
 function ComposeUnload() {
   // Send notification that the window is going away completely.
   document
     .getElementById("msgcomposeWindow")
     .dispatchEvent(
       new Event("compose-window-unload", { bubbles: false, cancelable: false })
--- a/mail/components/compose/content/addressingWidgetOverlay.js
+++ b/mail/components/compose/content/addressingWidgetOverlay.js
@@ -1038,18 +1038,19 @@ function closeLabelKeyPress(event, eleme
         .closest(".address-row")
         .querySelector(`input[is="autocomplete-input"][recipienttype]`)
         .focus();
       break;
   }
 }
 
 /**
- * Calculate the height of the composer header area every time a pill is created.
- * If the height is bigger than 2/3 of the compose window heigh, enable overflow.
+ * Calculate the height of the composer header area every time a pill is
+ * created. If the height is bigger than 2/3 of the compose window height,
+ * enable overflow.
  */
 function calculateHeaderHeight() {
   let container = document.getElementById("recipientsContainer");
   if (
     container.classList.contains("overflow") &&
     container.scrollHeight >= window.outerHeight * 0.7
   ) {
     return;
@@ -1070,16 +1071,25 @@ function calculateHeaderHeight() {
 
     if (!header.hasAttribute("height")) {
       header.setAttribute("height", 300);
     }
   }
 }
 
 /**
+ * Set the min-height of the message header area to prevent overlappings in case
+ * the user resizes the area upwards.
+ */
+function setDefaultHeaderMinHeight() {
+  let header = document.getElementById("headers-box");
+  header.style.minHeight = `${header.clientHeight}px`;
+}
+
+/**
  * Handle keypress event on a label inside #extraRecipientsPanel.
  *
  * @param {event} event - The DOM keypress event on the label.
  */
 function extraRecipientsLabelOnKeyPress(event) {
   switch (event.key) {
     case "Enter":
     case "ArrowRight":