Set 'control' attribute for item box fields

Set 'control' to the id of either the value label or the textbox,
depending on whether the field is being edited. This causes NVDA to read
the label associated with the textbox, but seemingly only the first time
it's selected.

Unfortunately NVDA also does some other unpleasant things, like reading
a description from the duplicate-merging pane, which isn't the active
element in the deck, and reading the entire text, including all field
labels, of the item box) I'm not sure how much we can improve this until
we're on Electron.

VoiceOver doesn't read the textbox's label either, even though it does
so in the bookmarks window in Firefox. Maybe things have improved since
Firefox 52, so we can text again after upgrading to Firefox 60.

Addresses #1411
This commit is contained in:
Dan Stillman 2018-04-14 13:25:31 -04:00
parent 0cc3e64b8a
commit 794d3880e7

View file

@ -1274,6 +1274,7 @@
var valueElement = document.createElement("label");
}
valueElement.setAttribute('id', `itembox-field-value-${fieldName}`);
valueElement.setAttribute('fieldname', fieldName);
valueElement.setAttribute('flex', 1);
@ -1429,6 +1430,7 @@
return (async function () {
Zotero.debug(`Showing editor for ${elem.getAttribute('fieldname')}`);
var label = Zotero.getAncestorByTagName(elem, 'row').querySelector('label');
var lastTabIndex = this._lastTabIndex = parseInt(elem.getAttribute('ztabindex'));
// If a field is open, hide it before selecting the new field, which might
@ -1493,6 +1495,7 @@
}
var t = document.createElement("textbox");
t.setAttribute('id', `itembox-field-textbox-${fieldName}`);
t.setAttribute('value', value);
t.setAttribute('fieldname', fieldName);
t.setAttribute('ztabindex', tabindex);
@ -1549,6 +1552,9 @@
var box = elem.parentNode;
box.replaceChild(t, elem);
// Associate textbox with label
label.setAttribute('control', t.getAttribute('id'));
// Prevent error when clicking between a changed field
// and another -- there's probably a better way
if (!t.select) {
@ -1775,6 +1781,7 @@
return (async function () {
Zotero.debug(`Hiding editor for ${textbox.getAttribute('fieldname')}`);
var label = Zotero.getAncestorByTagName(textbox, 'row').querySelector('label');
this._lastTabIndex = -1;
// Prevent autocomplete breakage in Firefox 3
@ -1965,6 +1972,9 @@
var box = textbox.parentNode;
box.replaceChild(elem, textbox);
// Disassociate textbox from label
label.setAttribute('control', elem.getAttribute('id'));
if (this.saveOnEdit) {
await this.item.saveTx();
}