Search code examples
javascriptregexcodemirror

CodeMirror regex doesn't match behavior typical Javascript regex parser


I'm currently using the Codemirror Simplemode to define a mode.

I have a list of keywords that I would like to be highlighted and figured that I could replace the keywords from the demo with mine. Before replacing the keywords, I noticed that the regex given accepted characters before the given keywords.

Specifically, I'm interested in changing the following passage:

// Rules are matched in the order in which they appear, so there is
// no ambiguity between this one and the one above
{regex: /(?:function|var|return|if|for|while|else|do|this)\b/,
 token: "keyword"},

to:

// Rules are matched in the order in which they appear, so there is
// no ambiguity between this one and the one above
{regex: /\b(?:function|var|return|if|for|while|else|do|this)\b/,
 token: "keyword"},

The "\b" I added at the beginning was an attempt to force the regex to parse a word explicitly. Testing in several regex testers has the following examples working correctly:

enter image description here *RegexPal yields similar results.

However, this regex fails in Codemirror:

enter image description here

My question: why is codemirror still coloring A"function" in the second line when it gets rejected in other rejex testers?


Solution

  • Because of a limitation in JavaScript's regexp API, the only way to force a regexp match to start at a given position in a string is to prefix it with a ^ and match it to the substring after that position. That means that your regexp is applied, when matching the token after A to the string "function", and the \b will match because it falls at the start of the string.

    (The 'sticky' regexp flag, part of ES6, fixes this, but isn't supported widely yet, so CodeMirror doesn't rely on it.)