fix(editor): enhance editor readiness and connection handling

src/components/Editor/ContentContainer.vue

@@ -16,6 +16,7 @@
 		<slot />
 		<FloatingButtons v-if="showFloatingButtons" />
 		<EditorContent
+			v-if="editorReady"
 			role="document"
 			class="editor__content text-editor__content"
 			:editor="editor" />
@@ -54,6 +55,11 @@ export default {
 		const { isFullWidth } = useEditorWidth()
 		return { editor, isMobile, isFullWidth, isRichEditor, isRichWorkspace }
 	},
+	data() {
+		return {
+			editorReady: false,
+		}
+	},
 	computed: {
 		showOutline() {
 			return this.$outlineState.visible
@@ -68,6 +74,9 @@ export default {
 			)
 		},
 	},
+	mounted() {
+		this.editorReady = true
+	},
 }
 </script>
 

src/components/Editor/MarkdownContentEditor.vue

@@ -28,7 +28,7 @@ import Wrapper from './Wrapper.vue'
 /* eslint-disable import/no-named-as-default */
 import { getCurrentUser } from '@nextcloud/auth'
 import { UndoRedo } from '@tiptap/extensions'
-import { provide, watch } from 'vue'
+import { provide, watch, onMounted } from 'vue'
 import { provideEditor } from '../../composables/useEditor.ts'
 import { editorFlagsKey } from '../../composables/useEditorFlags.ts'
 import { useEditorMethods } from '../../composables/useEditorMethods.ts'
@@ -38,6 +38,8 @@ import AttachmentResolver from '../../services/AttachmentResolver.js'
 import { ATTACHMENT_RESOLVER } from '../Editor.provider.ts'
 import ReadonlyBar from '../Menu/ReadonlyBar.vue'
 import ContentContainer from './ContentContainer.vue'
+import { provideConnection } from '../../composables/useConnection.ts'
+import { provideEditorWidth } from '../../composables/useEditorWidth.ts'
 
 export default {
 	name: 'MarkdownContentEditor',
@@ -117,6 +119,20 @@ export default {
 			isRichEditor: true,
 			isRichWorkspace: false,
 		})
+
+		const { openConnection } = provideConnection({
+			fileId: props.fileId,
+			relativePath: props.relativePath,
+			shareToken: props.shareToken,
+		})
+
+		const { applyEditorWidth } = provideEditorWidth()
+		onMounted(() => {
+			applyEditorWidth()
+			if (props.fileId) {
+				openConnection().catch(() => {})
+			}
+		})
 		return { editor, setContent }
 	},