Testez des motifs en direct avec le testeur d'expressions régulières — indices de correspondance, groupes et drapeaux, tout dans votre navigateur.
Pourquoi tester les regex dans le navigateur
Les regex apparaissent dans la validation de saisie, l'analyse de journaux et les pipelines CI. Quand l'une d'elles se comporte mal, le moyen le plus rapide de la comprendre est de voir les correspondances sur une entrée réelle.
Les outils regex en ligne envoient votre motif et votre texte de test à leurs serveurs. Pour des journaux, configurations ou fixtures de test contenant des valeurs sensibles, c'est une fuite inutile. Un testeur côté client exécute la même engine RegExp JavaScript localement.
Le testeur de cette page utilise l'engine RegExp native, donc ce que vous voyez est exactement ce que Node.js et le navigateur feront.
Les drapeaux qui changent tout
Les drapeaux modifient la sémantique du matching de façons faciles à négliger :
g renvoie toutes les correspondances au lieu de la première. i ignore la casse. m fait matcher ^ et $ aux limites de ligne. s laisse . matcher les sauts de ligne. u active le matching conscient de l'Unicode, donc \p{L} et les caractères astraux se comportent correctement.
Le bug classique « ça marche ici, ça échoue là » est généralement un drapeau m ou u manquant, ou un g oublié quand le code attend toutes les correspondances.
- g : trouver chaque correspondance, pas seulement la première
- i : matching insensible à la casse
- m : ^ et $ matchent au début et à la fin de chaque ligne
- s : le point matche les caractères de saut de ligne
- u : mode Unicode pour les propriétés \p{...} et les points de code astraux
Groupes : capturez ce dont vous avez réellement besoin
Les parenthèses capturent des groupes pour une utilisation ultérieure. Les groupes numérotés sont attribués dans l'ordre ; les groupes nommés comme (?<year>\d{4}) rendent l'extraction lisible.
Les groupes non capturants (?:...) regroupent sans capturer. Utilisez-les quand vous n'avez besoin que d'alternation ou de quantificateurs appliqués à un bloc, pour éviter de décaler les numéros de groupes.
Le testeur affiche chaque groupe par correspondance, nommé ou numéroté, pour vérifier l'extraction avant de l'écrire dans du code.
Lookarounds et ancres
Le lookahead (?=...) affirme ce qui suit sans le consommer ; le lookahead négatif (?!...) affirme ce qui ne suit pas. Le lookbehind (?<=...) et le lookbehind négatif (?<!...) font de même pour ce qui précède la correspondance.
Les ancres ^ et $ épinglent la correspondance à la chaîne (ou à la ligne, avec m). La frontière de mot \b matche entre un caractère de mot et un caractère hors mot.
Gardez les lookarounds simples. Les lookarounds imbriqués et les alternations lourdes à l'intérieur rendent les motifs illisibles et lents.
Avertissement: Sur une entrée non fiable, évitez les quantificateurs imbriqués comme (a+)+ ou les motifs à alternation ambiguë. Ils peuvent déclencher un backtracking catastrophique et geler votre application.
Un flux de travail regex sûr
- Ouvrez le testeur d'expressions régulières dans votre navigateur.
- Collez le motif et sélectionnez les drapeaux utilisés par votre environnement d'exécution.
- Ajoutez un petit échantillon représentant l'entrée réelle, y compris les cas limites.
- Lisez les correspondances et groupes ; si l'extraction est fausse, corrigez le motif avant de toucher au code.
- Copiez le motif vérifié dans votre code et conservez les mêmes drapeaux.
FAQ
Q.Mon motif est-il envoyé quand je le teste ?
A.Non. Le testeur s'exécute entièrement dans votre navigateur avec l'engine RegExp native. Votre motif et votre texte de test ne quittent jamais votre appareil.
Q.Quelle variante de regex cet outil utilise-t-il ?
A.Le RegExp natif de JavaScript, la même engine que Node.js et les navigateurs modernes. Si votre code s'exécute sur cette engine, le comportement correspond exactement.
Q.Pourquoi mon motif se bloque-t-il ou est-il lent ?
A.Un backtracking catastrophique, généralement dû à des quantificateurs imbriqués comme (a+)+ ou de longues alternations appliquées à de grandes entrées. Simplifiez le motif, ajoutez des ancres et testez avec des tailles d'entrée réalistes.
Q.Comment matcher des caractères non ASCII ?
A.Utilisez le drapeau u et les échappements de propriétés Unicode comme \p{L} pour les lettres ou \p{Script=Greek}. Sans u, JS traite le motif en unités de code UTF-16 et les caractères astraux peuvent casser le matching.
Références
Ce guide s'appuie sur la spécification du langage JavaScript et la pratique courante des regex :
- MDN – Expressions régulières : https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Regular_expressions
- Spécification du langage ECMAScript – RegExp : https://tc39.es/ecma262/#sec-regexp-regular-expression-objects
- OWASP – ReDoS (Regular Expression Denial of Service) : https://owasp.org/www-community/attacks/Regular_expression_Denial_of_Service_-_ReDoS
Testez un motif maintenant
Correspondances en direct, indices et groupes — entièrement dans votre navigateur.
Lisez les correspondances avant de réécrire le motif
La plupart des bugs de regex sont visibles dans la sortie : un drapeau manquant, un quantificateur gourmand en trop ou un groupe à la mauvaise position. Tester localement montre tout cela sans fuiter votre entrée.
Passez vos motifs par le testeur d'expressions régulières, gardez des drapeaux identiques dans le code et testez les cas limites avant le déploiement.
Articles liés
Minifieur CSS : réduire les feuilles de style
Le CSS est surtout composé d'espaces et de commentaires en poids. Un minifieur supprime les deux — et un bon sait exactement ce qui doit survivre.
Décodeur de certificat : lire X.509
Chaque poignée de main TLS commence par un certificat. Décodez les champs qui comptent : sujet, émetteur, validité, clé publique et empreintes — localement.
Paires de clés RSA : générer des PEM
Clés publiques et privées, en-têtes PEM, tailles de clés et habitudes de stockage. Générez une paire localement et comprenez exactement ce que signifient les fichiers.
Convertisseur CSV vers JSON : guide
Le CSV semble simple jusqu'à ce qu'un champ contienne une virgule, un saut de ligne ou un signe égal initial. Apprenez les règles RFC 4180 et convertissez sans rien perdre.
Convertisseur de couleurs : HEX, RGB, HSL
HEX, RGB et HSL sont trois vues de la même couleur. Sachez ce que chaque format représente, quand l'alpha compte et comment vérifier le contraste avant de publier.
Expressions cron : guide des cinq champs
Une expression cron est cinq champs qui semblent évidents jusqu'à ce que l'un d'eux soit faux. Apprenez la syntaxe, le piège du jour de la semaine et comment prévisualiser les prochaines exécutions avant le déploiement.