MergeView interferes with EditorView

v6
1

We are using both MergeView for one component on one page and EditorView on a completely separate page of our app. For some reason when we visit the page that contains MergeView, it breaks the EditorView on a completely separate page. When the page with MergeView is closed and we navigate to the page with the EditorView, scrolling no longer is functional within the editor. Also the search dialog does not function properly. I have no idea how the two are correlated together since they are completely separate components on completely separate pages?? But this is reproducible 100% of the time and only happens when we first display the page with MergeView in it. If I refresh the app and navigate directly to the page with EditorView it works fine. Also nothing ever breaks with MergeView.

Is this a bug in code mirror? Any hints would would be appreciated. Thanks.

2

I’ve narrowed down the problem. Just doing this breaks the EditorView in a different page.

    new MergeView({
      a: {
        doc: '',
      },
      b: {
        doc: '',
      },
    });
3

Can you check your devtools network tab to see if any @codemirror/* libraries are being loaded twice? If that’s not it, you’re going to have to try and reduce this to a smaller example script that I could debug.

4

Hey Marijn,

Here is a stripped down reproducible example:

I’m using a MacBook Pro with Chrome 114.0.5735.90.

Scrolling works fine until diff viewer is displayed.

  1. Click on “Show Diff Viewer” (nothing will be displayed)
  2. Click on the button again which will take you back.

I lose vertical scrolling. I pull up the search toolbar and I click the down arrow keys. What happens is that the toolbar is transparent with the text showing in the background.

Screenshot 2023-06-07 at 4.25.23 PM
Screenshot 2023-06-07 at 4.25.23 PM1311×509 74.4 KB

5

Is the React necessary to reproduce this?

6

Yes looks like that is the case. :frowning:
I’ll dig further.