insomnia/app/ui/components/codemirror/modes/nunjucks.js

import CodeMirror from 'codemirror';

CodeMirror.defineMode('nunjucks', (config, parserConfig) => {
  const baseMode = CodeMirror.getMode(config, parserConfig.baseMode || 'text/plain');
  const nunjucksMode = _nunjucksMode();
  return CodeMirror.overlayMode(baseMode, nunjucksMode, false);
});

function _nunjucksMode () {
  const regexVariable = /^{{ ?([^ ]+) ?[^}]* ?}}/;
  const regexTag = /^{% ?([^ ]+) +[^%]* ?%}/;
  const regexComment = /^{# ?[^#]+ ?#}/;
  let ticker = 1;

  return {
    startState() {
      return {inRaw: false};
    },
    token (stream, state) {
      let m;

      // This makes sure that adjacent tags still have unique types
      ticker *= -1;

      m = stream.match(regexTag, true);
      if (m) {
        const name = m[1];
        if (state.inRaw && name === 'endraw') {
          state.inRaw = false;
        } else if (!state.inRaw && name === 'raw') {
          state.inRaw = true;
        } else if (state.inRaw) {
          // Inside raw tag so do nothing
          return null;
        }

        return 'nunjucks-tag ' + ticker;
      }

      if (!state.inRaw) {
        m = stream.match(regexVariable, true);
        if (m) {
          return 'nunjucks-variable';
        }
      }

      if (!state.inRaw) {
        m = stream.match(regexComment, true);
        if (m) {
          return 'nunjucks-comment';
        }
      }

      while (stream.next() != null) {
        if (stream.match(regexVariable, false)) break;
        if (stream.match(regexTag, false)) break;
        if (stream.match(regexComment, false)) break;
      }

      return null;
    }
  }
}