Regex Debugger — Manual

Zurück zur Übersicht: Regex Debugger · Tool live öffnen: www.jpkc.com/tools/regex/

Dieses Manual beschreibt den Regex Debugger vollständig: jedes Eingabefeld, jeden Flag, die fünf Ergebnis-Tabs, wie Treffer und Capture-Gruppen dargestellt werden, Library, Cheat Sheet, Speichern und Teilen sowie die Grenzen der zugrunde liegenden JavaScript-Engine. Die Oberfläche des Tools ist auf Englisch — die Feld- und Button-Bezeichnungen werden hier deshalb in ihrer englischen Original-Schreibweise genannt (mit deutscher Erläuterung), damit du dich im echten Interface zurechtfindest.

Aufbau und Ablauf

Die Oberfläche ist zweispaltig. Links liegen drei Karten untereinander — Pattern, Test String und die Ergebnis-Karte mit den Tabs Matches, Replace, Split, Explain und Code —, rechts das eingebaute Cheat Sheet (auf schmalen Bildschirmen darunter). Einen Ausführen-Knopf brauchst du nicht: Die Auswertung läuft automatisch, sobald du am Muster, am Text, an den Flags oder an der Ersetzung etwas änderst. Eingaben in den Feldern sind dabei um 150 ms entprellt (Debounce), damit nicht bei jedem Tastendruck neu gerechnet wird; ein Flag-Klick und die Enter-Taste im Musterfeld wirken sofort.

Der Ablauf intern: Aus Muster und gewählten Flags wird ein RegExp-Objekt gebaut und in einem Web Worker — einem eigenen Hintergrund-Thread des Browsers — gegen den Test-String ausgeführt. Das Ergebnis erscheint als Zähler, als Trefferliste und als farbige Markierung im Text; ist der Tab Replace oder Split offen, berechnet der Worker zusätzlich die Ersetzung bzw. die Aufteilung. Braucht eine Auswertung länger als 1,5 Sekunden, bricht das Tool sie ab (siehe Zeitlimit). Unter den Flags zeigt eine Statuszeile die Laufzeit in Millisekunden, bei Problemen die Fehlermeldung. Zwischen den Ergebnis-Tabs wechselst du per Klick oder mit den Pfeiltasten links/rechts.

Pattern

Der obere Editor nimmt dein Regex-Muster auf — den reinen Ausdruck, ohne die umschließenden Schrägstriche und ohne angehängte Flags. Die Schrägstriche stehen fest links und rechts vom Feld, hinter dem schließenden / spiegelt das Tool die aktuell gesetzten Flags. Schreibst du im Code /\d+/g, gehört hier nur \d+ hinein; das g setzt du über die Flag-Umschalter.

Backslash-Sequenzen schreibst du wie in einem echten regulären Ausdruck, also \d, \w, \b und so weiter — nicht doppelt escaped wie in einem JavaScript-String-Literal. Du tippst das Muster so, wie es zwischen den Schrägstrichen stünde.

Der Editor (ACE) färbt die Bestandteile des Musters ein — Escapes, Zeichenklassen, Klammern, Quantoren und Operatoren wie |, ^, $ und . — und hebt die passende Gegenklammer hervor. Er wächst mit dem Inhalt bis auf sechs Zeilen und bricht lange Muster um. Enter fügt keinen Zeilenumbruch ein, sondern startet die Auswertung sofort.

Literal einfügen

Fügst du ein komplettes JavaScript-Literal wie /hello/i ein, zerlegt das Tool es automatisch: hello landet im Musterfeld, i wird als Flag gesetzt, und eine kurze Meldung bestätigt die Umwandlung. Escapte Schrägstriche (\/) werden dabei zu /. Die Flags übernimmt das Tool genau so, wie sie im Literal stehen — ein /abc/ ohne Flags schaltet also auch g aus. Umgewandelt wird nur, wenn der gesamte Inhalt mit / beginnt, hinter dem letzten / ausschließlich gültige Flag-Buchstaben folgen und der Teil dazwischen eine gültige Regex ist. Ein Pfad wie /var/log/syslog bleibt deshalb stehen; /var/log/ dagegen erfüllt die Bedingungen und wird zum Muster var/log.

Muster kopieren

Der Kopier-Button (Symbol, Tooltip „Copy as /pattern/flags") in der Pattern-Toolbar legt dein Muster im Literal-Format in die Zwischenablage: /muster/flags. Die aktuell gesetzten Flags werden mit übernommen, Schrägstriche im Muster automatisch als \/ escaped — so ist das Ergebnis direkt als gültiges JavaScript einsetzbar. Ist das Muster leer, kommt der Hinweis „Nothing to copy." statt einer Kopie.

Share-Link

Der Teilen-Button (Tooltip „Copy a share link (pattern, flags, test string)") kopiert einen Link, der Muster, Flags, Test-String und Ersetzung enthält. Die Daten stehen Base64url-kodiert direkt im Link (im Teil #r=…); ein Server speichert nichts. Ist der Test-String länger als 20.000 Zeichen, lässt das Tool ihn weg und sagt dir das in der Bestätigungsmeldung. Wer den Link öffnet, bekommt genau diesen Stand geladen; danach entfernt das Tool den #r=-Teil wieder aus der Adresszeile. Ist der Link beschädigt, erscheint „The share link is damaged.".

Muster und Test-String leeren

Der Lösch-Button (Papierkorb, Tooltip „Clear pattern and test string (Ctrl+Z restores)") leert Muster und Test-String. Flags und Ersetzungsfeld bleiben unverändert. Danach steht der Cursor im Pattern-Editor; mit Strg+Z holst du den Inhalt des jeweils fokussierten Editors zurück.

Library

Das Dropdown Library enthält 17 erprobte Muster, jeweils mit einem Test-Text, der meist gültige und ungültige Fälle mischt:

• E-mail address (pragmatic), URL (http/https), IPv4 address, IPv6 address (common forms)
• ISO date (named groups), German date (dd.mm.yyyy), Time (24 h)
• UUID, Hex color, German postal code, Semantic version, URL slug
• Markdown link, HTML tag, Duplicate words, Trailing whitespace
• Password strength (12+, upper, lower, digit, symbol)

Ein Klick setzt Muster, Flags und Test-Text und füllt das Ersetzungsfeld — einige Einträge bringen eine passende Ersetzung mit (etwa ISO-Datum → $<day>.$<month>.$<year> oder Markdown-Link → HTML-Link), bei den übrigen wird das Feld geleert. Dein bisheriger Inhalt wird dabei überschrieben.

Test String

Der mittlere Editor enthält den Text, gegen den dein Muster läuft. Er ist mehrzeilig, bricht lange Zeilen um und zeigt Zeilennummern, was beim Arbeiten mit den zeilenbezogenen Flags (m) und mit längeren Eingaben hilft. Rechts oben im Kartenkopf steht der Treffer-Zähler: „0 matches", „1 match" oder „N matches", bei einem Abbruch „Timeout", bei einem ungültigen Muster „Error". Jede Änderung am Text löst nach kurzer Verzögerung eine neue Auswertung aus.

Flags

Unter dem Pattern-Editor liegen acht Umschalter, die zusammen die Flag-Zeichenkette für das RegExp-Objekt bilden. Standardmäßig ist nur g aktiv. Jeder Flag entspricht exakt dem gleichnamigen JavaScript-Regex-Flag; der Tooltip jedes Buttons erklärt ihn kurz.

g — global

Sucht alle Treffer statt nur des ersten. Das ist im Tool von Haus aus an. Praktisch wichtig: Ist g aus, zeigt die Trefferliste nur den ersten Treffer, und Replace ersetzt nur das erste Vorkommen — das ist kein Fehler, sondern das normale Verhalten der Engine. Für die meisten Debugging-Aufgaben willst du g aktiv lassen.

i — case insensitive

Ignoriert Groß-/Kleinschreibung. Hallo trifft dann auch hallo und HALLO.

m — multiline

Ändert die Bedeutung der Anker ^ und $: Sie passen dann auf Zeilenanfang und Zeilenende statt nur auf Anfang und Ende des gesamten Strings. Ohne m matcht ^ nur ganz vorne. Mit mehrzeiligem Test-String und Zeilennummern siehst du den Effekt sofort.

s — dotall

Lässt den Punkt . auch Zeilenumbrüche treffen. Ohne s matcht . jedes Zeichen außer dem Newline; mit s auch diesen.

u — unicode

Schaltet die volle Unicode-Verarbeitung ein. Nötig, sobald du mit Unicode-Escapes wie \u{1F600} oder Unicode-Property-Escapes wie \p{L} arbeitest. Ohne u werden manche Sequenzen anders interpretiert.

v — unicode sets

Die erweiterte Unicode-Variante: Sie kann alles, was u kann, und erlaubt zusätzlich Mengenoperationen in Zeichenklassen, etwa [\p{L}--[a-z]] (alle Buchstaben außer a–z). u und v schließen sich aus — schaltest du den einen ein, geht der andere automatisch aus. Der Code-Tab weist darauf hin, dass v aktuelle Laufzeitumgebungen braucht (laut Tool-Hinweis Chrome 112+, Firefox 116+, Safari 17+, Node 20+).

y — sticky

Erzwingt einen Treffer exakt an der aktuellen Position (lastIndex), nicht irgendwo später im String. Im Tool startet die Suche bei Position 0 — findet das Muster dort nichts, meldet die Liste „No match at position 0 (flag y only matches where the last match ended)." Ist zusätzlich g gesetzt, muss jeder weitere Treffer direkt am Ende des vorigen beginnen: Das Tool findet eine lückenlose Kette ab Textanfang und hört beim ersten Zeichen auf, an dem das Muster nicht passt. Spezialfall für Tokenizer-artige Aufgaben.

d — indices

Lässt die Engine Start- und Endposition jeder Gruppe mitliefern (match.indices). Auf Trefferliste, Markierungen, Replace und Split wirkt der Umschalter nicht: Der Worker ermittelt die Gruppen-Positionen fürs Highlighting ohnehin immer, und welche Stellen getroffen werden, beeinflusst d nicht. Sichtbar wird er in der Flag-Anzeige hinter dem schließenden / und in dem, was du aus dem Tool mitnimmst: Das kopierte Literal (Button „Copy as /pattern/flags") und der Share-Link tragen das d; im Code-Tab steht es im JavaScript-Literal, der PHP-Code bekommt PREG_OFFSET_CAPTURE.

Matches

Der erste Tab der Ergebnis-Karte zeigt die Trefferliste. Solange das Muster leer ist, steht dort „Enter a pattern to see matches."; findet ein gültiges Muster nichts, erscheint „No matches.".

Pro Treffer rendert die Liste einen Eintrag mit:

• Nummer — ein laufendes Badge (1, 2, 3 …).
• Match value — der tatsächlich getroffene Text (match[0]), in derselben Farbe hinterlegt wie im Test-String. Ein leerer Treffer (Nulllänge) erscheint als „(empty)".
• Position — die Angabe pos X–Y: Start-Index und End-Index des Treffers im String (nullbasiert, Ende exklusiv).

Ein Klick auf den Kopf eines Eintrags markiert den Treffer im Test-String und scrollt dorthin — praktisch bei langen Texten.

Capture-Gruppen (nummeriert)

Enthält dein Muster runde Klammern (…), listet der Treffer-Eintrag darunter jede Capture-Gruppe in einer eigenen Zeile: links die Gruppennummer in der Farbe, mit der die Gruppe im Test-String unterstrichen ist, daneben der eingefangene Teilstring. Gruppen, die in diesem Treffer nicht beteiligt waren — etwa der nicht gewählte Zweig einer Alternation —, erscheinen als „did not participate (undefined)". Die Nummerierung folgt der Reihenfolge der öffnenden Klammern — wie in JavaScript.

Benannte Capture-Gruppen

Benannte Gruppen (?<name>…) stehen in derselben Liste: Hinter der Gruppennummer folgt der Name als <name>, dann der Wert. Jede Gruppe taucht also genau einmal auf, mit Nummer und Name. Das Start-Beispiel des Tools ((?<word>\w+)) zeigt das direkt.

Highlighting im Test-String

Parallel zur Liste markiert das Tool jeden Treffer direkt im Test-String farbig. Es rotieren vier Farben: Treffer 1, 2, 3, 4 bekommen unterschiedliche Töne, Treffer 5 wieder die erste Farbe und so weiter. So lässt sich auch bei dicht beieinanderliegenden Treffern erkennen, wo einer aufhört und der nächste beginnt. Zusätzlich sind die Capture-Gruppen farbig unterstrichen (sechs rotierende Farben, passend zu den Nummern in der Liste). Bei jeder Neuauswertung werden die alten Markierungen entfernt und neu gesetzt.

Sehr viele Treffer

Das Tool zählt bis zu 100.000 Treffer; detailliert aufgelistet und im Text markiert werden die ersten 1.000. Darüber hinaus nennt die Liste die Zahl der nicht gezeigten Treffer, die Statuszeile ergänzt „first 1,000 matches highlighted". Bricht die Zählung bei 100.000 ab, trägt der Zähler ein „+" (z. B. „100,000 matches+").

Replace

Der Tab Replace zeigt, was text.replace(regex, ersetzung) aus deinem Test-String macht. Ins Feld Replacement schreibst du die Ersetzung; das Ergebnis erscheint darunter in einem schreibgeschützten Editor und lässt sich mit Copy result kopieren. Erlaubt sind die JavaScript-Ersetzungsmuster:

• $1, $2 … — Inhalt der nummerierten Gruppe
• $<name> — Inhalt der benannten Gruppe
• $& — der gesamte Treffer
• $` und $' — der Text vor bzw. nach dem Treffer
• $$ — ein wörtliches Dollarzeichen

Über dem Ergebnis steht, wie viel ersetzt wurde: „All matches replaced." mit Flag g, sonst „Without flag g only the first match is replaced.". Die Ersetzung wird nur berechnet, solange der Tab Replace offen ist. Der Inhalt des Felds fließt außerdem in den Code-Tab ein.

Split

Der Tab Split zeigt das Ergebnis von text.split(regex) als nummerierte Liste, beginnend bei 0 — also mit denselben Indizes, die du im Code verwendest. Leere Teile erscheinen als „(empty string)". Enthält dein Muster Capture-Gruppen, landen deren Inhalte wie in JavaScript mit im Ergebnis; eine nicht beteiligte Gruppe erscheint als „undefined". Die Aufteilung wird nur berechnet, solange der Tab Split offen ist. Angezeigt werden höchstens 5.001 Teile; alles darüber schneidet das Tool ohne Hinweis ab.

Explain

Der Tab Explain zerlegt dein Muster in seine Bausteine und erklärt jeden in einer Zeile auf Englisch — Literale, Escapes (\d, \p{…}, \u{…}, Rückverweise), Zeichenklassen samt Bereichen, Quantoren mit dem Zusatz greedy oder lazy, Anker, Alternation, Gruppen und Lookarounds. Der Inhalt von Gruppen ist nach Verschachtelungstiefe eingerückt, jede Gruppe bekommt ihre Nummer und gegebenenfalls ihren Namen. Die Erklärung berücksichtigt die Flags: Mit m heißt ^ „start of a line", ohne „start of the text"; mit s trifft . „any character, including newlines". Auch die Bindung von Quantoren wird sichtbar: In abc+ wiederholt das + nur das c.

Code

Der Tab Code erzeugt aus Muster, Flags und Ersetzung fertigen Beispielcode. Über Language wählst du JavaScript, PHP (PCRE) oder Python (re); Copy code kopiert das Ergebnis. Der Code enthält eine Suchschleife über alle Treffer (mit g) bzw. die Suche nach dem ersten Treffer (ohne g) und — wenn das Replacement-Feld nicht leer ist — die passende Ersetzungszeile.

• JavaScript — das Muster als Literal (mit escapten Schrägstrichen), dazu matchAll() bzw. match() und replace().
• PHP (PCRE) — das Muster mit einem Delimiter, der im Muster nicht vorkommt (/, ~, #, %, @ oder !), die Flags i, m, s als Modifier und u, sobald u/v gesetzt ist oder das Muster \u… bzw. \p{…} enthält. \u… und \u{…} werden zu \x{…}. Dazu preg_match_all() bzw. preg_match() und preg_replace() (ohne g mit Limit 1); in der Ersetzung wird $<name> zur Gruppennummer und $& zu $0.
• Python (re) — re.compile() mit re.IGNORECASE, re.MULTILINE, re.DOTALL; benannte Gruppen werden zu (?P<name>…), \k<name> zu (?P=name). Dazu finditer() bzw. search() und sub() (ohne g mit count=1); $1, $<name> und $& werden zu \g<…>, $$ zu einem einfachen $. \u{…} im Muster wird zu \U mit acht Hex-Stellen.

Über dem Code stehen gelbe Hinweise, sobald etwas nicht 1:1 übertragbar ist — zum Beispiel: kein $`/$' in PHP- und Python-Ersetzungen, kein Gegenstück zu v in PCRE und Python, kein Gegenstück zu y in Python (für PCRE schlägt das Tool den Modifier A oder \G vor), [^] nur in JavaScript, $ matcht in PCRE auch vor einem abschließenden Zeilenumbruch (Modifier D), Lookbehind mit variabler Länge, kein \p{…} im Python-Modul re und das Unicode-Verhalten von \d/\w in Python 3 (re.ASCII).

Fehleranzeige

Ist dein Muster syntaktisch ungültig (z. B. eine unbalancierte Klammer oder ein ungültiger Quantor), kann die Engine kein RegExp bauen. Dann erscheint die Original-Fehlermeldung der JavaScript-Engine in der Statuszeile unter den Flags, die Trefferliste bleibt leer, und der Zähler wechselt auf „Error". Die Meldung ist die unveränderte Browser-Meldung (z. B. „Invalid regular expression: …") — sie nennt dir oft direkt die problematische Stelle.

Zeitlimit (Timeout)

Rechnet eine Auswertung länger als 1,5 Sekunden, beendet das Tool den Worker. Der Zähler zeigt „Timeout", und die Statuszeile erklärt den wahrscheinlichen Grund: katastrophales Backtracking durch verschachtelte Quantoren wie (a+)+ oder (\w*)* auf Text, der beinahe passt. Die Seite bleibt dabei bedienbar; sobald du das Muster oder den Text änderst, startet eine neue Auswertung. Eine noch laufende, inzwischen überholte Auswertung bricht das Tool sofort ab, statt ihr Zeitlimit abzuwarten.

Cheat Sheet

Rechts liegt ein aufklappbares Nachschlagewerk (Akkordeon), das die wichtigsten Regex-Bausteine als Kurztabellen bereithält. Jeder Baustein ist anklickbar („click to insert"):

• Characters — ., \d, \D, \w, \W, \s, \S, \n, \t, \..
• Quantifiers — *, +, ?, {3}, {3,}, {2,5} sowie die Lazy-Varianten *? und +?.
• Groups — (), (?:), (?<name>), Rückverweise \1 und \k<name>, Alternation |.
• Anchors — ^, $, \b, \B.
• Lookaround — (?=), (?!), (?<=), (?<!).
• Character Classes — [abc], [^abc], [a-z], [A-Za-z], [0-9].
• Unicode (flag u or v) — \p{L}, \p{Lu}, \p{N}, \p{Script=Greek}, \p{Emoji_Presentation}, \u{1F600}.
• Replacement — $1, $<name>, $&, $`, $', $$.
• Flags — die acht Flags mit Kurzerklärung.

Ein Klick auf einen Muster-Baustein fügt ihn an der Cursorposition im Pattern-Editor ein; bei Gruppen und Lookarounds landet der Cursor gleich zwischen den Klammern. Bausteine aus Replacement wandern ins Ersetzungsfeld, und das Tool wechselt dabei in den Tab Replace. Einträge unter Flags schalten das jeweilige Flag um. Die Fußzeile erinnert daran, dass das Tool JavaScript-Syntax verwendet und der Code-Tab die Unterschiede zu PHP und Python nennt.

Speichern und Teilen

Das Tool merkt sich deinen Arbeitsstand automatisch im localStorage deines Browsers: Muster, Flags, Test-String, Ersetzung und den offenen Tab. Nach einem Reload ist alles wieder da — mit einer Ausnahme: Hast du alle Flags ausgeschaltet, startet das Tool wieder mit g. Das gilt auch für einen Share-Link ohne Flags. Test-Strings über 200.000 Zeichen speichert es nicht mit, damit der Speicher klein bleibt. Öffnest du einen Share-Link, hat dessen Inhalt Vorrang — und er ersetzt zugleich deinen gespeicherten Stand, denn das Tool speichert den geladenen Link-Inhalt sofort. Willst du deinen eigenen Stand behalten, kopiere vorher selbst einen Share-Link davon. Gibt es weder Link noch gespeicherten Stand, startet das Tool mit dem Beispiel (?<word>\w+), dem Satz „Hello World! This is a regex test with 123 numbers." und der Ersetzung [$<word>].

Engine und Grenzen

Der Debugger ist rein clientseitig und nutzt die native JavaScript-RegExp-API des Browsers. Es gibt keinen Server-Aufruf, keine Datenübertragung; Muster und Text bleiben auf deinem Gerät. Daraus folgen die wichtigsten Fakten und Grenzen:

• Du testest die JS-Engine. Ergebnisse gelten 1:1 für JavaScript/Node.js/TypeScript — aber nicht zwingend für PCRE (PHP), Python re, Go oder .NET. Der Code-Tab übersetzt das Muster nach PHP und Python und nennt die wichtigsten Unterschiede; weitere stehen in den Tipps.
• Acht Flags. g/i/m/s/u/v/y/d — alle JavaScript-Flags. u und v lassen sich nicht gleichzeitig setzen.
• JavaScript-Featureset. Verfügbar sind benannte Gruppen, Lookahead und Lookbehind, Rückverweise und (mit u oder v) Unicode-Property-Escapes. Nicht verfügbar sind PCRE-Eigenheiten wie atomare Gruppen, possessive Quantoren, Rekursion, \A/\Z/\z oder POSIX-Klassen [[:alpha:]].
• Nulllängen-Treffer (z. B. \b oder a* an leeren Stellen) werden korrekt behandelt: Das Tool schaltet nach einem leeren Treffer weiter — mit u/v über ganze Unicode-Zeichen wie Emojis hinweg — und verhindert so die Endlosschleife, die ein globaler Match auf solchen Mustern sonst auslösen würde.
• Catastrophic Backtracking wird abgefangen. Ein pathologisches Muster (verschachtelte Quantoren wie (a+)+$) friert den Tab nicht mehr ein: Nach 1,5 Sekunden bricht das Tool ab und meldet „Timeout". Das Muster selbst ist damit aber nicht repariert — in deinem Code würde es weiter hängen. Details und Gegenmittel in den Tipps.
• Mengengrenzen. Gezählt werden bis zu 100.000 Treffer, gelistet und markiert die ersten 1.000; Split zeigt höchstens 5.001 Teile; Share-Links tragen Test-Strings bis 20.000 Zeichen, der lokale Speicher bis 200.000 Zeichen.

Für den Einstieg, die Zielgruppen und das große Bild siehe die Übersichtsseite. Konkrete Durchläufe zeigen die Beispiele. Ausprobieren kannst du alles direkt im Tool.