Event when Editor updated? (used to be onAction)

1

There used to be an onAction() editor prop which I used to dump the current state into a text area (for debugging) like this:

const json = document.getElementById('json');

let view = new MenuBarEditorView(document.querySelector("#editor"), {
    state: EditorState.create({
        doc: Node.fromJSON(schema, JSON.parse(json.value)),
        schema: schema,
        plugins: exampleSetup({schema})
    }) ,
    onAction(action) {
        view.updateState(view.editor.state.applyAction(action));
        //current state as json in text area
        json.value =  JSON.stringify(view.editor.state.doc.toJSON(), null, 4);
    }
});
window.view = view.editor;

But it seems this prop is gone. What would be the equivalent to that?

2

You can now define your own dispatchTransaction prop which will cause every state change of the editor to go through your code. Alternative, if you’re defining a plugin, you can use the state update function of the plugin to keep your state in sync with the rest of the editor state.

3

Ah! Thank you! For everyone else looking for this, the updated prop look like this:

dispatchTransaction(tr) {
    view.updateState(view.editor.state.apply(tr));
    //current state as json in text area
    json.value =  JSON.stringify(view.editor.state.doc.toJSON(), null, 4);
}
1 Like