Why it matters
A regex tester tells you whether a pattern matches. It doesn't tell you how the engine got there, which is what you need when a pattern matches the wrong thing, or takes seconds on one input and microseconds on another. JavaScript's regex engine backtracks: when part of a pattern fails, it goes back and tries the other choices, and some patterns have exponentially many choices.
This debugger runs your pattern on its own backtracking engine written to the ECMAScript rules, and records every step: each character tried, each branch taken, each capture and each backtrack. You can play the steps, jump to the next backtrack and see the part of the pattern in use. The final result is compared with your browser's own RegExp, so you know the trace is faithful. It also looks for nested and overlapping quantifiers, the cause of catastrophic backtracking (ReDoS), and confirms them by pumping inputs and counting steps.
How it works
- InputA regex and a test string
- In your browserEvery attempt, backtrack and capture traced
- OutputThe trace, capture groups and a ReDoS check
Where it fits in a designer's workflow
- Plan
- Design
- Build
- Test
- Launch
By the numbers
Show the numbers as a table
| Input | Steps |
|---|---|
| 4 letters then "!" | 296 |
| 6 letters then "!" | 1,166 |
| 8 letters then "!" | 4,628 |
| 10 letters then "!" | 18,458 |
| 12 letters then "!" | 73,760 |
| 14 letters then "!" | 294,950 |
How to use it
- Type your pattern and flags, and a test string.
- Read the result and the step count.
- Step through the trace, or press Next backtrack to jump to where it goes wrong.
- If a ReDoS warning appears, make the inner part unambiguous, or use a possessive form like (?=(a+))\1.
FAQ
Why does my pattern take so long on some inputs?
Patterns like (a+)+$ or (\w+\s?)*$ can split the same text in exponentially many ways. When the overall match fails, the engine tries every split before giving up. The debugger shows the step count growing and gives you an input that triggers it.
Is this the same engine my browser uses?
No, it's a separate engine that follows the same ECMAScript rules, so it can record each step. Every result is checked against your browser's RegExp, and a difference is flagged. Step counts are this engine's, not V8's, but they grow the same way.
Which features are supported?
Everything in ES2018 regex except the v flag: groups, named groups, back-references, lazy quantifiers, lookahead, lookbehind, character classes and the flags i, m, s, u, g and y. Unicode property escapes are checked with your browser for each character.
What is ReDoS?
Regular expression denial of service: an attacker sends input that makes a vulnerable pattern backtrack for seconds or minutes, blocking a server's event loop. Patterns that validate user input are the usual target.
Is my pattern sent anywhere?
No. Everything runs in your browser.
