Bug 1511571 - [autoconfig] Make domain bold. r=aceman a=jorgk
authorBen Bucksch <ben.bucksch@beonex.com>
Fri, 14 Dec 2018 12:05:14 +0100
changeset 33917 ccac3411796aaae4bb4bf6f76cd5d388c1a08cfc
parent 33916 fb8839b8e49ed532baa674b6472042922ceb653b
child 33918 7f685897fe309ac256c3e591e4b14332c536a9e6
push id388
push userclokep@gmail.com
push dateMon, 28 Jan 2019 20:54:56 +0000
reviewersaceman, jorgk
bugs1511571
Bug 1511571 - [autoconfig] Make domain bold. r=aceman a=jorgk To allow the user to more easily make secure decisions, we should make the second level domain of the hostname bold. E.g. for imap.mail.yahoo.com, we should make "yahoo.com" bold. Test Plan: IMAP config display: 1. Enter foo@yahoo.com 2. Click [Continue] 3. -> You see "Incoming: IMAP imap.mail.yahoo.com SSL" 4. -> whereas "yahoo.com" is bold Exchange config display: 1. To test Exchange AutoDiscover with an hotmail/outlook.com account (which has an IMAP config in our ISPDB), set these prefs: mailnews.auto_config.guess.enabled = false mailnews.auto_config_url = "" mailnews.mx_service_url = "" 2. Enter you@outlook.com and a valid password (it will not work without valid password, due to the Exchange AutoDiscover protocol design) 3. [Continue] 4. -> You see e.g. "Exchange server: mail.outlook.com" 5. -> whereas "outlook.com" is bold Insecure IMAP config display: 1. Enter foo@alice.it 2. Click [Continue] 3. -> You see "Incoming: IMAP in.alice.it No encryption" 4. -> whereas "alice.it" is bold 5. -> whereas "No encryption" is red Differential Revision: https://phabricator.services.mozilla.com/D13606
mail/components/accountcreation/content/emailWizard.js
mail/components/accountcreation/content/emailWizard.xul
mail/locales/en-US/chrome/messenger/accountCreation.properties
mail/themes/shared/mail/accountCreation.css
--- a/mail/components/accountcreation/content/emailWizard.js
+++ b/mail/components/accountcreation/content/emailWizard.js
@@ -824,21 +824,25 @@ EmailConfigWizard.prototype =
       e("result_servertype").value = config.incoming.type;
     } else {
       _hide("result_servertype");
     }
 
     if (config.incoming.type == "exchange") {
       _hide("result_hostnames");
       _show("result_exchange");
-      setText("result_exchange_hostname", config.incoming.hostname);
       _disable("create_button");
       removeChildNodes(e("result_addon_install_rows"));
       this.switchToMode("result");
 
+      let hostnameE = e("result_exchange_hostname");
+      _makeHostDisplayString(config.incoming, hostnameE);
+      hostnameE.querySelector(".ssl").hidden = true; // it's always SSL, so just clutter
+      hostnameE.querySelector(".protocolType").hidden = true; // already have a nicer label
+
       (async () => {
         for (let addon of config.addons) {
           let installer = new AddonInstaller(addon);
           addon.isInstalled = await installer.isInstalled();
         }
         let installedAddon = config.addons.find(addon => addon.isInstalled);
         if (installedAddon) {
           _hide("result_addon_intro");
@@ -904,61 +908,76 @@ EmailConfigWizard.prototype =
     }
 
     _show("result_hostnames");
     _hide("result_exchange");
     _enable("create_button");
 
     var unknownString = gStringsBundle.getString("resultUnknown");
 
-    function _makeHostDisplayString(server, stringName) {
+    function _makeHostDisplayString(server, descrE) {
       let type = gStringsBundle.getString(sanitize.translate(server.type,
-          { imap: "resultIMAP", pop3: "resultPOP3", smtp: "resultSMTP" }),
+          { imap: "resultIMAP", pop3: "resultPOP3", smtp: "resultSMTP", exchange: "resultExchange" }),
           unknownString);
-      let host = server.hostname +
-          (isStandardPort(server.port) ? "" : ":" + server.port);
+      let domain = Services.eTLD.getBaseDomainFromHost(server.hostname);
+      let host = server.hostname.substr(0, server.hostname.length - domain.length);
+      let port = (isStandardPort(server.port) ? "" : ":" + server.port);
       let ssl = gStringsBundle.getString(sanitize.translate(server.socketType,
           { 1: "resultNoEncryption", 2: "resultSSL", 3: "resultSTARTTLS" }),
           unknownString);
       let certStatus = gStringsBundle.getString(server.badCert ?
           "resultSSLCertWeak" : "resultSSLCertOK");
       // TODO: we should really also display authentication method here.
-      return gStringsBundle.getFormattedString(stringName,
-          [ type, host, ssl, certStatus ]);
+
+      function _addComponent(text, className) {
+        let textE = document.createElement("label");
+        textE.classList.add(className);
+        textE.textContent = text;
+        descrE.appendChild(textE);
+      }
+      removeChildNodes(descrE);
+      _addComponent(type, "protocolType");
+      _addComponent(host, "host-without-domain");
+      _addComponent(domain, "domain");
+      _addComponent(port, "port");
+      _addComponent(ssl, "ssl");
+      _addComponent(certStatus, "certStatus");
+
+      if (server.socketType != 2 && server.socketType != 3) { // not SSL/STARTTLS
+        descrE.querySelector(".ssl").classList.add("insecure");
+      }
+      if (server.badCert) {
+        descrE.querySelector(".certStatus").classList.add("insecure");
+      }
     }
 
-    var incomingResult = unknownString;
     if (configFilledIn.incoming.hostname) {
-      incomingResult = _makeHostDisplayString(configFilledIn.incoming,
-          "resultIncoming");
+      _makeHostDisplayString(configFilledIn.incoming, e("result-incoming"));
     }
 
-    var outgoingResult = unknownString;
     if (!config.outgoing.existingServerKey) {
       if (configFilledIn.outgoing.hostname) {
-        outgoingResult = _makeHostDisplayString(configFilledIn.outgoing,
-            "resultOutgoing");
+        _makeHostDisplayString(configFilledIn.outgoing, e("result-outgoing"));
       }
     } else {
-      outgoingResult = gStringsBundle.getString("resultOutgoingExisting");
+      // setText() would confuse _makeHostDisplayString() when clearing the child nodes
+      e("result-outgoing").appendChild(document.createTextNode(
+        gStringsBundle.getString("resultOutgoingExisting")));
     }
 
     var usernameResult;
     if (configFilledIn.incoming.username == configFilledIn.outgoing.username) {
       usernameResult = gStringsBundle.getFormattedString("resultUsernameBoth",
             [ configFilledIn.incoming.username || unknownString ]);
     } else {
       usernameResult = gStringsBundle.getFormattedString(
             "resultUsernameDifferent",
             [ configFilledIn.incoming.username || unknownString,
               configFilledIn.outgoing.username || unknownString ]);
     }
-
-    setText("result-incoming", incomingResult);
-    setText("result-outgoing", outgoingResult);
     setText("result-username", usernameResult);
 
     this.switchToMode("result");
   },
 
   /**
    * Handle the user switching between IMAP and POP3 settings using the
    * radio buttons.
--- a/mail/components/accountcreation/content/emailWizard.xul
+++ b/mail/components/accountcreation/content/emailWizard.xul
@@ -226,35 +226,35 @@
         <columns>
           <column/>
           <column flex="1"/>
         </columns>
         <rows>
           <row align="center">
             <label class="textbox-label" value="&incoming.label;"
                    control="result-incoming"/>
-            <textbox id="result-incoming" disabled="true" flex="1"/>
+            <textbox id="result-incoming" class="result-host-info" disabled="true" flex="1"/>
           </row>
           <row align="center">
             <label class="textbox-label" value="&outgoing.label;"
                    control="result-outgoing"/>
-            <textbox id="result-outgoing" disabled="true" flex="1"/>
+            <textbox id="result-outgoing" class="result-host-info" disabled="true" flex="1"/>
           </row>
           <row align="center">
             <label class="textbox-label" value="&username.label;"
                    control="result-username"/>
             <textbox id="result-username" disabled="true" flex="1"/>
           </row>
         </rows>
       </grid>
       <vbox id="result_exchange" hidden="true">
         <hbox id="result_exchange_hostname_container" align="center">
           <label class="textbox-label" value="&exchange-hostname.label;"
                  control="result_exchange_hostname"/>
-          <textbox id="result_exchange_hostname" disabled="true" flex="1"/>
+          <textbox id="result_exchange_hostname" class="result-host-info" disabled="true" flex="1"/>
         </hbox>
         <description id="result_addon_intro"/>
         <grid id="result_addon_install">
           <columns>
             <column id="result_addon_install_column_icon" pack="start" align="center" />
             <column id="result_addon_install_column_link" pack="start" align="center" />
             <column id="result_addon_install_column_button" pack="start" align="center" />
           </columns>
--- a/mail/locales/en-US/chrome/messenger/accountCreation.properties
+++ b/mail/locales/en-US/chrome/messenger/accountCreation.properties
@@ -82,29 +82,16 @@ addonInstallStarted=Downloading and installing add-on…
 addonInstallSuccess=Successfully installed the add-on.
 # LOCALIZATION NOTE(addonInstallLabel): %1$S will be the add-on name
 addonInstallShortLabel=Install
 
 #config result display
 # LOCALIZATION NOTE(resultUnknown): Displayed instead of resultIncoming,
 # resultOutgoing or resultUsername when we don't have a proper value.
 resultUnknown=Unknown
-# LOCALIZATION NOTE(resultIncoming):
-# %1$S will be replaced with either resultIMAP, resultPOP3 or resultSMTP.
-# %2$S will be replaced with the server hostname
-#   with possibly a port appended as ":"+port.
-#   The domain part may be made bold.
-# %3$S will be replaced with either resultNoEncryption or resultSSL or
-#    resultSTARTTLS.
-# %4$S will be replaced with either resultSSLCertWeak or resultSSLCertOK
-#    (which should normally be empty)
-# You may adjust the strings to be a real sentence.
-resultIncoming=%1$S, %2$S, %3$S%4$S
-# LOCALIZATION NOTE(resultOutgoing): see resultIncoming
-resultOutgoing=%1$S, %2$S, %3$S%4$S
 resultOutgoingExisting=Use existing outgoing SMTP server
 resultIMAP=IMAP
 resultPOP3=POP3
 resultSMTP=SMTP
 resultExchange=Exchange
 # LOCALIZATION NOTE(resultNoEncryption): Neither SSL/TLS nor STARTTLS. Transmission of emails in cleartext over the Internet.
 resultNoEncryption=No Encryption
 resultSSL=SSL
--- a/mail/themes/shared/mail/accountCreation.css
+++ b/mail/themes/shared/mail/accountCreation.css
@@ -37,16 +37,36 @@
 }
 
 /* result area */
 
 #result_area {
   margin-bottom: 1em;
 }
 
+textbox.result-host-info > label {
+  margin-left: 0px;
+  margin-right: 0px;
+}
+
+textbox.result-host-info > label.host-without-domain,
+textbox.result-host-info > label.ssl,
+textbox.result-host-info > label.certStatus {
+  margin-left: 0.4em;
+}
+
+textbox.result-host-info > label.domain {
+  font-weight: bold;
+}
+
+textbox.result-host-info > label.insecure {
+  color: red;
+  font-weight: bold;
+}
+
 #result_servertype {
   margin-bottom: 1.5em;
 }
 
 #result_exchange_hostname_container {
   margin-bottom: 0.5em;
 }