Tutoriel
Comment tester une regex sans rien installer
Vous avez écrit un motif et vous devez savoir s'il correspond vraiment à ce que vous attendez avant de l'intégrer dans votre code. Installer un logiciel de bureau ou coller un journal privé dans un site quelconque est excessif, et souvent risqué. Ce guide montre comment exécuter une regex sur votre propre texte directement dans le navigateur, activer les drapeaux qui changent son comportement, lire les groupes de capture qu'elle extrait et voir les correspondances se surligner en ligne, sans que le motif ni le texte ne quittent jamais votre onglet.
Pas à pas
- Ouvrez le testeur de regex et saisissez votre motif dans le champ situé entre les deux barres obliques. Vous n'écrivez pas les barres vous-même : l'outil les affiche pour que vous voyiez le motif tel qu'un moteur le lit. Collez votre texte d'exemple dans la zone du dessous, par exemple quelques lignes de journal, une liste d'adresses e-mail ou un bloc de code que vous voulez parcourir.
- Réglez les drapeaux dans la petite case à côté du motif. Le drapeau g trouve toutes les correspondances au lieu de s'arrêter à la première ; i rend la correspondance insensible à la casse ; m permet aux ancres ^ et $ de correspondre au début et à la fin de chaque ligne plutôt qu'au texte entier ; s permet au point de correspondre aussi aux sauts de ligne. Combinez-les librement, par exemple gim.
- Appuyez sur Tester. Chaque correspondance est surlignée directement dans votre texte, et la liste du dessous montre chaque correspondance avec sa position et la valeur de chaque groupe de capture. Ajustez le motif et relancez-le : l'aperçu se met à jour pour que vous puissiez affiner le motif jusqu'à ce qu'il capte exactement ce que vous vouliez et rien d'autre.
Groupes de capture, nommés et numérotés
Un groupe de capture est la partie de votre motif entourée de parenthèses, et c'est ainsi que vous extrayez un morceau de chaque correspondance au lieu de simplement confirmer que l'ensemble correspond. Les groupes numérotés sont comptés de gauche à droite selon leur parenthèse ouvrante : dans (\d{4})-(\d{2})-(\d{2}), le groupe 1 est l'année, le groupe 2 le mois, le groupe 3 le jour. Les groupes nommés utilisent la syntaxe (?<name>...), si bien que (?<year>\d{4}) se lit bien mieux qu'un simple numéro quand le motif s'allonge. Si vous voulez seulement regrouper sans capturer, par exemple pour appliquer un quantificateur à plusieurs caractères, utilisez un groupe non capturant (?:...) afin qu'il n'encombre pas votre liste de résultats. Le testeur affiche la valeur de chaque groupe pour chaque correspondance, ce qui est le moyen le plus rapide de confirmer que vous extrayez bien la bonne portion.
Quand un motif se bloque ou se comporte mal
Deux problèmes reviennent sans cesse. Le premier est le retour arrière catastrophique : un motif comme (a+)+$ exécuté sur une longue chaîne sans correspondance peut amener le moteur à essayer un nombre exponentiel de chemins et à se figer. Le testeur exécute chaque test dans un Web Worker doté d'un chien de garde court, donc au lieu d'un onglet bloqué vous obtenez un message clair et pouvez simplifier le motif, en général en rendant un quantificateur possessif dans l'esprit, en l'ancrant, ou en évitant la répétition imbriquée. Le second est la correspondance gourmande contre paresseuse : par défaut, .* attrape autant qu'il peut, donc pour faire correspondre le contenu d'une seule balise HTML vous voulez plutôt la forme paresseuse .*?. Si vous comparez deux versions légèrement différentes d'une chaîne pour voir ce que votre motif devrait cibler, l'outil de différence de texte les aligne afin que l'écart soit évident avant que vous n'écriviez l'expression.
Comment le navigateur évalue votre regex
Les navigateurs modernes embarquent un moteur regex ECMAScript qui prend en charge l'ensemble des indicateurs : insensibilité à la casse (i), mode multiligne (m), dotAll (s), Unicode (u) et l'indicateur collant (y). Lorsque vous saisissez un motif dans le testeur, le moteur le compile en un NFA interne et l'évalue sur votre chaîne de test en temps réel, en signalant chaque position de correspondance et les groupes de capture. Le retour arrière (backtracking) s'exécute localement sur votre processeur : un motif tel que (a+)+ sur une longue chaîne sans correspondance peut tourner plusieurs secondes, et observer ce blocage dans le navigateur est un signal utile avant de déployer le motif en production. Aucun texte ne quitte la page, vous pouvez donc coller des échantillons de journaux ou n'importe quelle entrée sans les faire transiter par un serveur tiers.
Les outils utilisés dans ce guide
Questions fréquentes
Mon motif ou mon texte de test sont-ils envoyés à un serveur ?
Non. La regex s'exécute dans un Web Worker au sein de votre propre navigateur, donc le motif et le texte que vous testez restent dans l'onglet. C'est important car le texte que vous collez est souvent un vrai journal, une liste de clients ou une configuration interne, exactement le genre de données que vous ne voulez pas voir sur le serveur de quelqu'un d'autre. Ouvrez le panneau Réseau de vos outils de développement pendant que vous appuyez sur Tester et vous ne verrez aucune requête emporter votre texte. L'outil continue aussi de fonctionner hors ligne une fois la page chargée.
Quelle variante de regex le testeur utilise-t-il ?
Il utilise le moteur d'expressions régulières JavaScript intégré à votre navigateur, le même qui tourne dans Node.js et dans n'importe quelle page web. Cela couvre la syntaxe courante : classes de caractères, quantificateurs, ancres, alternance, groupes de capture numérotés et nommés, recherche en avant et en arrière. Quelques fonctionnalités d'autres variantes, comme la récursion à la Perl ou les quantificateurs possessifs, ne font pas partie du moteur JavaScript, donc si un motif copié d'un projet PHP ou Python se comporte différemment, cette différence de variante en est généralement la cause.