Skip to content

DropdownMenu inside Modal causes scroll-to-top on iOS Safari when using two-phase activation #591

@malinindev

Description

@malinindev

We use a two-phase activation pattern for Modal (mount with active={false}, then switch to active={true} via useEffect) because in the past focus trap didn't work correctly when Modal was mounted with active={true} directly. This issue might already be fixed, but even with two-phase activation the scroll jump shouldn't happen.

Bug: When opening a DropdownMenu inside a scrollable Modal that uses two-phase activation, iOS Safari scrolls the modal content to the top.

Reproduction: https://codesandbox.io/p/sandbox/muddy-leaf-kgr6r6
Steps to reproduce (iOS Safari only):

  1. Open the modal
  2. Scroll down
  3. Tap a DropdownMenu trigger
  4. Modal jumps to the top

Expected: Modal stays at the same scroll position

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    Status

    Waiting for the release

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions