summaryrefslogtreecommitdiffstats
path: root/extensions/BugModal/template/en/default
diff options
context:
space:
mode:
authorDavid Lawrence <dkl@mozilla.com>2017-02-09 18:33:46 +0100
committerDavid Lawrence <dkl@mozilla.com>2017-02-09 18:33:46 +0100
commitd0cc4c7d97a6a7e058de90a0b8269587758f085b (patch)
tree4a6640c26acbc85c6841dba0982b634be5a5ee6e /extensions/BugModal/template/en/default
parent39ace7e59efe074108fa48fd82180be46dbec568 (diff)
downloadbugzilla-d0cc4c7d97a6a7e058de90a0b8269587758f085b.tar.gz
bugzilla-d0cc4c7d97a6a7e058de90a0b8269587758f085b.tar.xz
Bug 1280393 - [a11y] All inputs and selects need to be labeled properly
Diffstat (limited to 'extensions/BugModal/template/en/default')
-rw-r--r--extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl5
-rw-r--r--extensions/BugModal/template/en/default/bug_modal/field.html.tmpl40
-rw-r--r--extensions/BugModal/template/en/default/bug_modal/new_comment.html.tmpl2
3 files changed, 32 insertions, 15 deletions
diff --git a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
index 08a47b2d6..ef2922181 100644
--- a/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl
@@ -409,6 +409,7 @@
container = 1
hide_on_view = bug.priority == "--" && bug.bug_severity == "normal"
help = "https://wiki.mozilla.org/BMO/UserGuide/BugFields#priority"
+ label_for = "priority"
%]
[% INCLUDE bug_modal/field.html.tmpl
field = bug_fields.priority
@@ -442,6 +443,7 @@
label = "Status"
hide_on_edit = 1
help = "https://wiki.mozilla.org/BMO/UserGuide/BugStatuses"
+ label_for = "bug_status"
%]
[% bug.bug_status FILTER html %]
[%+ bug.resolution FILTER html IF bug.resolution %]
@@ -780,6 +782,7 @@
hide_on_view = (bug.rep_platform == 'All' && bug.op_sys == 'All')
|| (bug.rep_platform == 'Unspecified' && bug.op_sys == 'Unspecified')
help = "https://wiki.mozilla.org/BMO/UserGuide/BugFields#rep_platform"
+ label_for = "rep_platform"
%]
[% INCLUDE bug_modal/field.html.tmpl
field = bug_fields.rep_platform
@@ -1009,7 +1012,7 @@
[% WRAPPER bug_modal/field.html.tmpl
field = bug_fields.status_whiteboard
field_type = constants.FIELD_TYPE_FREETEXT
- help = "https://wiki.mozilla.org/BMO/Whiteboard"
+ help = "https://wiki.mozilla.org/BMO/UserGuide/Whiteboard"
%]
[% bug.status_whiteboard == "" ? "---" : bug.status_whiteboard FILTER html %]
[% END %]
diff --git a/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl
index ac501c8d5..58fc4c30f 100644
--- a/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/field.html.tmpl
@@ -33,6 +33,7 @@
# class: (string) optional button class
# caption: (string) button caption
# hidden: (boolean) don't show the button (default: false)
+ # label_for: (string) optional label for identifier
#%]
[%
@@ -104,9 +105,21 @@ END;
<div class="name
[%~ " edit-show" IF hide_on_view %]"
[% IF hide_on_view %] style="display:none"[% END %]>
- [%~ IF help.defined %]<a href="[% help FILTER none %]" class="help">[% END %]
+ [%~ IF help.defined %]
+ <a href="[% help FILTER none %]" id="[% name FILTER html %]-help-link" class="help">
+ [% aria_labelledby_id = "${name}-help-link" %]
+ [% aria_labelledby_html = BLOCK %]aria-labelledby="[% aria_labelledby_id FILTER html %]"[% END %]
+ [% END %]
+ [%~ IF label_for %]
+ <label for="[% label_for FILTER html %]">
+ [% END %]
[%~ label _ ":" FILTER html IF label %]
- [%~ IF help.defined %]</a>[% END ~%]
+ [%~ IF label_for %]
+ </label>
+ [% END ~%]
+ [%~ IF help.defined %]
+ </a>
+ [% END %]
</div>
[% END %]
@@ -177,7 +190,7 @@ END;
[% CASE constants.FIELD_TYPE_SINGLE_SELECT %]
[%# single value select %]
<input type="hidden" id="[% name FILTER html %]-dirty">
- <select name="[% name FILTER html %]" id="[% name FILTER html %]">
+ <select name="[% name FILTER html %]" id="[% name FILTER html %]" [% aria_labelledby_html FILTER none %]>
[% IF values.defined %]
[% FOREACH v IN values %]
[% NEXT IF NOT v.is_active AND NOT value.contains(v.name).size %]
@@ -195,7 +208,7 @@ END;
[% CASE constants.FIELD_TYPE_MULTI_SELECT %]
[%# multi value select %]
<input type="hidden" id="[% name FILTER html %]-dirty">
- <select name="[% name FILTER html %]" id="[% name FILTER html %]" multiple size="5">
+ <select name="[% name FILTER html %]" id="[% name FILTER html %]" multiple size="5" [% aria_labelledby_html FILTER none %]>
[% IF values.defined %]
[%# not implemented %]
[% ELSE %]
@@ -207,8 +220,7 @@ END;
[% CASE constants.FIELD_TYPE_FREETEXT %]
[%# normal input field %]
- <input name="[% name FILTER html %]" id="[% name FILTER html %]" value="[% value FILTER html %]">
-
+ <input name="[% name FILTER html %]" id="[% name FILTER html %]" value="[% value FILTER html %]" [% aria_labelledby_html FILTER none %]>
[% CASE constants.FIELD_TYPE_USER %]
[% IF action && !action.hidden %]
<button class="field-button minor [%= action.class FILTER html IF action.class %]"
@@ -225,6 +237,7 @@ END;
value = value.login
classes = [ "bz_userfield" ]
placeholder = default
+ aria_labelledby = aria_labelledby_id
%]
[% IF action && !action.hidden %]
</div>
@@ -240,12 +253,13 @@ END;
classes = [ "bz_userfield" ]
placeholder = default
multiple = 5
+ aria_labelledby = aria_labelledby_id
%]
[% CASE constants.FIELD_TYPE_KEYWORDS %]
[%# keywords %]
<input type="text" id="[% name FILTER html %]" name="[% name FILTER html %]"
- value="[% value FILTER html %]">
+ value="[% value FILTER html %]" [% aria_labelledby_html FILTER none %]>
[% CASE constants.FIELD_TYPE_BUG_URLS %]
[%# see also %]
@@ -265,31 +279,31 @@ END;
<span class="multiline-value" id="[% name FILTER html %]-view">[% value FILTER html FILTER html_line_break %]</span>
[% END %]
<textarea id="[% name FILTER html %]" name="[% name FILTER html %]"
- rows="10" cols="10" style="display:none">[% value FILTER html %]</textarea>
+ rows="10" cols="10" style="display:none" [% aria_labelledby_html FILTER none %]>[% value FILTER html %]</textarea>
[% CASE constants.FIELD_TYPE_DATETIME %]
[%# datetime %]
<input class="cf_datetime" name="[% name FILTER html %]" id="[% name FILTER html %]"
- value="[% value FILTER html %]">
+ value="[% value FILTER html %]" [% aria_labelledby_html FILTER none %]>
<img class="cf_datetime-img" id="[% name FILTER html %]-img"
src="extensions/BugModal/web/calendar.png" width="16" height="16">
[% CASE constants.FIELD_TYPE_DATE %]
[%# date %]
<input class="cf_date" name="[% name FILTER html %]" id="[% name FILTER html %]"
- value="[% value FILTER html %]">
+ value="[% value FILTER html %]" [% aria_labelledby_html FILTER none %]>
<img class="cf_date-img" id="[% name FILTER html %]-img"
src="extensions/BugModal/web/calendar.png" width="16" height="16">
[% CASE constants.FIELD_TYPE_INTEGER %]
[%# integer %]
<input type="number" name="[% name FILTER html %]" id="[% name FILTER html %]"
- value="[% value FILTER html %]">
+ value="[% value FILTER html %]" [% aria_labelledby_html FILTER none %]>
[% CASE constants.FIELD_TYPE_BUG_ID %]
[%# bug id %]
<input type="text" name="[% name FILTER html %]" id="[% name FILTER html %]"
- value="[% value FILTER html %]">
+ value="[% value FILTER html %]" [% aria_labelledby_html FILTER none %]>
[% CASE %]
[%# error %]
@@ -339,6 +353,6 @@ END;
[% END %]
[% ELSE %]
<input type="text" id="[% name FILTER html %]" name="[% name FILTER html %]"
- value="[% values.pluck('id').join(", ") FILTER html %]">
+ value="[% values.pluck('id').join(", ") FILTER html %]" [% aria_labelledby_html FILTER none %]>
[% END %]
[% END %]
diff --git a/extensions/BugModal/template/en/default/bug_modal/new_comment.html.tmpl b/extensions/BugModal/template/en/default/bug_modal/new_comment.html.tmpl
index 60bf2b29a..63663b4d5 100644
--- a/extensions/BugModal/template/en/default/bug_modal/new_comment.html.tmpl
+++ b/extensions/BugModal/template/en/default/bug_modal/new_comment.html.tmpl
@@ -42,7 +42,7 @@
</ul>
<div id="comment-edit-tabpanel" class="comment-tabpanel" role="tabpanel" aria-labelledby="comment-edit-tab">
- <textarea rows="5" cols="80" name="comment" id="comment"></textarea>
+ <textarea rows="5" cols="80" name="comment" id="comment" aria-labelledby="comment-edit-tab"></textarea>
</div>
<div id="comment-preview-tabpanel" class="comment-tabpanel" role="tabpanel" aria-labelledby="comment-preview-tab" style="display:none">
<pre id="comment-preview" class="comment-text"></pre>