diff --git a/src/static/js/vendors/html10n.ts b/src/static/js/vendors/html10n.ts
index eaec33ddf23..821a4d0771c 100644
--- a/src/static/js/vendors/html10n.ts
+++ b/src/static/js/vendors/html10n.ts
@@ -658,24 +658,28 @@ export class Html10n {
prop = document.body.textContent ? 'textContent' : 'innerText'
}
- // Apply translation
- if (node.children.length === 0 || prop != 'textContent') {
- // @ts-ignore
- node[prop] = str.str!
- // Populate aria-label from the translation so screen readers get a
- // localized accessible name. Preserve an author-supplied aria-label
- // (one present in the template without a marker), but keep our own
- // html10n-generated values in sync across language changes by
- // overwriting them. The `data-l10n-aria-label` marker distinguishes
- // the two: set when we populate it, checked on subsequent passes so
- // `pad.applyLanguage()` refreshes the accessible name.
- // See PR #7584 review feedback.
- const generatedMarker = 'data-l10n-aria-label';
+ // Populate aria-label from the translation so screen readers get a
+ // localized accessible name. Preserve an author-supplied aria-label
+ // (one present in the template without a marker), but keep our own
+ // html10n-generated values in sync across language changes by
+ // overwriting them. The `data-l10n-aria-label` marker distinguishes
+ // the two: set when we populate it, checked on subsequent passes so
+ // `pad.applyLanguage()` refreshes the accessible name.
+ // See PR #7584 review feedback.
+ const generatedMarker = 'data-l10n-aria-label';
+ const populateAriaLabel = () => {
if (!node.hasAttribute('aria-label') ||
node.getAttribute(generatedMarker) === 'true') {
node.setAttribute('aria-label', str.str!);
node.setAttribute(generatedMarker, 'true');
}
+ }
+
+ // Apply translation
+ if (node.children.length === 0 || prop != 'textContent') {
+ // @ts-ignore
+ node[prop] = str.str!
+ populateAriaLabel()
} else {
let children = node.childNodes,
found = false
@@ -693,6 +697,17 @@ export class Html10n {
if (!found) {
console.warn('Unexpected error: could not translate element content for key '+str.id, node)
}
+ // Form-controllable elements (