Inaccurate mouse positioning when scrolling pages[Bug]

[TianYu0605]

Reproducible in vscode.dev or in VS Code Desktop?

• [X] Not reproducible in vscode.dev or VS Code Desktop

Reproducible in the monaco editor playground?

• [ ] Not reproducible in the monaco editor playground

Monaco Editor Playground Code

No response

Actual Behavior

When the position of the scroll bar is at the top of the page, the position of the mouse click is the actual displayed position, when I scroll the scroll bar, the position of the mouse click is a distance from the actual focus position, which is exactly the distance of the scroll bar to the top of the page the distance

Expected Behavior

Focus wherever you click in the editor, no matter how you scroll the page

Additional Context

[hediet]

Sorry, I don't understand how to reproduce this issue.

Can you give clear steps?

[TianYu0605]

Sorry for not replying you in time, I am using nextjs, and it is a sub-application of micro frontend framework micro app, when the scroll bar of the page is at the top (that is, no scrolling), the editor can focus normally, but when I When scrolling the page, and then click on the first line of the editor, it will not be able to focus normally

this is my demo

// index.js
import dynamic from 'next/dynamic'

const DynamicMonacoEditor = dynamic(
  () => import('./Editor'),
  {
    ssr: false,
  },
)


const IndexPage = () => {
  return (
    <div>
      <div style={{ width: 500, height: 300, background: 'red' }} />
      <DynamicMonacoEditor
        width={800}
        height={400}
      />
      <div style={{ width: 500, height: 300, background: 'yellow' }} />
    </div>
  )
}

export default IndexPage

// Editor.js
import React from 'react'
import ReactMonacoEditor, { MonacoEditorProps } from 'react-monaco-editor'

const MonacoEditor = ({ options, ...rest }: MonacoEditorProps) => {
  return (
    <ReactMonacoEditor
      options={{
        automaticLayout: true,
        overviewRulerBorder: false,
        ...options,
        minimap: {
          ...options?.minimap,
          enabled: false,
        },
        scrollbar: {
          ...options?.scrollbar,
          alwaysConsumeMouseWheel: false,
        },
      }}
      {...rest}
    />
  )
}

export default React.memo(MonacoEditor)

my steps 1.Without scrolling the page, click on the first line of the editor 2.Scroll the page, the scroll bar is no longer at the top As you can see, the editor is no longer focused

my dependencies: "react-monaco-editor": "^0.46.0", "monaco-editor": "^0.31.1", "monaco-editor-webpack-plugin": "^7.0.1", my environment: mac OS 12.0.1 chrome 103.0.5060.114

[hediet]

Please provide steps for how to reproduce this in the monaco editor. We don't have the resources to try to reproduce issues in third party frameworks (such as NextJS).

[visiky]

I also have the same problem here, is there any solutions?

[hediet]

I'm sorry it doesn't seem to be working, but with so many requests that we get here and in the VS Code issue tracker, we just cannot provide the support we would like to offer.

That said, if you can track down your issue to a specific problem of the Monaco editor, we are more than welcoming a PR by the community! Please use the bug-report issue template to report the issue.

Thanks for your understanding!