Is there any way get current htmlstring by onChange

1

what i expected is to get current html string by add event listener on “change” event, where “change” event emit is in my custom plugin like code blow:

    new Plugin({
        key: new PluginKey('justEmitEvent'),
        state: {
           apply(tr) {
               if (tr.docChanged) {
                  throwEvent(tr, "change");
               }
            },
         },
     })

    ... somewhere else
    editorInstance.on('change', (htmlString) => { get htmlString })

on and emit is fired by eventBus library

obviously, it cannot work as expected for the transition has not yet been applied. what i get is a step before what i really tap in the contenteditable box.

any way can achieve that ? only if onChange can get immediately the current htmlString, my editor demo can show content (what user tap in the editorBox next to renderBox) in the renderBox immediately,

2

Trying to wire imperative events into ProseMirror like this is a bad idea. As you noticed, apply is called before the editor is updated (it is involved in creating a new state, which may not even be put into the editor view, depending on what dispatchTransaction and plugins’ filterTransaction callbacks do). It should be a pure function.

If you want to do imperative things, a plugin view’s update method would be the right place. Or the dispatchTransaction prop if you just want to hook into some update cycle.

3

wow, i see.

many thanks