Skip to content

Commit aa3c437

Browse files
dylanwhdylanwh
committed
Revert "Bug 1280363 - [a11y] Make the Actions menu button accessible for keyboard and screen readers"
This reverts commit 318b902.
1 parent 318b902 commit aa3c437

File tree

8 files changed

+158
-292
lines changed

8 files changed

+158
-292
lines changed

‎extensions/BugModal/template/en/default/bug_modal/activity_stream.html.tmpl‎

Lines changed: 13 additions & 35 deletions
Original file line numberDiff line numberDiff line change
@@ -14,43 +14,21 @@
1414
[% END %]
1515
<button type="button" id="comment-tags-btn" style="display:none" class="minor">Tags &#9662;</button>
1616
<button type="button" id="view-menu-btn" class="minor">View &#9662;</button>
17-
<div class="dropdown">
18-
<button type="button" role="button" id="comment-tags-btn" arai-haspopup="true" aria-label="Tags Menu"
19-
aria-expanded="false" aria-controls="comment-tags-menu" class="dropdown-button minor">Tags &#9662;</button>
20-
<ul id="comment-tags-menu" role="menu" tabindex="0" class="dropdown-content" style="display:none">
21-
<li class="dropdown-separator" role="presentation">
22-
<a role="menuitem" tabindex="-1" data-comment-tag="">Reset</a>
23-
</li>
24-
</ul>
25-
</div>
26-
<div class="dropdown">
27-
<button type="button" role="button" id="view-menu-btn" arai-haspopup="true" aria-label="View Menu"
28-
aria-expanded="false" aria-controls="view-menu" class="dropdown-button minor">View &#9662;</button>
29-
<ul id="view-menu" role="menu" tabindex="0" class="dropdown-content" style="display:none">
30-
<li class="dropdown-separator" role="presentation">
31-
<a id="view-reset" role="menuitem" tabindex="-1">Reset</a>
32-
</li>
33-
<li role="presentation">
34-
<a id="view-collapse-all" role="menuitem" tabindex="-1">Collapse All</a>
35-
</li>
36-
<li role="presentation">
37-
<a id="view-expand-all" role="menuitem" tabindex="-1">Expand All</a>
38-
</li>
39-
<li class="dropdown-separator" role="presentation">
40-
<a id="view-comments-only" role="menuitem" tabindex="-1">Comments Only</a>
41-
</li>
42-
<li role="presentation">
43-
<a id="view-toggle-cc" role="menuitem" tabindex="-1">Show CC Changes</a>
44-
</li>
45-
[% IF treeherder %]
46-
<li role="presentation">
47-
<a id="view-toggle-treeherder" role="menuitem" data-userid="[% treeherder.id FILTER none %]">Hide Treeherder Comments</a>
48-
</li>
49-
[% END %]
50-
</ul>
51-
</div>
5217
</div>
5318

19+
<menu id="view-menu" type="context" style="display:none">
20+
<menuitem id="view-reset" label="Reset"></menuitem>
21+
<hr>
22+
<menuitem id="view-collapse-all" label="Collapse All"></menuitem>
23+
<menuitem id="view-expand-all" label="Expand All"></menuitem>
24+
<menuitem id="view-comments-only" label="Comments Only"></menuitem>
25+
<hr>
26+
<menuitem id="view-toggle-cc" label="Show CC Changes"></menuitem>
27+
[% IF treeherder %]
28+
<menuitem id="view-toggle-treeherder" label="Hide Treeherder Comments" data-userid="[% treeherder.id FILTER none %]"></menuitem>
29+
[% END %]
30+
</menu>
31+
5432
[%
5533
PROCESS bug/time.html.tmpl;
5634

‎extensions/BugModal/template/en/default/bug_modal/edit.html.tmpl‎

Lines changed: 15 additions & 80 deletions
Original file line numberDiff line numberDiff line change
@@ -308,32 +308,19 @@
308308
[% is_cced ? "Stop Following" : "Follow" %]
309309
</button>
310310
[% END %]
311-
<div class="dropdown">
312-
<button id="action-menu-btn" aria-haspopup="true" aria-label="Actions Menu"
313-
aria-expanded="false" aria-controls="action-menu" class="dropdown-button minor">&#9662;</button>
314-
<ul class="dropdown-content" id="action-menu" role="menu" style="display:none;">
315-
<li role="presentation">
316-
<a id="action-reset" role="menuitem" tabindex="-1">Reset Sections</a>
317-
</li>
318-
<li role="presentation">
319-
<a id="action-expand-all" role="menuitem" tabindex="-1">Expand All Sections</a>
320-
</li>
321-
<li class="dropdown-separator" role="presentation">
322-
<a id="action-collapse-all" role="menuitem" tabindex="-1">Collapse All Sections</a>
323-
</li>
324-
[% IF user.id %]
325-
<li role="presentation">
326-
<a id="action-add-comment" role="menuitem" tabindex="-1">Add Comment</a>
327-
</li>
328-
[% END %]
329-
<li class="dropdown-separator" role="presentation">
330-
<a id="action-last-comment" role="menuitem" tabindex="-1">Last Comment</a>
331-
</li>
332-
<li role="presentation">
333-
<a id="action-history" role="menuitem" tabindex="-1">History</a>
334-
</li>
335-
</ul>
336-
</div>
311+
<button type="button" id="action-menu-btn" class="minor">&#9662;</button>
312+
<menu id="action-menu" type="context" style="display:none">
313+
<menuitem id="action-reset" label="Reset Sections"></menuitem>
314+
<menuitem id="action-expand-all" label="Expand All Sections"></menuitem>
315+
<menuitem id="action-collapse-all" label="Collapse All Sections"></menuitem>
316+
<hr>
317+
[% IF user.id %]
318+
<menuitem id="action-add-comment" label="Add Comment"></menuitem>
319+
[% END %]
320+
<menuitem id="action-last-comment" label="Last Comment"></menuitem>
321+
<hr>
322+
<menuitem id="action-history" label="History"></menuitem>
323+
</menu>
337324
</div>
338325
<div id="user-guide">
339326
<a title="User guide for [% terms.Bugzilla %]" href="https://wiki.mozilla.org/BMO/UserGuide">Get help with this page</a>
@@ -1313,61 +1300,9 @@
13131300
<div id="bottom-actions">
13141301
<div id="bottom-right-actions">
13151302
<button type="button" id="top-btn" class="minor">Top &uarr;</button>
1316-
<div class="dropdown">
1317-
<button id="format-btn" aria-haspopup="true" aria-label="Format [% terms.Bug %] Menu"
1318-
aria-expanded="false" aria-controls="format-menu" class="dropdown-button minor">Format [% terms.Bug %] &#9652;</button>
1319-
<ul class="dropdown-content menu-up" id="format-menu" role="menu" style="display:none;">
1320-
<li role="presentation">
1321-
<a href="show_bug.cgi?format=multiple&amp;id=[% bug.id FILTER uri %]" role="menuitem" tabindex="-1">For Printing</a>
1322-
</li>
1323-
<li role="presentation">
1324-
<a href="show_bug.cgi?ctype=xml&amp;id=[% bug.id FILTER uri %]" role="menuitem" tabindex="-1">XML</a>
1325-
</li>
1326-
<li role="presentation">
1327-
<a href="show_bug.cgi?format=default&amp;id=[% bug.id FILTER uri %]" role="menuitem" tabindex="-1">Legacy</a>
1328-
</li>
1329-
[% IF bug.groups_in.size == 0 %]
1330-
<li role="presentation">
1331-
<a href="rest/bug/[% bug.id FILTER uri %]" role="menuitem" tabindex="-1">JSON</a>
1332-
</li>
1333-
[% END %]
1334-
</ul>
1335-
</div>
1303+
<button type="button" id="format-btn" class="minor">Format &#9662;</button>
13361304
[% IF user.id %]
1337-
<div class="dropdown">
1338-
<button id="new-bug-btn" aria-haspopup="true" aria-label="New/Clone [% terms.Bug %] Menu"
1339-
aria-expanded="false" aria-controls="new-bug-menu" class="dropdown-button minor">New/Clone [% terms.Bug %] &#9652;</button>
1340-
<ul class="dropdown-content menu-up" id="new-bug-menu" role="menu" style="display:none;">
1341-
<li role="presentation">
1342-
<a href="enter_bug.cgi" role="menuitem" tabindex="-1" target="_blank">
1343-
Create a new [% terms.bug %]</a>
1344-
</li>
1345-
<li role="presentation">
1346-
<a href="enter_bug.cgi?product=[% bug.product FILTER uri %]"
1347-
role="menuitem" tabindex="-1" target="_blank">&#8230; in this product</a>
1348-
</li>
1349-
<li class="dropdown-separator" role="presentation">
1350-
<a href="enter_bug.cgi?product=[% bug.product FILTER uri %]&amp;component=[% bug.component FILTER uri %]"
1351-
role="menuitem" tabindex="-1" target="_blank">&#8230; in this component</a>
1352-
</li>
1353-
<li role="presentation">
1354-
<a href="enter_bug.cgi?format=__default__&amp;product=[% bug.product FILTER uri %]&amp;blocked=[% bug.id FILTER uri %]"
1355-
role="menuitem" tabindex="-1" target="_blank">&#8230; that blocks this [% terms.bug %]</a>
1356-
</li>
1357-
<li class="dropdown-separator" role="presentation">
1358-
<a href="enter_bug.cgi?format=__default__&amp;product=[% bug.product FILTER uri %]&amp;dependson=[% bug.id FILTER uri %]"
1359-
role="menuitem" tabindex="-1" target="_blank">&#8230; that depends on this [% terms.bug %]</a>
1360-
</li>
1361-
<li role="presentation">
1362-
<a href="enter_bug.cgi?format=__default__&amp;product=[% bug.product FILTER uri %]&amp;cloned_bug_id=[% bug.id FILTER uri %]"
1363-
role="menuitem" tabindex="-1" target="_blank">&#8230; as a clone of this [% terms.bug %]</a>
1364-
</li>
1365-
<li role="presentation">
1366-
<a href="enter_bug.cgi?format=__default__&amp;cloned_bug_id=[% terms.bug FILTER uri %]"
1367-
role="menuitem" tabindex="-1" target="_blank">&#8230; as a clone, in a different product</a>
1368-
</li>
1369-
</ul>
1370-
</div>
1305+
<button type="button" id="new-bug-btn" class="minor">New/Clone [% terms.Bug %] &#9662;</button>
13711306
[% END %]
13721307
</div>
13731308
</div>

‎extensions/BugModal/template/en/default/bug_modal/header.html.tmpl‎

Lines changed: 3 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -52,7 +52,6 @@
5252
"extensions/ProdCompSearch/web/js/prod_comp_search.js",
5353
"extensions/BugModal/web/bug_modal.js",
5454
"extensions/BugModal/web/comments.js",
55-
"extensions/BugModal/web/dropdown.js",
5655
"extensions/BugModal/web/ZeroClipboard/ZeroClipboard.min.js",
5756
"js/bugzilla-readable-status-min.js",
5857
"js/field.js",
@@ -61,13 +60,14 @@
6160
);
6261
jquery.push(
6362
"datetimepicker",
63+
"contextMenu",
6464
"visibility"
6565
);
6666
style_urls.push(
6767
"extensions/BugModal/web/bug_modal.css",
68-
"extensions/BugModal/web/dropdown.css",
6968
"skins/custom/bug_groups.css",
70-
"js/jquery/plugins/datetimepicker/datetimepicker.css"
69+
"js/jquery/plugins/datetimepicker/datetimepicker.css",
70+
"js/jquery/plugins/contextMenu/contextMenu.css"
7171
);
7272

7373
IF user.in_group('canconfirm');

‎extensions/BugModal/template/en/default/bug_modal/user.html.tmpl‎

Lines changed: 4 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -41,11 +41,12 @@ END;
4141
width="[% gravatar_size FILTER none %]" height="[% gravatar_size FILTER none %]">
4242
[% END %]
4343
[% UNLESS gravatar_only %]
44-
<a class="email [%= "disabled" UNLESS u.is_enabled %]"
44+
<a class="email [%= "disabled" UNLESS u.is_enabled %] [%= "show_usermenu" IF user.id %]"
4545
[% IF user.id %]
4646
href="mailto:[% u.email FILTER html %]"
47-
onclick="return show_usermenu([% u.id FILTER none %], '[% u.email FILTER js %]',
48-
[% user.in_group('editusers') || user.bless_groups.size > 0 ? "true" : "false" %])"
47+
data-user-id="[% u.id FILTER html %]"
48+
data-user-email="[% u.email FILTER html %]"
49+
data-show-edit="[% user.in_group('editusers') || user.bless_groups.size > 9 ? 'true' : 'false' %]"
4950
title="[% u.identity FILTER html %]"
5051
[% ELSE %]
5152
href="user_profile?user_id=[% u.id FILTER none %]"

‎extensions/BugModal/web/bug_modal.js‎

Lines changed: 100 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -377,7 +377,13 @@ $(function() {
377377
}
378378
});
379379

380-
// action button actions
380+
// action button menu
381+
382+
$.contextMenu({
383+
selector: '#action-menu-btn',
384+
trigger: 'left',
385+
items: $.contextMenu.fromMenu($('#action-menu'))
386+
});
381387

382388
// reset
383389
$('#action-reset')
@@ -1000,6 +1006,99 @@ $(function() {
10001006
BUGZILLA.remaining_time = $('#remaining_time').val();
10011007
});
10021008

1009+
// new bug button
1010+
$.contextMenu({
1011+
selector: '#new-bug-btn',
1012+
trigger: 'left',
1013+
items: [
1014+
{
1015+
name: 'Create a new Bug',
1016+
callback: function() {
1017+
window.open('enter_bug.cgi', '_blank');
1018+
}
1019+
},
1020+
{
1021+
name: '\u2026 in this product',
1022+
callback: function() {
1023+
window.open('enter_bug.cgi?product=' + encodeURIComponent($('#product').val()), '_blank');
1024+
}
1025+
},
1026+
{
1027+
name: '\u2026 in this component',
1028+
callback: function() {
1029+
window.open('enter_bug.cgi?' +
1030+
'product=' + encodeURIComponent($('#product').val()) +
1031+
'&component=' + encodeURIComponent($('#component').val()), '_blank');
1032+
}
1033+
},
1034+
{
1035+
name: '\u2026 that blocks this bug',
1036+
callback: function() {
1037+
window.open('enter_bug.cgi?format=__default__' +
1038+
'&product=' + encodeURIComponent($('#product').val()) +
1039+
'&blocked=' + BUGZILLA.bug_id, '_blank');
1040+
}
1041+
},
1042+
{
1043+
name: '\u2026 that depends on this bug',
1044+
callback: function() {
1045+
window.open('enter_bug.cgi?format=__default__' +
1046+
'&product=' + encodeURIComponent($('#product').val()) +
1047+
'&dependson=' + BUGZILLA.bug_id, '_blank');
1048+
}
1049+
},
1050+
{
1051+
name: '\u2026 as a clone of this bug',
1052+
callback: function() {
1053+
window.open('enter_bug.cgi?format=__default__' +
1054+
'&product=' + encodeURIComponent($('#product').val()) +
1055+
'&cloned_bug_id=' + BUGZILLA.bug_id, '_blank');
1056+
}
1057+
},
1058+
{
1059+
name: '\u2026 as a clone, in a different product',
1060+
callback: function() {
1061+
window.open('enter_bug.cgi?format=__default__' +
1062+
'&cloned_bug_id=' + BUGZILLA.bug_id, '_blank');
1063+
}
1064+
},
1065+
]
1066+
});
1067+
1068+
var format_items = [
1069+
{
1070+
name: 'For Printing',
1071+
callback: function() {
1072+
window.location.href = 'show_bug.cgi?format=multiple&id=' + BUGZILLA.bug_id;
1073+
}
1074+
},
1075+
{
1076+
name: 'XML',
1077+
callback: function() {
1078+
window.location.href = 'show_bug.cgi?ctype=xml&id=' + BUGZILLA.bug_id;
1079+
}
1080+
},
1081+
{
1082+
name: 'Legacy',
1083+
callback: function() {
1084+
window.location.href = 'show_bug.cgi?format=default&id=' + BUGZILLA.bug_id;
1085+
}
1086+
}
1087+
];
1088+
if (!BUGZILLA.bug_secure) {
1089+
format_items.push({
1090+
name: 'JSON',
1091+
callback: function() {
1092+
window.location.href = 'rest/bug/' + BUGZILLA.bug_id;
1093+
}
1094+
});
1095+
}
1096+
$.contextMenu({
1097+
selector: '#format-btn',
1098+
trigger: 'left',
1099+
items: format_items
1100+
});
1101+
10031102
// "reset to default" checkboxes
10041103
$('#product, #component')
10051104
.change(function(event) {

‎extensions/BugModal/web/comments.js‎

Lines changed: 23 additions & 20 deletions
Original file line numberDiff line numberDiff line change
@@ -189,6 +189,12 @@ $(function() {
189189
}
190190
});
191191

192+
$.contextMenu({
193+
selector: '#view-menu-btn',
194+
trigger: 'left',
195+
items: $.contextMenu.fromMenu($('#view-menu'))
196+
});
197+
192198
function updateTagsMenu() {
193199
var tags = [];
194200
$('.comment-tags').each(function() {
@@ -212,24 +218,21 @@ $(function() {
212218
}
213219
btn.show();
214220

215-
// clear out old li items. Always leave the first one (Reset)
216-
var $li = $('#comment-tags-menu li');
217-
for (var i = 1, l = $li.length; i < l; i++) {
218-
$li.eq(i).remove();
219-
}
220-
221-
// add new li items
221+
var menuItems = [
222+
{ name: 'Reset', tag: '' },
223+
"--"
224+
];
222225
$.each(tagNames, function(key, value) {
223-
$('#comment-tags-menu')
224-
.append($('<li role="presentation">')
225-
.append($('<a role="menuitem" tabindex="-1" data-comment-tag="' + value + '">')
226-
.append(value + ' (' + tags[value] + ')')));
226+
menuItems.push({ name: value + ' (' + tags[value] + ')', tag: value });
227227
});
228228

229-
$('a[data-comment-tag]').each(function() {
230-
$(this).click(function() {
231-
var $that = $(this);
232-
var tag = $that.data('comment-tag');
229+
$.contextMenu('destroy', '#comment-tags-btn');
230+
$.contextMenu({
231+
selector: '#comment-tags-btn',
232+
trigger: 'left',
233+
items: menuItems,
234+
callback: function(key, opt) {
235+
var tag = opt.commands[key].tag;
233236
if (tag === '') {
234237
$('.change-spinner:visible').each(function() {
235238
toggleChange($(this), 'reset');
@@ -238,17 +241,17 @@ $(function() {
238241
}
239242
var firstComment = false;
240243
$('.change-spinner:visible').each(function() {
241-
var $that = $(this);
242-
var commentTags = tagsFromDom($that.parents('.comment').find('.comment-tags'));
244+
var that = $(this);
245+
var commentTags = tagsFromDom(that.parents('.comment').find('.comment-tags'));
243246
var hasTag = $.inArrayIn(tag, commentTags) >= 0;
244-
toggleChange($that, hasTag ? 'show' : 'hide');
247+
toggleChange(that, hasTag ? 'show' : 'hide');
245248
if (hasTag && !firstComment) {
246-
firstComment = $that;
249+
firstComment = that;
247250
}
248251
});
249252
if (firstComment)
250253
$.scrollTo(firstComment);
251-
});
254+
}
252255
});
253256
}
254257

0 commit comments

Comments
 (0)