dropCursor not visible when using shadow DOM

[eric-burel]

dropCursor plugin will create a cursor element at the same level as the EditorView DOM, instead of creating it within the editor view. As such, when using a Shadow DOM, the cursor is there in the DOM but not visible at all. You can see in this screenshot that the cursor is outside of the shadow root:

Reproduction is a bit tricky because I use Lit components, sorry in advance.

Instead I can share the DOM structure I render, it's very simple:

    return html`
        ${this.view.dom}
        `

A palliative is to add a an additional slot, that will contain the cursor. It works as expected.

    return html`
        ${this.view.dom}
        <slot></slot>
        `

However I think the cursor should have been rendered within "view.dom", if it is even possible, not as a sibling.

[marijnh]

However I think the cursor should have been rendered within "view.dom", if it is even possible, not as a sibling.

That would make it part of the editable DOM, which is going to cause a whole bunch of issues and weird side effects, so no, that's not an option.

[eric-burel]

Yeah makes sense. So at least the <slot></slot> trick works as expected, this could perhaps be documented somewhere, or googlers can land here if needed. This is tricky to debug as the element disappear after you stop dragging. Will close in the meantime.