Skip to content
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

Scolling in additional action menu broken when hovering horizontal lines #4539

Closed
christianlupus opened this issue Sep 18, 2023 · 1 comment · Fixed by #4846
Closed

Scolling in additional action menu broken when hovering horizontal lines #4539

christianlupus opened this issue Sep 18, 2023 · 1 comment · Fixed by #4846
Labels
accessibility Making sure we design for the widest range of people possible, including those who have disabilities bug Something isn't working feature: actions Related to the actions components high High priority regression Regression of a previous working feature

Comments

@christianlupus
Copy link
Contributor

Hello,

I found an issue most probably with the Vue Nextcloud library. It was reported in nextcloud/spreed#10520 originally. See also that issue for additional information.

Mainly, in a list of additional actions with hlines, the scrolling is broken when hovering over the lines. In fact, the scrolling is programmatically reset while hovering rendering some functions inaccessible.

I think a screencast is the most clear explanation here (I wanted to remove the entry, the very last menu point in the list):

vokoscreenNG-2023-09-17_10-36-45.mp4

According to @Antreesy, the issue can be worked around by disabling an event handler:

Hi, Christian! This definitely looks like an issue with vue-library, and should come from this code , as removing this listener via DevTools helps:

onMouseFocusAction(event) {
if (document.activeElement === event.target) {
return
}
const menuItem = event.target.closest('li')
if (menuItem) {
const focusableItem = menuItem.querySelector(focusableSelector)
if (focusableItem) {
const focusList = this.$refs.menu.querySelectorAll(focusableSelector)
const focusIndex = [...focusList].indexOf(focusableItem)
if (focusIndex > -1) {
this.focusIndex = focusIndex
this.focusAction()
}
}
}
},

@ChristophWurst
Copy link
Contributor

jumping-actions-2023-11-15_16.40.25.mp4

can confirm

@ChristophWurst ChristophWurst added bug Something isn't working feature: actions Related to the actions components regression Regression of a previous working feature labels Nov 15, 2023
@ShGKme ShGKme added high High priority accessibility Making sure we design for the widest range of people possible, including those who have disabilities labels Nov 16, 2023
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
accessibility Making sure we design for the widest range of people possible, including those who have disabilities bug Something isn't working feature: actions Related to the actions components high High priority regression Regression of a previous working feature
Projects
None yet
3 participants