diff --git a/src/display/editor/draw.js b/src/display/editor/draw.js index 553c5708fd343..3906fc4ee9f6e 100644 --- a/src/display/editor/draw.js +++ b/src/display/editor/draw.js @@ -344,7 +344,9 @@ class DrawingEditor extends AnnotationEditor { this.#mustBeCommitted = false; this.commit(); this.parent.setSelected(this); - this.div.focus(); + if (this.isOnScreen) { + this.div.focus(); + } } } diff --git a/src/display/editor/editor.js b/src/display/editor/editor.js index 095afec3f9f6c..e47388e0a0fc3 100644 --- a/src/display/editor/editor.js +++ b/src/display/editor/editor.js @@ -1402,6 +1402,12 @@ class AnnotationEditor { return this.div && !this.isAttachedToDOM; } + get isOnScreen() { + const { top, left, bottom, right } = this.getClientDimensions(); + const { innerHeight, innerWidth } = window; + return left < innerWidth && right > 0 && top < innerHeight && bottom > 0; + } + #addFocusListeners() { if (this.#focusAC || !this.div) { return; diff --git a/test/integration/ink_editor_spec.mjs b/test/integration/ink_editor_spec.mjs index 3375b58463502..01ba30fcd85b0 100644 --- a/test/integration/ink_editor_spec.mjs +++ b/test/integration/ink_editor_spec.mjs @@ -612,4 +612,61 @@ describe("Ink Editor", () => { ); }); }); + + describe("Annotation mustn't take focus if it isn't visible", () => { + let pages; + + beforeAll(async () => { + pages = await loadAndWait("tracemonkey.pdf", ".annotationEditorLayer"); + }); + + afterAll(async () => { + await closePages(pages); + }); + + it("must check that the focus isn't taken", async () => { + await Promise.all( + pages.map(async ([browserName, page]) => { + await switchToInk(page); + + const rect = await getRect(page, ".annotationEditorLayer"); + + const x = rect.x + 20; + const y = rect.y + 20; + const clickHandle = await waitForPointerUp(page); + await page.mouse.move(x, y); + await page.mouse.down(); + await page.mouse.move(x + 50, y + 50); + await page.mouse.up(); + await awaitPromise(clickHandle); + + await page.evaluate(() => { + window.focusedIds = []; + window.focusCallback = e => { + window.focusedIds.push(e.target.id); + }; + window.addEventListener("focusin", window.focusCallback); + }); + + const oneToFourteen = Array.from(new Array(13).keys(), n => n + 2); + for (const pageNumber of oneToFourteen) { + await scrollIntoView( + page, + `.page[data-page-number = "${pageNumber}"]` + ); + } + + const ids = await page.evaluate(() => { + const { focusedIds, focusCallback } = window; + window.removeEventListener("focusin", focusCallback); + delete window.focusCallback; + delete window.focusedIds; + return focusedIds; + }); + + expect(ids).withContext(`In ${browserName}`).toEqual([]); + }) + ); + }); + }); });