Question

I’m debugging and commenting someone else’s JavaScript code at the moment but there’s some fiendish RegEx in it. While my knowledge of RegEx is fairly good, it would help to have a reliable visualiser to show each RegEx string as a railroad diagram or something similar.

• I found a plug-in for Eclipse, for use with Java, at this question so I was wondering if there was something similar for JavaScript out there.

• It doesn’t have to be a plug-in, though something for Notepad++ would be ideal. I checked via Notepad++’s Plug-in manager but the two RegEx tools I could see there weren’t very good.

• A webpage which accepted an expression and produced a diagram would work just as well and would save me having to use JSFiddle so much.

Does anyone know if such a tool exists? Or if there is some trick that I’m missing that can make human parsing of RegEx easier?

Answer 1

Regexpr generates pretty nice visualizations of regexes. A simple example:

And a more complicated example of a regex which attempts to match HTML tags:

^{(via tutsplus.com)}