From 35da1187b3d0a72684a098b22bf276cbf6e26254 Mon Sep 17 00:00:00 2001
From: abaevbog <bogdan@zotero.org>
Date: Wed, 7 Aug 2024 21:24:19 -0700
Subject: [PATCH] prefs: fix text-link not clicking on space/enter (#4522)

Fix regression after 117197e11d1e92e9d5eea5c4a3369c61fd5e65cc
where space or enter would not trigger a click on
link outside of the main window.

".keyboard-clickable" is handled by listener in ZoteroPane,
so links outside of it (e.g. preferences) are not affected by it.
For now, just explicitly handle "keypress" event by the
zotero-text-link component.

Also, added a focus-ring around the link so it is visible
when it is focused.

Fixes: #4521
---
 chrome/content/zotero/elements/textLink.js | 7 ++++++-
 scss/components/_textLink.scss             | 1 +
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/chrome/content/zotero/elements/textLink.js b/chrome/content/zotero/elements/textLink.js
index ecf6ad7669..86d4831a25 100644
--- a/chrome/content/zotero/elements/textLink.js
+++ b/chrome/content/zotero/elements/textLink.js
@@ -9,11 +9,16 @@
 					this.open(event);
 				}
 			}, true);
+			this.addEventListener('keypress', (event) => {
+				if (event.key == 'Enter' || event.key == ' ') {
+					event.preventDefault();
+					this.click();
+				}
+			});
 		}
 
 		connectedCallback() {
 			this.classList.add('zotero-text-link');
-			this.classList.add('keyboard-clickable');
 			this.setAttribute('role', 'link');
 		}
 
diff --git a/scss/components/_textLink.scss b/scss/components/_textLink.scss
index 39ba2263aa..4ff1509124 100644
--- a/scss/components/_textLink.scss
+++ b/scss/components/_textLink.scss
@@ -4,4 +4,5 @@
 	text-decoration: underline;
 	border: var(--material-border-transparent);
 	cursor: pointer;
+	@include focus-ring;
 }