1
0
Fork 0
mirror of https://github.com/mozilla/pdf.js.git synced 2025-04-19 14:48:08 +02:00

[Editor] Remove the mark from the highlight element and set its role to mark (bug 1889623)

Set aria-label to the highlighted text, this way the focus frame is exactly set
on the highlight element and the higlighted text is read.
This commit is contained in:
Calixte Denizet 2024-04-04 15:12:03 +02:00
parent 25f6a0c139
commit 54110de109
2 changed files with 2 additions and 46 deletions

View file

@ -562,11 +562,8 @@ class HighlightEditor extends AnnotationEditor {
const div = super.render();
if (this.#text) {
const mark = document.createElement("mark");
div.append(mark);
mark.append(document.createTextNode(this.#text));
// The text is invisible but it's still visible by a screen reader.
mark.className = "visuallyHidden";
div.setAttribute("aria-label", this.#text);
div.setAttribute("role", "mark");
}
if (this.#isFreeHighlight) {
div.classList.add("free");

View file

@ -1608,47 +1608,6 @@ describe("Highlight Editor", () => {
});
});
describe("Text inside mark element", () => {
let pages;
beforeAll(async () => {
pages = await loadAndWait("tracemonkey.pdf", ".annotationEditorLayer");
});
afterAll(async () => {
await closePages(pages);
});
it("must have null dimensions", async () => {
await Promise.all(
pages.map(async ([browserName, page]) => {
await page.click("#editorHighlight");
await page.waitForSelector(".annotationEditorLayer.highlightEditing");
const rect = await getSpanRectFromText(page, 1, "Abstract");
const x = rect.x + rect.width / 2;
const y = rect.y + rect.height / 2;
await page.mouse.click(x, y, { count: 2, delay: 100 });
await page.waitForSelector(getEditorSelector(0));
const [w, h] = await page.evaluate(
sel => {
const mark = document.querySelector(sel);
const range = document.createRange();
range.selectNodeContents(mark);
const { width, height } = range.getClientRects()[0];
return [width, height];
},
`${getEditorSelector(0)} mark`
);
expect(w).withContext(`In ${browserName}`).toEqual(0);
expect(h).withContext(`In ${browserName}`).toEqual(0);
})
);
});
});
describe("Undo a highlight", () => {
let pages;