Skip to content

Bug: LexicalTypeaheadMenuPlugin closes when trying to scroll inside the dropdown list #7837

@SanjidChowdhury

Description

@SanjidChowdhury

In the LexicalTypeaheadMenuPlugin dropdown, when I'm rendering a list of about 50 users, and the dropdown overflows with a scrollbar, trying to go down the user list by using the arrow keys or scrolling with the mouse closes the dropdown.

When using the arrow keys, the items in view are iterated, but closes the moment I'm about to scroll. Same thing happens when I try to scroll with my mouse by hovering over it and using the scroll wheel, or by clicking and dragging the scrollbar (the dropdown closes during the drag, not the click). What's more interesting is that the onClose event does not fire when it closes like this.

Lexical version: 0.35.0

Steps To Reproduce

  1. Click on the editor and type in @A, it should prop a dropdown which is overflowing with a scrollbar
  2. Try scrolling the dropdown with your mouse, or arrow keys

Link to code example: https://codesandbox.io/p/sandbox/qrz5n5

The current behavior

Dropdown closes instead of scrolling

The expected behavior

Dropdown should scroll and not close

Impact of fix

The bug is quite severe; it is blocking me from shipping a core feature.

Metadata

Metadata

Assignees

No one assigned

    Labels

    good first issueGood for newcomerspopoverIssues related to popover/menu code in the playground

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions