Bug 1455151 - Support subdialog sizing of HTML documents from a stylesheet and use it for autofill edit dialogs. r=jaws
authorMatthew Noorenberghe <mozilla@noorenberghe.ca>
Wed, 18 Apr 2018 16:12:15 -0700
changeset 467926 b180b277a1ef479b4135bd4194a39635c048dfe0
parent 467925 b48bdfb834f32c6c20c20c942b461dc9b213a645
child 467927 0fc32c8b1286170d8259a21e13693a375304971a
push id9165
push userasasaki@mozilla.com
push dateThu, 26 Apr 2018 21:04:54 +0000
treeherdermozilla-beta@064c3804de2e [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersjaws
bugs1455151
milestone61.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1455151 - Support subdialog sizing of HTML documents from a stylesheet and use it for autofill edit dialogs. r=jaws MozReview-Commit-ID: GeHPhFTnCIz
browser/components/preferences/in-content/subdialogs.js
browser/extensions/formautofill/content/editAddress.xhtml
browser/extensions/formautofill/content/editCreditCard.xhtml
browser/extensions/formautofill/skin/shared/editAddress.css
browser/extensions/formautofill/skin/shared/editCreditCard.css
--- a/browser/components/preferences/in-content/subdialogs.js
+++ b/browser/components/preferences/in-content/subdialogs.js
@@ -277,17 +277,26 @@ SubDialog.prototype = {
     let boxVerticalBorder = 2 * parseFloat(getComputedStyle(this._box).borderTopWidth);
 
     // The difference between the frame and box shouldn't change, either:
     let boxRect = this._box.getBoundingClientRect();
     let frameRect = this._frame.getBoundingClientRect();
     let frameSizeDifference = (frameRect.top - boxRect.top) + (boxRect.bottom - frameRect.bottom);
 
     // Then determine and set a bunch of width stuff:
-    let frameMinWidth = docEl.style.width || docEl.scrollWidth + "px";
+    let frameMinWidth = docEl.style.width;
+    if (!frameMinWidth) {
+      if (docEl.ownerDocument.body) {
+        // HTML documents have a body but XUL documents don't
+        frameMinWidth = docEl.ownerDocument.body.scrollWidth;
+      } else {
+        frameMinWidth = docEl.scrollWidth;
+      }
+      frameMinWidth += "px";
+    }
     let frameWidth = docEl.getAttribute("width") ? docEl.getAttribute("width") + "px" :
                      frameMinWidth;
     this._frame.style.width = frameWidth;
     this._box.style.minWidth = "calc(" +
                                (boxHorizontalBorder + boxHorizontalPadding) +
                                "px + " + frameMinWidth + ")";
 
     // Now do the same but for the height. We need to do this afterwards because otherwise
--- a/browser/extensions/formautofill/content/editAddress.xhtml
+++ b/browser/extensions/formautofill/content/editAddress.xhtml
@@ -1,17 +1,17 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- 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/. -->
 <!DOCTYPE html [
   <!ENTITY % globalDTD SYSTEM "chrome://global/locale/global.dtd">
   %globalDTD;
 ]>
-<html xmlns="http://www.w3.org/1999/xhtml" width="620">
+<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
   <title data-localization="addNewAddressTitle"/>
   <link rel="stylesheet" href="chrome://formautofill-shared/skin/editDialog.css"/>
   <link rel="stylesheet" href="chrome://formautofill-shared/skin/editAddress.css"/>
   <link rel="stylesheet" href="chrome://formautofill/skin/editDialog.css"/>
   <script src="chrome://formautofill/content/l10n.js"></script>
   <script src="chrome://formautofill/content/editDialog.js"></script>
   <script src="chrome://formautofill/content/autofillEditForms.js"></script>
--- a/browser/extensions/formautofill/content/editCreditCard.xhtml
+++ b/browser/extensions/formautofill/content/editCreditCard.xhtml
@@ -1,17 +1,17 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!-- 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/. -->
 <!DOCTYPE html [
   <!ENTITY % globalDTD SYSTEM "chrome://global/locale/global.dtd">
   %globalDTD;
 ]>
-<html xmlns="http://www.w3.org/1999/xhtml" width="500" style="width: 500px">
+<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
   <title data-localization="addNewCreditCardTitle"/>
   <link rel="stylesheet" href="chrome://formautofill-shared/skin/editDialog.css"/>
   <link rel="stylesheet" href="chrome://formautofill-shared/skin/editCreditCard.css"/>
   <link rel="stylesheet" href="chrome://formautofill/skin/editDialog.css"/>
   <script src="chrome://formautofill/content/l10n.js"></script>
   <script src="chrome://formautofill/content/editDialog.js"></script>
   <script src="chrome://formautofill/content/autofillEditForms.js"></script>
--- a/browser/extensions/formautofill/skin/shared/editAddress.css
+++ b/browser/extensions/formautofill/skin/shared/editAddress.css
@@ -1,12 +1,15 @@
 /* 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/. */
 
+html {
+  width: 620px;
+}
 
 label > span {
   flex: 0 0 9.5em;
 }
 
 input,
 select {
   flex: 1 0 auto;
--- a/browser/extensions/formautofill/skin/shared/editCreditCard.css
+++ b/browser/extensions/formautofill/skin/shared/editCreditCard.css
@@ -1,12 +1,16 @@
 /* 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/. */
 
+html {
+  width: 500px;
+}
+
 form {
   justify-content: center;
 }
 
 form > label,
 form > div {
   flex: 1 0 100%;
   align-self: center;