Bug 1620718 - Implement missing aria-label attributes in the emailWizard dialog. r=mkmelin
authorAlessandro Castellani <alessandro@thunderbird.net>
Tue, 24 Mar 2020 11:12:43 -0700
changeset 29056 3ebe3ea9c1287a6846f09f0389f173f961ec6ab0
parent 29055 3d92830a28e6a8c3f90e53a96748d8bfffbc757c
child 29057 2bf83584b702a24c5c9f6dcba8f6675ae1e6337e
push id17180
push usergeoff@darktrojan.net
push dateTue, 24 Mar 2020 21:54:20 +0000
treeherdercomm-central@2bf83584b702 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmkmelin
bugs1620718
Bug 1620718 - Implement missing aria-label attributes in the emailWizard dialog. r=mkmelin
mail/components/accountcreation/content/emailWizard.xhtml
mail/locales/en-US/chrome/messenger/accountCreation.dtd
--- a/mail/components/accountcreation/content/emailWizard.xhtml
+++ b/mail/components/accountcreation/content/emailWizard.xhtml
@@ -307,130 +307,153 @@
             </vbox>
           </hbox>
         </vbox>
       </html:fieldset>
 
       <html:fieldset id="manual-edit_area" class="hub-wrapper config-area"
                      hidden="hidden">
 
-        <html:table class="manual-config-table">
+        <html:table class="manual-config-table"
+                    summary="&manualConfigTable.summary;">
           <html:tr>
-            <html:th class="config-label"></html:th>
-            <html:th class="column-title">&incomingColumn.label;</html:th>
-            <html:th class="column-title">&outgoingColumn.label;</html:th>
+            <html:th scope="col" class="config-label"></html:th>
+            <html:th id="incomingColumnLabel" scope="col" class="column-title">
+              &incomingColumn.label;
+            </html:th>
+            <html:th id="outgoingColumnLabel" scope="col" class="column-title">
+              &outgoingColumn.label;
+            </html:th>
           </html:tr>
 
           <html:tr>
-            <html:th class="config-label">&protocol.label;</html:th>
+            <html:th id="protocolRowLabel" scope="row" class="config-label">
+              &protocol.label;
+            </html:th>
             <html:td>
               <menulist id="incoming_protocol"
                         oncommand="gEmailConfigWizard.onChangedProtocolIncoming();"
-                        sizetopopup="always">
+                        sizetopopup="always"
+                        aria-labelledby="incomingColumnLabel protocolRowLabel">
                 <menupopup>
                   <menuitem label="&imap.label;" value="1"/>
                   <menuitem label="&pop3.label;" value="2"/>
                 </menupopup>
               </menulist>
             </html:td>
             <html:td>
               <label id="outgoing_protocol" value="&smtp.label;"/>
             </html:td>
           </html:tr>
 
           <html:tr>
-            <html:th class="config-label">&serverRow.label;</html:th>
+            <html:th id="serverRowLabel" scope="row" class="config-label">
+              &serverRow.label;
+            </html:th>
             <html:td>
               <hbox class="input-control" align="center" flex="1">
                 <html:input id="incoming_hostname"
                             type="text"
                             oninput="gEmailConfigWizard.onInputHostname();"
-                            class="host uri-element input-field"/>
+                            class="host uri-element input-field"
+                            aria-labelledby="incomingColumnLabel serverRowLabel"/>
               </hbox>
             </html:td>
             <html:td>
               <menulist is="menulist-editable" id="outgoing_hostname"
                         editable="true"
                         sizetopopup="none"
                         oninput="gEmailConfigWizard.onInputHostname();"
                         oncommand="gEmailConfigWizard.onChangedOutgoingDropdown();"
                         onpopupshowing="gEmailConfigWizard.onOpenOutgoingDropdown();"
                         class="host uri-element"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="outgoingColumnLabel serverRowLabel">
                 <menupopup id="outgoing_hostname_popup"/>
               </menulist>
             </html:td>
           </html:tr>
 
           <html:tr>
-            <html:th class="config-label">&portRow.label;</html:th>
+            <html:th id="portRowLabel" scope="row" class="config-label">
+              &portRow.label;
+            </html:th>
             <html:td>
               <menulist is="menulist-editable" id="incoming_port"
                         editable="true"
                         oninput="gEmailConfigWizard.onChangedPortIncoming();"
                         oncommand="gEmailConfigWizard.onChangedPortIncoming();"
                         class="port"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="incomingColumnLabel portRowLabel">
                 <menupopup/>
               </menulist>
             </html:td>
             <html:td>
               <menulist is="menulist-editable" id="outgoing_port"
                         editable="true"
                         oninput="gEmailConfigWizard.onChangedPortOutgoing();"
                         oncommand="gEmailConfigWizard.onChangedPortOutgoing();"
                         class="port"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="outgoingColumnLabel portRowLabel">
                 <menupopup/>
               </menulist>
             </html:td>
           </html:tr>
 
           <html:tr>
-            <html:th class="config-label">&sslRow.label;</html:th>
+            <html:th id="sslRowLabel" scope="row" class="config-label">
+              &sslRow.label;
+            </html:th>
             <html:td>
               <menulist id="incoming_ssl"
                         class="security"
                         oncommand="gEmailConfigWizard.onChangedSSLIncoming();"
                         sizetopopup="none"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="incomingColumnLabel sslRowLabel">
                 <menupopup>
                   <!-- values defined in nsMsgSocketType -->
                   <menuitem label="&autodetect.label;" value="0"/>
                   <menuitem label="&noEncryption.label;" value="1"/>
                   <menuitem label="&starttls.label;" value="3"/>
                   <menuitem label="&sslTls.label;" value="2"/>
                 </menupopup>
               </menulist>
             </html:td>
             <html:td>
               <menulist id="outgoing_ssl"
                         class="security"
                         oncommand="gEmailConfigWizard.onChangedSSLOutgoing();"
                         sizetopopup="none"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="outgoingColumnLabel sslRowLabel">
                 <menupopup>
                   <!-- @see incoming -->
                   <menuitem label="&autodetect.label;" value="0"/>
                   <menuitem label="&noEncryption.label;" value="1"/>
                   <menuitem label="&starttls.label;" value="3"/>
                   <menuitem label="&sslTls.label;" value="2"/>
                 </menupopup>
               </menulist>
             </html:td>
           </html:tr>
 
           <html:tr>
-            <html:th class="config-label">&auth.label;:</html:th>
+            <html:th id="authRowLabel" scope="row" class="config-label">
+              &auth.label;:
+            </html:th>
             <html:td>
               <menulist id="incoming_authMethod"
                         class="auth"
                         oncommand="gEmailConfigWizard.onChangedInAuth();"
                         sizetopopup="none"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="incomingColumnLabel authRowLabel">
                 <menupopup>
                   <menuitem label="&autodetect.label;" value="0"/>
                   <!-- values defined in nsMsgAuthMethod -->
                   <!-- labels set from messenger.properties
                       to avoid duplication -->
                   <menuitem id="in-authMethod-password-cleartext" value="3"/>
                   <menuitem id="in-authMethod-password-encrypted" value="4"/>
                   <menuitem id="in-authMethod-kerberos" value="5"/>
@@ -439,47 +462,52 @@
                 </menupopup>
               </menulist>
             </html:td>
             <html:td>
               <menulist id="outgoing_authMethod"
                         class="auth"
                         oncommand="gEmailConfigWizard.onChangedOutAuth(this.selectedItem);"
                         sizetopopup="none"
-                        flex="1">
+                        flex="1"
+                        aria-labelledby="outgoingColumnLabel authRowLabel">
                 <menupopup>
                   <menuitem label="&autodetect.label;" value="0"/>
                   <!-- @see incoming -->
                   <menuitem id="out-authMethod-no" value="1"/>
                   <menuitem id="out-authMethod-password-cleartext" value="3"/>
                   <menuitem id="out-authMethod-password-encrypted" value="4"/>
                   <menuitem id="out-authMethod-kerberos" value="5"/>
                   <menuitem id="out-authMethod-ntlm" value="6"/>
                   <menuitem id="out-authMethod-oauth2" value="10" hidden="true"/>
                 </menupopup>
               </menulist>
             </html:td>
           </html:tr>
 
           <html:tr>
-            <html:th class="config-label">&username.label;</html:th>
+            <html:th id="usernameRowLabel" scope="row" class="config-label">
+              &username.label;
+            </html:th>
             <html:td>
               <hbox class="input-control" align="center" flex="1" equalsize="never">
                 <html:input id="incoming_username"
                             type="text"
                             oninput="gEmailConfigWizard.onInputInUsername();"
-                            class="username input-field"/>
+                            class="username input-field"
+                            aria-labelledby="incomingColumnLabel usernameRowLabel"/>
               </hbox>
             </html:td>
             <html:td>
               <hbox class="input-control" align="center" flex="1" equalsize="never">
                 <html:input id="outgoing_username"
                             type="text"
                             oninput="gEmailConfigWizard.onInputOutUsername();"
-                            class="username input-field"/>
+                            class="username input-field"
+                            aria-labelledby="outgoingColumnLabel usernameRowLabel"/>
               </hbox>
             </html:td>
           </html:tr>
 
           <html:tr>
             <html:td colspan="3" class="link-row">
               <button id="advanced-setup_button"
                       class="btn-link"
--- a/mail/locales/en-US/chrome/messenger/accountCreation.dtd
+++ b/mail/locales/en-US/chrome/messenger/accountCreation.dtd
@@ -27,16 +27,17 @@
 <!ENTITY usernameEx.placeholder          "YOURDOMAIN\yourusername">
 <!-- LOCALIZATION NOTE(usernameEx.text): Domain refers to the Windows domain in ActiveDirectory. We mean the user's login in Windows at the local corporate network. -->
 <!ENTITY usernameEx.text                 "Domain login">
 
 <!ENTITY protocol.label                  "Protocol:">
 <!ENTITY imapLong.label                  "IMAP (remote folders)">
 <!ENTITY pop3Long.label                  "POP3 (keep mail on your computer)">
 
+<!ENTITY manualConfigTable.summary       "Server settings">
 <!ENTITY incoming.label                  "Incoming:">
 <!ENTITY incomingColumn.label            "Incoming">
 <!ENTITY outgoing.label                  "Outgoing:">
 <!ENTITY outgoingColumn.label            "Outgoing">
 <!ENTITY username.label                  "Username:">
 <!ENTITY serverRow.label                 "Server:">
 <!ENTITY portRow.label                   "Port:">
 <!ENTITY sslRow.label                    "SSL:">