search

microsoft / vscode-edge-devtools

A VSCode extension that allows you to use browser devtools from within the editor. The devtools will connect to an instance of Microsoft Edge giving you the ability to alter CSS styling, perform diagnostics, and debugging. Get it now at http://aka.ms/devtools-for-code
https://docs.microsoft.com/microsoft-edge/visual-studio-code/microsoft-edge-devtools-extension
MIT License
754 stars 261 forks source link

ScrollIntoView() causing the whole page to move #1529

Open jackiotyu opened 1 year ago

jackiotyu commented 1 year ago

Describe the bug:

the whole page to move while click the console panel or focus some elements

Repro steps:

devtools start with elements panel. click console panel.

Expected behavior:

Keep the devtools in its original position Additional context: It works with my custom devtools build. https://stackoverflow.com/questions/11039885/scrollintoview-causing-the-whole-page-to-move

image image
captainbrosset commented 1 year ago

Thanks for reporting this. I'm a little unclear as to whether this something that happens within your web page only, or if there is also a scrolling problem in DevTools? Are you seeing the DevTools panel scroll? If so, could you please provide a screen recording?

jackiotyu commented 1 year ago

It's the devtools's panel scrolling problem. I will provide screen recording later.

jackiotyu commented 1 year ago

edge-devtools image

It will be offset by about 4px

webview-devtools It can be fixed by giving more params to scrollIntoView method. Just a suggestion🤝

captainbrosset commented 1 year ago

Amazing, thank you for the additional information and screen recordings. They help a lot. Let me make sure this is tracked by the team for prioritization.

AXLWeb commented 1 year ago

Did anyone found any work-around ? I am facing a very similar issue. When having more scrolls in page and one layer has an animation with width (from 0 to 100%) scrollintoView reveals that hidden layer.

Check this demo: https://jsfiddle.net/nb6ag897/

Notice that when you have other scrolls whole page is moved instead of just desired scroll area. Does anyone knows a workaround to prevent this happening ?