Bug 1582929 - Fix event dialog input fields for screen reader. r=mkmelin
authorKhushil Mistry <khushil324@gmail.com>
Mon, 23 Sep 2019 03:07:00 +0200
changeset 36914 ed438e24de20ee4539ee789d5839dc0a591ecc98
parent 36913 cf7a0bacde4897a5328f7fe298d65a26be6c3a64
child 36915 b72fde123f323bfbcbcc160584695c08741864f8
push id395
push userclokep@gmail.com
push dateMon, 02 Dec 2019 19:38:57 +0000
reviewersmkmelin
bugs1582929
Bug 1582929 - Fix event dialog input fields for screen reader. r=mkmelin
calendar/lightning/content/lightning-item-iframe.xul
--- a/calendar/lightning/content/lightning-item-iframe.xul
+++ b/calendar/lightning/content/lightning-item-iframe.xul
@@ -150,39 +150,43 @@
         <menulist id="item-calendar"
                   disable-on-readonly="true"
                   oncommand="updateCalendar();"/>
       </html:td>
     </html:tr>
     <!-- Title -->
     <html:tr id="event-grid-title-row">
       <html:th>
-        <label value="&event.title.textbox.label;"
+        <label id="item-title-label"
+               value="&event.title.textbox.label;"
                accesskey="&event.title.textbox.accesskey;"
                control="item-title"
                disable-on-readonly="true"/>
       </html:th>
       <html:td class="event-input-td">
         <html:input id="item-title"
                     disable-on-readonly="true"
-                    oninput="updateTitle()"/>
+                    oninput="updateTitle()"
+                    aria-labelledby="item-title-label"/>
       </html:td>
     </html:tr>
 
     <!-- Location -->
     <html:tr id="event-grid-location-row">
       <html:th>
-        <label value="&event.location.label;"
+        <label id="item-location-label"
+               value="&event.location.label;"
                accesskey="&event.location.accesskey;"
                control="item-location"
                disable-on-readonly="true"/>
       </html:th>
       <html:td class="event-input-td">
         <html:input id="item-location"
-                    disable-on-readonly="true"/>
+                    disable-on-readonly="true"
+                    aria-labelledby="item-location-label"/>
       </html:td>
     </html:tr>
 
     <!-- Category & Calendar -->
     <html:tr id="event-grid-category-color-row">
       <html:th class="above-separator">
         <hbox id="event-grid-category-labels-box">
           <label id="item-categories-label"