Full LivePreview support

[Jean-Frédéric Faust]

Variable replacement works but I cannot only replace the variable name with a string. CodeMirror's replacing decoration inserts additional markup and it breaks the formatting and other functionality like generating a valid file path.

More details here: https://discuss.codemirror.net/t/can-a-replacing-decoration-generate-a-string-instead-of-an-htmlelement/4146

[Jean-Frédéric Faust]

I am disabling live preview support until it works correctly.

[vencyc]

Hi @jffaust,

I'm not a JS/TS dev, but I still wanted to take a quick look at this problem. What I found is that you can insert the plain text with an onNodeInserted event:

    toDOM() {
        let wrap = document.createElement("span");
        wrap.onNodeInserted(() => {
            wrap.outerHTML = wrap.innerHTML;
        });
        wrap.innerHTML = this.value;
        return wrap
    }

That works, however it leads to another problem.
I think the elements <img class="cm-widgetBuffer" aria-hidden="true"> are placed by Obsidian around HTML elements (the new span elem in this case), so if you write <span>Some text here</span> (or <paragraph>, <dv>, etc. ) in the .md file, you'll get the same <img> tags around it, and it has nothing to do with CodeMirror.

The problem with removing the span is that when the var name is replaced by its value, the value then becomes part of the MD source. So the var name will never be evaluated again, since its gone after the first evaluation.

I'm not sure why its completely replaced this way, and like I said I'm not really JS/TS dev, so I kind of gave up at that point, but I wanted to let you know in case you can come up with another idea.