-
Notifications
You must be signed in to change notification settings - Fork 29k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Fix scrolling behavior in menu while zoomed in #80965
Conversation
@jeanp413 thanks for the PR. and thanks for the pointer about the chrome issue. I notice some of the changes are just rearranging of lines and additionally some changes in the submenuviewitem. Are these changes strictly necessary to address the issue? If not, I would like to keep this PR to the minimum amount of changes. Additionally, some of the changes are in actionbar, which I am hesitant to take anything that affects more than the menu widget. So, it might be better to pull more of that code up a layer. |
@@ -747,7 +747,7 @@ export class ActionBar extends Disposable implements IActionRunner { | |||
|
|||
protected updateFocus(fromRight?: boolean): void { | |||
if (typeof this.focusedItem === 'undefined') { | |||
this.actionsList.focus(); | |||
this.actionsList.focus({ preventScroll: true }); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
The { preventScroll: true }
is necessary to avoid scrolling up when focusing on the actions-container
because of the padding from monaco-action-bar animated vertical
} | ||
this.scrollableElement.scanDomNode(); | ||
})); | ||
this.push(actions, { icon: true, label: true, isMenu: true }); |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
This change is necessary. this.scrollableElement
must be created before calling this because now it's being used directly in get onScroll()
@jeanp413 If it isn't necessary to fix the original issue, let's revert it. Testing it, I seet that it works and once we have it to a minimum we can see if we need to worry about the code change in actionbar.ts |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
as mentioned, let's focus the changes strictly to what's necessary
Reverted some changes. Let me know if that's enough |
@jeanp413 This is looking great, I hope you don't mind but I moved the logic you had in I also made one additional minor change to ensure the prevent scroll behavior doesn't break other instances of actionbar. Please take a look and see if you agree with my changes. |
@sbatten yeah it's great, but I found a minor issue when you click on the scrollbar it doesn't stop tracking it. Seems like it's necessary to let the event propagate because it's used here vscode/src/vs/base/browser/globalMouseMoveMonitor.ts Lines 87 to 93 in ede82b1
|
@jeanp413 good catch, updated and merging |
if (e.defaultPrevented) { | ||
return; | ||
} |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
@sbatten I tested this and it fixes the issue for level 1 menus but it doesn't fix it for submenus with level > 1
I think we need to add the same check here
vscode/src/vs/base/browser/ui/menu/menu.ts
Lines 392 to 395 in 26cb1c8
this._register(addDisposableListener(this.element, EventType.MOUSE_UP, e => { | |
EventHelper.stop(e, true); | |
this.onClick(e); | |
})); |
vscode/src/vs/base/browser/ui/menu/menubar.ts
Lines 371 to 379 in 26cb1c8
this._register(DOM.addDisposableListener(buttonElement, DOM.EventType.MOUSE_UP, (e) => { | |
if (!this.ignoreNextMouseUp) { | |
if (this.isFocused) { | |
this.onMenuTriggered(MenuBar.OVERFLOW_INDEX, true); | |
} | |
} else { | |
this.ignoreNextMouseUp = false; | |
} | |
})); |
Fixes #80047