Help with "nesting" modes using multiplex.js

Hi Everyone,

I’m still quite new to code mirror and learning more every day, hopefully you can guide me on where I am going wrong.

My requirement is creating a nested mode, something like the html-mixed mode, its just that I have a mode hierarchy where I use a particular delimiter to switch between modes. Something like:

this should is parsed by mode 1[this by mode 2 [this by mode3] again mode 2] and mode 1

So as you can see, I am trying to use the same delimiter to go from the outer to the inner mode. I am trying to use the multiplex.js addon and have code that looks something like this:

CodeMirror.defineMode("mode-1-base", ..);
CodeMirror.defineMode("mode-2-base", ..);
CodeMirror.defineMode("mode-3-base", ..);

CodeMirror.defineMode("mode-2", function(config){
  return CodeMirror.multiplexingMode(
    CodeMirror.getMode(config, "mode-2-base"),{
      "open": "[",
      "close": "]",
      "mode": CodeMirror.getMode(config, "mode-3-base"),
    }
  );
});

CodeMirror.defineMode("mode-1", function(config){
  return CodeMirror.multiplexingMode(
    CodeMirror.getMode(config, "mode-1-base"),{
      "open": "[",
      "close": "]",
      "mode": CodeMirror.getMode(config, "mode-2"),
    }
  );
});

CodeMirror.fromTextArea(document.getElementById("editor"), {"mode": "mode-1"});

The issue that I am running across is that when I am in mode 3 and use ] to pop out to mode 2, it switches to mode 1 instead. It works perfectly fine when I use different delimiters. Please let me know if I am doing something wrong or is this the expected behavior.

Thank you!

No, this is the expected behavior. The multiplex addon doesn’t support this case, so you may need to write a nesting mode from scratch (which is also not terribly difficult, but involves some more code).

1 Like