preview not updating when $imgAddByFilename is called

[ohuu]

Calling $imgAddByFilename works and the image is added to the editor however the preview panel is not updated so the image shows as a broken image.

The preview panel immediately updates as soon as you type in the editor and the image shows.

Is there a way to force the editor to re-draw the preview panel or have it re-render when an image is uploaded programmatically?

[ohuu]

To give more context I'm using the composition API with Vue 2. The code for adding the images looks like this:

<mavon-editor
  ref="md"
  class="mavon-editor mb-4"
  language="en"
  v-model="post.content"
  @imgAdd="imageAdded"
  @imgDel="imageDeleted"
/>

// load post if editing a pre-existing post
    onMounted(() => {
      if (!isNew) {
        indexedDb.posts
          .filter(({ uuid }) => uuid === props.uuid)
          .first()
          .then(row => {
            if (row) {
              ignoreUpdates(() => {
                post.setTo(row);
              });

              // upload images stored in indexedDb to mavon editor
              nextTick(() => {
                if (row.images) {
                  row.images.forEach(({ pos, file }) => {
                    md.value.$refs.toolbar_left.$imgAddByFilename(pos, file);
                  });
                }
              });

              return;
            }
          });
      }
    });

The preview panel on the editor is open by default (I'm using the default options for the editor). As soon as I manually type in the editor the image is rendered in the preview panel but shows a broken link before.

Immediately after loading the image using the code above:

After manually editing the text in the left hand panel:

Interestingly this worked just fine when using Vue 2 without the composition API it seems to be related to the composition API.