Skip to content

fix: restore keyboard focus after clearing whitelist#76

Merged
ormidales merged 3 commits into1.0.4from
copilot/fix-focus-loss-after-clear
Mar 5, 2026
Merged

fix: restore keyboard focus after clearing whitelist#76
ormidales merged 3 commits into1.0.4from
copilot/fix-focus-loss-after-clear

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 5, 2026

  • Add document.getElementById("add-domain").focus() after await renderList() in clearDomains in popup.js
  • Validate syntax with node --check
  • Run code review (no blocking issues)
  • Run CodeQL check (0 alerts)
  • Improve focus logic: guard against disabled #add-domain, fall back to #clear-domains, then #status region
Original prompt

This section details on the original issue you should resolve

<issue_title>Perte de focus après le vidage complet de la liste des exceptions</issue_title>
<issue_description>## Contexte
L'interface utilisateur de la popup permet de vider l'intégralité de la liste blanche via le bouton "Vider la liste" (clear-domains), défini dans popup.js.

Problème

Après avoir cliqué sur "Vider la liste" et validé la boîte de dialogue de confirmation, le DOM est mis à jour et la liste est vidée, mais le focus clavier est perdu. Le focus retourne au niveau du body, ce qui rompt la navigation au clavier et dégrade l'accessibilité.

Scénario de Reproduction

  1. Ouvrir la popup avec au moins un domaine enregistré.
  2. Utiliser la touche Tab pour naviguer jusqu'au bouton "Vider la liste".
  3. Appuyer sur Entrée.
  4. Confirmer la boîte de dialogue.
  5. Appuyer à nouveau sur Tab et constater la perte de positionnement logique.

Comportement Attendu

Une fois la liste vidée avec succès, le focus doit être redirigé de manière programmatique vers le premier élément interactif pertinent, comme le bouton "Ajouter le domaine courant".

Pistes Techniques

Fichier concerné : popup.js.
Dans la fonction clearDomains, après l'appel à await renderList(), ajouter une instruction pour cibler le bouton principal :

document.getElementById("add-domain").focus();
```</issue_description>

## Comments on the Issue (you are @copilot in this section)

<comments>
</comments>


💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.

Co-authored-by: ormidales <46538211+ormidales@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix focus loss after clearing exception list fix: restore keyboard focus after clearing whitelist Mar 5, 2026
@ormidales ormidales added this to the v1.0.4 milestone Mar 5, 2026
@ormidales ormidales linked an issue Mar 5, 2026 that may be closed by this pull request
@ormidales ormidales marked this pull request as ready for review March 5, 2026 08:52
Copilot AI review requested due to automatic review settings March 5, 2026 08:52
Copy link
Copy Markdown
Contributor

Copilot AI left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses an accessibility issue in the extension popup where keyboard focus is lost (falls back to body) after clearing the whitelist, by explicitly restoring focus after the list re-renders.

Changes:

  • Update clearDomains in popup.js to focus #add-domain after renderList() completes.

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

Comment thread popup.js Outdated
await browser.storage.sync.set({ [STORAGE_KEY]: [] });
setStatus("Liste blanche vidée.");
await renderList();
document.getElementById("add-domain").focus();
Copy link

Copilot AI Mar 5, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

#add-domain can be disabled when no current domain is detected (initPopup sets addButton.disabled = true). Calling .focus() on a disabled button is a no-op, so focus may still drop to body in exactly the scenarios where accessibility is already degraded (e.g., internal pages). Consider checking add-domain exists and is not disabled before focusing it, and otherwise moving focus to another enabled control (e.g., #clear-domains) or making the status region programmatically focusable as a fallback.

Suggested change
document.getElementById("add-domain").focus();
const addButton = document.getElementById("add-domain");
if (addButton && !addButton.disabled) {
addButton.focus();
} else {
const clearButton = document.getElementById("clear-domains");
if (clearButton && !clearButton.disabled) {
clearButton.focus();
} else {
const statusRegion = document.getElementById("status");
if (statusRegion) {
if (!statusRegion.hasAttribute("tabindex")) {
statusRegion.setAttribute("tabindex", "-1");
}
statusRegion.focus();
}
}
}

Copilot uses AI. Check for mistakes.
@ormidales
Copy link
Copy Markdown
Owner

@copilot apply changes based on the comments in this thread

Co-authored-by: ormidales <46538211+ormidales@users.noreply.github.com>
Copy link
Copy Markdown
Contributor Author

Copilot AI commented Mar 5, 2026

@copilot apply changes based on the comments in this thread

Applied in b914da5. The focus logic in clearDomains now checks #add-domain first (skips it if disabled), falls back to #clear-domains, and finally focuses the #status region (adding tabindex="-1" if needed) so focus is never silently dropped to body.

@ormidales ormidales merged commit 9bc1d1e into 1.0.4 Mar 5, 2026
@ormidales ormidales deleted the copilot/fix-focus-loss-after-clear branch March 5, 2026 09:07
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Perte de focus après le vidage complet de la liste des exceptions

3 participants