Only focus elements that are already in view

And don't scroll when focusing.
zotero · Nov 14, 2024 · ba12e22 · ba12e22
1 parent 347d615
commit ba12e22
Show file tree

Hide file tree

Showing 2 changed files with 13 additions and 6 deletions.
diff --git a/src/dom/common/dom-view.tsx b/src/dom/common/dom-view.tsx
@@ -745,6 +745,9 @@ abstract class DOMView<State extends DOMViewState, Data> {
 			...this._iframeDocument.querySelectorAll('a, area'),
 			...this._annotationShadowRoot.querySelectorAll('[tabindex="-1"]')
 		] as (HTMLElement | SVGElement)[];
+		focusableElements = focusableElements.filter(
+			el => isPageRectVisible(getBoundingPageRect(el), this._iframeWindow, 0)
+		);
 		focusableElements.sort((a, b) => {
 			let rangeA;
 			if (a.getRootNode() === this._annotationShadowRoot && a.hasAttribute('data-annotation-id')) {
@@ -801,7 +804,7 @@ abstract class DOMView<State extends DOMViewState, Data> {
 			if (!focusedElement) {
 				// In PDF view the first visible object (annotation, overlay) is focused
 				if (focusableElements.length) {
-					focusableElements[0].focus();
+					focusableElements[0].focus({ preventScroll: true });
 				}
 				else {
 					this._options.onTabOut();
@@ -816,12 +819,14 @@ abstract class DOMView<State extends DOMViewState, Data> {
 
 		if (focusedElement) {
 			if (!window.rtl && key === 'ArrowRight' || window.rtl && key === 'ArrowLeft' || key === 'ArrowDown') {
-				focusableElements[(focusedElementIndex + 1) % focusableElements.length]?.focus();
+				focusableElements[(focusedElementIndex + 1) % focusableElements.length]
+					?.focus({ preventScroll: true });
 				event.preventDefault();
 				return;
 			}
 			else if (!window.rtl && key === 'ArrowLeft' || window.rtl && key === 'ArrowRight' || key === 'ArrowUp') {
-				focusableElements[(focusedElementIndex - 1 + focusableElements.length) % focusableElements.length]?.focus();
+				focusableElements[(focusedElementIndex - 1 + focusableElements.length) % focusableElements.length]
+					?.focus({ preventScroll: true });
 				event.preventDefault();
 				return;
 			}

diff --git a/src/dom/common/lib/range.ts b/src/dom/common/lib/range.ts
@@ -207,9 +207,11 @@ export function getStartElement(range: Range | PersistentRange): Element | null
 	return startContainer as Element | null;
 }
 
-export function getBoundingPageRect(range: Range) {
-	let rect = range.getBoundingClientRect();
-	let win = range.commonAncestorContainer.ownerDocument?.defaultView;
+export function getBoundingPageRect(rangeOrElem: Range | Element) {
+	let rect = rangeOrElem.getBoundingClientRect();
+	let win = ('ownerDocument' in rangeOrElem
+		? rangeOrElem.ownerDocument
+		: rangeOrElem.commonAncestorContainer.ownerDocument)?.defaultView;
 	rect.x += win?.scrollX ?? 0;
 	rect.y += win?.scrollY ?? 0;
 	return rect;