1
0
Fork 0
mirror of https://github.com/mozilla/pdf.js.git synced 2025-04-19 22:58:07 +02:00

[Editor] Make the focused stamp annotation more clear from a screen reader point of view (bug 1911994)

It has been tested with Voice Over (mac) and with NVDA (windows).

When an added stamp annotation is focused, the screen reader will announce
that it's a figure containing a graphic with the added alt-text.
This commit is contained in:
Calixte Denizet 2024-08-29 18:16:21 +02:00
parent a41cd38387
commit 843fde3b13
4 changed files with 18 additions and 3 deletions

View file

@ -279,8 +279,7 @@ class AltText {
this.#altTextTooltip = tooltip = document.createElement("span");
tooltip.className = "tooltip";
tooltip.setAttribute("role", "tooltip");
const id = (tooltip.id = `alt-text-tooltip-${this.#editor.id}`);
button.setAttribute("aria-describedby", id);
tooltip.id = `alt-text-tooltip-${this.#editor.id}`;
const DELAY_TO_SHOW_TOOLTIP = 100;
const signal = this.#editor._uiManager._signal;

View file

@ -993,6 +993,15 @@ class AnnotationEditor {
this.#altText?.destroy();
}
addContainer(container) {
const editToolbarDiv = this._editToolbar?.div;
if (editToolbarDiv) {
editToolbarDiv.before(container);
} else {
this.div.append(container);
}
}
getClientDimensions() {
return this.div.getBoundingClientRect();
}

View file

@ -373,6 +373,7 @@ class StampEditor extends AnnotationEditor {
super.render();
this.div.hidden = true;
this.div.setAttribute("role", "figure");
this.addAltTextButton();
@ -425,7 +426,9 @@ class StampEditor extends AnnotationEditor {
this._uiManager.enableWaiting(false);
const canvas = (this.#canvas = document.createElement("canvas"));
div.append(canvas);
canvas.setAttribute("role", "img");
this.addContainer(canvas);
if (
!this._uiManager.useNewAltTextWhenAddingImage ||
!this._uiManager.useNewAltTextFlow

View file

@ -62,6 +62,10 @@ class EditorToolbar {
return editToolbar;
}
get div() {
return this.#toolbar;
}
static #pointerDown(e) {
e.stopPropagation();
}