multiplexingMode doesn't restore the outer mode's state

1

I created a simple mode for embedding arbitrary expressions inside of {{}} blocks inside JSON:

CodeMirror.defineMode("fancyjson", (config) => {
  return CodeMirror.multiplexingMode(
    CodeMirror.getMode(config, { name: "javascript", json: true }),
    {
      open: "{{",
      close: "}}",
      mode: CodeMirror.getMode(config, "text/plain"),
      parseDelimiters: false
    }
  );
});

const els = document.querySelectorAll(".code");
els.forEach((el) => {
  CodeMirror.fromTextArea(el, {
    lineNumbers: true,
    mode: "fancyjson"
  });
});

Codepen is here.

Screenshot:

Screen Shot 2021-06-03 at 5.21.29 PM
Screen Shot 2021-06-03 at 5.21.29 PM458×506 9.18 KB

Note how the string syntax highlight is incorrect in the second block. Is this expected behavior?

2

I think the problem is that the multiplexing addon doesn’t allow tokens in the outer mode to cross mode boundaries, and the JavaScript/JSON mode treats strings like single tokens. So it first sees an unfinished string, and then another unfinished string after the {{1}}. That’s not something that’s going to be easy to fix/change.

3

Got it, thanks!