Firing of onInit() after content has been set

[Mansehej]

Good day!

I have an application where the editor is being passed some initial content from the props. This is how my editor looks like (in mounted):

this.editor = new Editor({
      useBuiltInExtensions: false,
      extensions: this.extensionList,
      content: this.initialContent,
      onInit: () => {
        console.log(this.editor.getHTML())
      }
    });

I would expected that the content would have loaded when onInit() is fired, however that does not seem to be a case as the function logs undefined.

Is there any way to get the event handler to fire after the initial content has been set? Or is this a wrong way of doing this?

Thanks,
Mansehej.

[hanspagel]

Did you try to work with onUpdate instead of onInit? Maybe that helps.

[Mansehej]

My use case involves manually setting the state and changing the cursor position as soon as the editor is initialized with content.

You're right though, I can use onUpdate() and set a Boolean flag to check if it's the first onUpdate() or not.

Thank you for the suggestion!

[arokanto]

I stumbled upon this same issue. The problem with accepted answer is that onUpdate doesn't trigger until something's changed in the editor.

You can still get the HTML in onInit if you dig a bit deeper into the underlying ProseMirror like this:

this.editor = new Editor({
  useBuiltInExtensions: false,
  extensions: this.extensionList,
  content: this.initialContent,
  onInit: ({ state, view }) => {
    console.log(view.dom.innerHTML)
  }
});

Note that you should treat the value as read-only. Changing dom directly will probably break something.