diff --git a/src/components/Editor/MediaHandler.vue b/src/components/Editor/MediaHandler.vue index a8f5ec8b4ae..653a591fbc4 100644 --- a/src/components/Editor/MediaHandler.vue +++ b/src/components/Editor/MediaHandler.vue @@ -207,6 +207,9 @@ export default { // Scroll image into view this.$editor.commands.scrollIntoView() + // Store last inserted attachment src to focus it in ImageView.vue + this.$editor.commands.setMeta('insertedAttachmentSrc', { src }) + emit('text:image-node:add', null) }, }, diff --git a/src/nodes/ImageView.vue b/src/nodes/ImageView.vue index 0b20ad7e97d..4b5c811437d 100644 --- a/src/nodes/ImageView.vue +++ b/src/nodes/ImageView.vue @@ -181,6 +181,7 @@ export default { showImageModal: false, imageIndex: null, isEditable: false, + isLastInserted: false, embeddedImageList: [], } }, @@ -237,6 +238,12 @@ export default { this.editor.on('update', ({ editor }) => { this.isEditable = editor.isEditable }) + this.editor.on('transaction', ({ transaction }) => { + const trMeta = transaction.getMeta('insertedAttachmentSrc') + if (trMeta?.src === this.src) { + this.isLastInserted = true + } + }) this.loadPreview() .catch(this.onImageLoadFailure) }, @@ -280,7 +287,9 @@ export default { onLoaded() { this.loaded = true this.$nextTick(() => { - this.$refs.altInput?.focus() + if (this.isLastInserted) { + this.$refs.altInput?.focus() + } }) }, async updateEmbeddedImageList() {