feat: press in-game keys based on keyboard events

src/content.ts

@@ -1,14 +1,13 @@
 import { State, STORAGE_KEY } from "./types";
 
-const KEY_BINDINGS: Record<string, string> = {
-    // TODO
-};
-
 let enabled = false;
 
-const clickButton = (selector: string): void => {
-    const el = document.querySelector<HTMLElement>(selector);
-    el?.click();
+const findButtonForKey = (key: string): HTMLElement | null => {
+    if (key.length !== 1 || !/[a-zA-Z]/.test(key)) return null;
+    const letter = key.toUpperCase();
+    const label = Array.from(document.querySelectorAll<HTMLElement>("div[dir=\"auto\"]"))
+        .find(el => el.textContent === letter);
+    return label?.closest<HTMLElement>("[tabindex=\"0\"]") ?? null;
 };
 
 const onKeyDown = (event: KeyboardEvent): void => {
@@ -21,10 +20,15 @@ const onKeyDown = (event: KeyboardEvent): void => {
         target.isContentEditable
     ) return;
 
-    const selector = KEY_BINDINGS[event.code];
-    if (selector) {
+    const btn = findButtonForKey(event.key);
+    if (btn) {
         event.preventDefault();
-        clickButton(selector);
+        const rect = btn.getBoundingClientRect();
+        chrome.runtime.sendMessage({
+            type: "simulate-click",
+            x: rect.left + rect.width / 2,
+            y: rect.top + rect.height / 2,
+        });
     }
 };
 
@@ -33,7 +37,7 @@ const init = async (): Promise<void> => {
     const state = result[STORAGE_KEY] as State | undefined;
     enabled = state?.enabled ?? true;
 
-    document.addEventListener("keydown", onKeyDown);
+    document.addEventListener("keydown", onKeyDown, { capture: true });
 
     chrome.storage.onChanged.addListener((changes) => {
         if (STORAGE_KEY in changes) {