Skip to content

fix(a11y): restore keyboard focus after addCurrentDomain#90

Merged
ormidales merged 2 commits into1.0.5from
copilot/fix-accessibility-focus-loss
Mar 7, 2026
Merged

fix(a11y): restore keyboard focus after addCurrentDomain#90
ormidales merged 2 commits into1.0.5from
copilot/fix-accessibility-focus-loss

Conversation

Copy link
Copy Markdown
Contributor

Copilot AI commented Mar 7, 2026

Disabling the "Add" button at the start of addCurrentDomain immediately drops browser focus to the top of the DOM, breaking keyboard navigation and screen readers.

Changes

  • popup.jsaddCurrentDomain finally block: after re-enabling the button, programmatically move focus to #status, which always holds a meaningful message (success or error) at that point
} finally {
  isAddingDomain = false;
  if (addButton) addButton.disabled = false;
  const statusElement = document.getElementById("status");
  if (statusElement) {
    if (!statusElement.hasAttribute("tabindex")) {
      statusElement.setAttribute("tabindex", "-1");
    }
    statusElement.focus();
  }
}

Placing the logic in finally ensures all exit paths — success, duplicate, no-domain, storage error — restore focus consistently. Pattern mirrors existing focus management in clearDomains.

Original prompt

This section details on the original issue you should resolve

<issue_title>Corriger la perte de focus d'accessibilité après un ajout de domaine</issue_title>
<issue_description>## Contexte
Dans la fenêtre de la popup, l'utilisateur a la possibilité d'ajouter le nom de domaine de l'onglet actif dans la liste blanche.

Problème

Lorsque la fonction addCurrentDomain se termine avec succès dans popup.js, elle peut déclencher des modifications d'interface qui rendent le bouton "Ajouter" inactif (disabled) ou masqué. Lorsqu'un élément actif (avec le focus) devient disabled, le navigateur perd le repère de focus clavier, renvoyant l'utilisateur en haut du DOM et brisant la navigation pour les lecteurs d'écran.

Scénario de Reproduction

  1. Ouvrir la popup sur un site non répertorié.
  2. Utiliser la touche Tab pour naviguer jusqu'au bouton "Ajouter le domaine courant".
  3. Appuyer sur Entrée ou Espace.
  4. Essayer de tabuler à nouveau : le flux de navigation est cassé.

Comportement Attendu

Après une action réussie désactivant l'élément courant, le focus doit être programmatiquement transféré vers un élément logique suivant, comme le statut de confirmation ou le bouton de suppression de la liste.

Pistes Techniques

Fichier popup.js, fonction addCurrentDomain.
À la fin du succès de l'ajout, déplacer le focus :

const statusElement = document.getElementById("status");
if (statusElement) {
  statusElement.setAttribute("tabindex", "-1");
  statusElement.focus();
}

Environnement

Interface Popup UI, Accessibilité (a11y).</issue_description>

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


✨ Let Copilot coding agent set things up for you — coding agent works faster and does higher quality work when set up for your repo.

…lock

Co-authored-by: ormidales <46538211+ormidales@users.noreply.github.com>
Copilot AI changed the title [WIP] Fix accessibility focus loss after adding domain fix(a11y): restore keyboard focus after addCurrentDomain Mar 7, 2026
@ormidales ormidales added this to the v1.0.5 milestone Mar 7, 2026
@ormidales ormidales linked an issue Mar 7, 2026 that may be closed by this pull request
@ormidales ormidales marked this pull request as ready for review March 7, 2026 11:54
Copilot AI review requested due to automatic review settings March 7, 2026 11:54
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 regression in the popup UI where disabling the “Add” button during addCurrentDomain can cause keyboard focus to be lost, disrupting keyboard navigation and screen reader flow.

Changes:

  • Restores a predictable focus target after addCurrentDomain completes by focusing the #status element in the finally block.
  • Ensures #status is programmatically focusable by adding tabindex="-1" when missing.

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

@ormidales ormidales merged commit c1b48e0 into 1.0.5 Mar 7, 2026
4 checks passed
@ormidales ormidales deleted the copilot/fix-accessibility-focus-loss branch March 7, 2026 11:56
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.

Corriger la perte de focus d'accessibilité après un ajout de domaine

3 participants