mirrors/zotero
2
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

vpat 51: add aria labels to advanced search (#3987)

Browse source 
In addition, make toolbarbuttons explicitly focusable
and make them clickable on space/Enter.
This commit is contained in:
abaevbog 2024-06-05 23:54:54 -05:00 • committed by GitHub
parent 5a45717270
commit a81701d7e7
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 35 additions and 7 deletions
Download patch file Download diff file Expand all files Collapse all files

28
chrome/content/zotero/elements/zoteroSearch.js
View file

@ -40,15 +40,15 @@
<vbox xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul" <vbox xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"
id="search-box" flex="1" onkeypress="this.closest('zoterosearch').handleKeyPress(event)"> id="search-box" flex="1" onkeypress="this.closest('zoterosearch').handleKeyPress(event)">
<hbox align="center"> <hbox align="center">
<label value="&zotero.search.searchInLibrary;" control="libraryMenu"/> <label id="libraryMenu-label" value="&zotero.search.searchInLibrary;" control="libraryMenu"/>
<menulist id="libraryMenu" oncommand="this.closest('zoterosearch').updateLibrary();" native="true"> <menulist id="libraryMenu" aria-labelledby="libraryMenu-label" oncommand="this.closest('zoterosearch').updateLibrary();" native="true">
<menupopup/> <menupopup/>
</menulist> </menulist>
</hbox> </hbox>
<groupbox> <groupbox>
<caption align="center"> <caption align="center">
<label value="&zotero.search.joinMode.prefix;"/> <label id="joinModeMenu-label" value="&zotero.search.joinMode.prefix;"/>
<menulist id="joinModeMenu" oncommand="this.closest('zoterosearch').updateJoinMode();" native="true"> <menulist id="joinModeMenu" aria-labelledby="joinModeMenu-label" oncommand="this.closest('zoterosearch').updateJoinMode();" native="true">
<menupopup> <menupopup>
<menuitem label="&zotero.search.joinMode.any;" value="any"/> <menuitem label="&zotero.search.joinMode.any;" value="any"/>
<menuitem label="&zotero.search.joinMode.all;" value="all" selected="true"/> <menuitem label="&zotero.search.joinMode.all;" value="all" selected="true"/>
@ -203,6 +203,11 @@
} }
handleKeyPress(event) { handleKeyPress(event) {
// Space/Enter on toolbarbutton will click it
if (event.target.tagName == "toolbarbutton" && [" ", "Enter"].includes(event.key)) {
event.target.click();
return;
}
switch (event.keyCode) { switch (event.keyCode) {
case event.DOM_VK_RETURN: case event.DOM_VK_RETURN:
this.active = true; this.active = true;
@ -239,8 +244,8 @@
<menupopup/> <menupopup/>
</menulist> </menulist>
<zoterosearchagefield id="value-date-age" class="value-date-age" hidden="true"/> <zoterosearchagefield id="value-date-age" class="value-date-age" hidden="true"/>
<toolbarbutton id="remove" class="zotero-clicky zotero-clicky-minus" value="-" onclick="this.closest('zoterosearchcondition').onRemoveClicked(event)"/> <toolbarbutton id="remove" tabindex="0" data-l10n-id="advanced-search-remove-btn" class="zotero-clicky zotero-clicky-minus" value="-" onclick="this.closest('zoterosearchcondition').onRemoveClicked(event)"/>
<toolbarbutton id="add" class="zotero-clicky zotero-clicky-plus" value="+" onclick="this.closest('zoterosearchcondition').onAddClicked(event)"/> <toolbarbutton id="add" tabindex="0" data-l10n-id="advanced-search-add-btn" class="zotero-clicky zotero-clicky-plus" value="+" onclick="this.closest('zoterosearchcondition').onAddClicked(event)"/>
</html:div> </html:div>
`, ['chrome://zotero/locale/zotero.dtd', 'chrome://zotero/locale/searchbox.dtd']); `, ['chrome://zotero/locale/zotero.dtd', 'chrome://zotero/locale/searchbox.dtd']);
@ -541,6 +546,13 @@
this.querySelector('#valuemenu').hidden = true; this.querySelector('#valuemenu').hidden = true;
this.querySelector('#value-date-age').hidden = true; this.querySelector('#value-date-age').hidden = true;
} }
var conditionsMenu = this.querySelector('#conditionsmenu');
document.l10n.setAttributes(conditionsMenu, 'advanced-search-conditions-menu', { label: conditionsMenu.label });
document.l10n.setAttributes(operatorsList, 'advanced-search-operators-menu', { label: operatorsList.label });
var valueMenu = this.querySelector("#valuemenu");
if (!valueMenu.hidden) {
document.l10n.setAttributes(valueMenu, 'advanced-search-condition-input', { label: valueMenu.label });
}
} }
createValueMenu(rows) { createValueMenu(rows) {
@ -778,7 +790,9 @@
autocompletesearch="zotero" autocompletesearch="zotero"
autocompletepopup="search-autocomplete-popup" autocompletepopup="search-autocomplete-popup"
timeout="250" timeout="250"
type="search"/> type="search"
data-l10n-id="advanced-search-condition-input"
/>
<xul:toolbarbutton <xul:toolbarbutton
id="textbox-button" id="textbox-button"

14
chrome/locale/en-US/zotero/zotero.ftl
View file

@ -529,3 +529,17 @@ first-run-guidance-quickFormat = Type a title, author, and/or year to search for
You can also add a page number directly by including it with your search terms or typing it after the bubble and pressing { return-or-enter }. You can also add a page number directly by including it with your search terms or typing it after the bubble and pressing { return-or-enter }.
first-run-guidance-authorMenu = { -app-name } lets you specify editors and translators too. You can turn an author into an editor or translator by selecting from this menu. first-run-guidance-authorMenu = { -app-name } lets you specify editors and translators too. You can turn an author into an editor or translator by selecting from this menu.
advanced-search-remove-btn =
.tooltiptext = { general-remove }
advanced-search-add-btn =
.tooltiptext = { general-add }
advanced-search-conditions-menu =
.aria-label = Search condition
.label = { $label }
advanced-search-operators-menu =
.aria-label = Operator
.label = { $label }
advanced-search-condition-input =
.aria-label = Value
.label = { $label }