Handle mouseover on not editable elements

I found the comment on handleDOMEvents on EditorProps:

interface EditorProps {
  /**
    Can be an object mapping DOM event type names to functions that
    handle them. Such functions will be called before any handling
    ProseMirror does of events fired on the editable DOM element.
    Contrary to the other event handling props, when returning true
    from such a function, you are responsible for calling
    `preventDefault` yourself (or not, if you want to allow the
    default behavior).
    */
    handleDOMEvents?: {
        [event in keyof DOMEventMap]?: (this: P, view: EditorView, event: DOMEventMap[event]) => boolean | void;
    };
}

As you mentioned, events would only be triggered on those editable DOM elements…

But I do have use cases that require handling events like mouseover for displaying float toolbar or something else …

For example: I have a non-editable node like “horizontal-line”, and I want to treat it as a block like paragraph and heading so that I can register a mouseover handling function to show a side dragging button for them.

Is there any work around about that ? @marjin Thank you very much if you can help!

These will also be fired for your horizontal line. Try it.