Chrome Extension - first link is auto-focused in popup

Question

How do I stop my Google Chrome extension\'s default action to auto-focus the first link in my popup.html? I know I could probably do some roundabout hack with JS o

Answer 1

This is the best solution to the problem. The tabindex="-1" solution harms user experience, and as opposed to @link0ff's solution, this one removes the focus instantly.

This element should be the first focusable element in the DOM:

This simply removes the button once it's been focused:

function removeAutoFocus(e) {
    if (e.target.classList.contains("invisible-button")) {
        e.target.style.display = "none";
        document.removeEventListener("focus", removeAutoFocus);
    }
}
document.addEventListener("focus", removeAutoFocus, true);