Error when clicking inside editor

v6
1

Hello,
I have CodeMirror 6 setup inside an angular 15 application. For the most part, everything seems to work fine, except for one thing: Whenever the user clicks inside the editor, an error appears in the devtools. Here is the error message on chrome/edge:

Unable to preventDefault inside passive event listener invocation.

And this is the error message on firefox:

Ignoring ‘preventDefault()’ call on event of type ‘mouseup’ from a listener registered as ‘passive’.

From what I gathered, the error seems to come from a class called MouseSelection (see image).

Screenshot from 2023-03-12 15-59-49
Screenshot from 2023-03-12 15-59-49838×850 119 KB

Now I’m wondering: Am I doing something wrong, or is this an issue with CodeMirror?

The way I’m instancing the editor is as follows:
Inside the constructor, I create the editorView object:
this.editorView = new EditorView();

After the view is initialized, I setup the EditorState and add it to the DOM, as such:

const editorExtensions = [
            basicSetup,
            images(),
            math(),
            this.initLanguage(this.language),
        ];

const editorState = EditorState..create({
            doc: yText.toString(),
            extensions: editorExtensions,
        });

this.editorView.setState(this.setupEditorState());

this.editorParentElement.appendChild(this.editorView.dom);

The editorParentElement variable is a HTMLElement object which contains the editor’s parent (a div element)

2

The only mouseup handler added by the library is non-passive. One possibility is that Angular is somehow inserting itself in the DOM’s addEventListener method and making stuff passive that shouldn’t be.

3

Hello. Thank you for your reply. I have found the cuprit. It wasn’t angular, but it was a custom scrollbar library I was using which was injecting mouse event handlers. I’ve managed to fix the issue.
Thank you for your help. Have a nice day!