search

emilkowalski / vaul

A drawer component for React.
https://vaul.emilkowal.ski
MIT License
6.45k stars 215 forks source link

Issue: Drawer gets stuck in drag mode when changing a `<select>` option on Desktop Safari #483

Closed elationbase closed 1 month ago

elationbase commented 1 month ago

👋

Description:

When using the Vaul Drawer component on Desktop Safari, if there’s an HTML <select> element inside the drawer and the user interacts with it (when changing the option), the drawer gets stuck in drag mode

Sandbox: https://codesandbox.io/p/sandbox/8glhq5

Video demo: https://github.com/user-attachments/assets/16283410-579d-42f1-9755-69c6bb472d1d

Steps to Reproduce:

  1. Render a Drawer component that contains a native HTML by changing the option.
  2. Observe that the drawer gets stuck in drag mode, only scape key will allow you to move out.

Expected Behavior: The drawer should not enter or stay in drag mode when interacting with a <select> element in Desktop Safari. It should allow smooth selection without affecting the drawer’s behavior.

Actual Behavior: The drawer becomes stuck in drag mode when the user changes the option in the <select> dropdown.

Thanks!

emilkowalski commented 1 month ago

Fixed in #487