Add aria-labels to XFA form elements. (bug 1723422)

This commit is contained in:
Brendan Dahl 2021-08-03 11:04:45 -07:00
parent 0b95d698d8
commit 6ea56f35ab
2 changed files with 106 additions and 0 deletions

View File

@ -201,6 +201,22 @@ function setTabIndex(node) {
}
}
function ariaLabel(obj) {
if (!obj.assist) {
return null;
}
const assist = obj.assist;
if (assist.speak && assist.speak[$content] !== "") {
return assist.speak[$content];
}
if (assist.toolTip) {
return assist.toolTip[$content];
}
// TODO: support finding the related caption element. See xfa_bug1718037.pdf
// for an example.
return null;
}
function valueToHtml(value) {
return HTMLResult.success({
name: "div",
@ -1231,6 +1247,7 @@ class CheckButton extends XFAObject {
type,
checked,
xfaOn: exportedValue.on,
"aria-label": ariaLabel(field),
},
};
@ -1322,6 +1339,7 @@ class ChoiceList extends XFAObject {
fieldId: field[$uid],
dataId: (field[$data] && field[$data][$uid]) || field[$uid],
style,
"aria-label": ariaLabel(field),
};
if (this.open === "multiSelect") {
@ -1560,6 +1578,7 @@ class DateTimeEdit extends XFAObject {
dataId: (field[$data] && field[$data][$uid]) || field[$uid],
class: ["xfaTextfield"],
style,
"aria-label": ariaLabel(field),
},
};
@ -3684,6 +3703,7 @@ class NumericEdit extends XFAObject {
dataId: (field[$data] && field[$data][$uid]) || field[$uid],
class: ["xfaTextfield"],
style,
"aria-label": ariaLabel(field),
},
};
@ -5649,6 +5669,7 @@ class TextEdit extends XFAObject {
fieldId: field[$uid],
class: ["xfaTextfield"],
style,
"aria-label": ariaLabel(field),
},
};
} else {
@ -5660,6 +5681,7 @@ class TextEdit extends XFAObject {
fieldId: field[$uid],
class: ["xfaTextfield"],
style,
"aria-label": ariaLabel(field),
},
};
}

View File

@ -179,6 +179,90 @@ describe("XFAFactory", function () {
expect(field.attributes.maxLength).toEqual(123);
});
it("should have an aria-label property from speak", function () {
const xml = `
<?xml version="1.0"?>
<xdp:xdp xmlns:xdp="http://ns.adobe.com/xdp/">
<template xmlns="http://www.xfa.org/schema/xfa-template/3.3">
<subform name="root" mergeMode="matchTemplate">
<pageSet>
<pageArea>
<contentArea x="0pt" w="456pt" h="789pt"/>
<medium stock="default" short="456pt" long="789pt"/>
<field y="1pt" w="11pt" h="22pt" x="2pt">
<assist><speak>Screen Reader</speak></assist>
<ui>
<textEdit multiLine="0"/>
</ui>
<value>
<text maxChars="123"/>
</value>
</field>
</pageArea>
</pageSet>
<subform name="first">
<draw w="1pt" h="1pt"><value><text>foo</text></value></draw>
</subform>
</subform>
</template>
<xfa:datasets xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/">
<xfa:data>
</xfa:data>
</xfa:datasets>
</xdp:xdp>
`;
const factory = new XFAFactory({ "xdp:xdp": xml });
expect(factory.numberPages).toEqual(1);
const pages = factory.getPages();
const field = searchHtmlNode(pages, "name", "input");
expect(field.attributes["aria-label"]).toEqual("Screen Reader");
});
it("should have an aria-label property from toolTip", function () {
const xml = `
<?xml version="1.0"?>
<xdp:xdp xmlns:xdp="http://ns.adobe.com/xdp/">
<template xmlns="http://www.xfa.org/schema/xfa-template/3.3">
<subform name="root" mergeMode="matchTemplate">
<pageSet>
<pageArea>
<contentArea x="0pt" w="456pt" h="789pt"/>
<medium stock="default" short="456pt" long="789pt"/>
<field y="1pt" w="11pt" h="22pt" x="2pt">
<assist><toolTip>Screen Reader</toolTip></assist>
<ui>
<textEdit multiLine="0"/>
</ui>
<value>
<text maxChars="123"/>
</value>
</field>
</pageArea>
</pageSet>
<subform name="first">
<draw w="1pt" h="1pt"><value><text>foo</text></value></draw>
</subform>
</subform>
</template>
<xfa:datasets xmlns:xfa="http://www.xfa.org/schema/xfa-data/1.0/">
<xfa:data>
</xfa:data>
</xfa:datasets>
</xdp:xdp>
`;
const factory = new XFAFactory({ "xdp:xdp": xml });
expect(factory.numberPages).toEqual(1);
const pages = factory.getPages();
const field = searchHtmlNode(pages, "name", "input");
expect(field.attributes["aria-label"]).toEqual("Screen Reader");
});
it("should have an input or textarea", function () {
const xml = `
<?xml version="1.0"?>