adobe / adobe/react-spectrum

Opening the menu causes the page to scroll

Open
#8,105 4 comments 0 reactions 0 assignees View on GitHub
Dominant language
TypeScript
Stars
15.9k
Forks
1.6k
Avg merge
3d 9m
Merged PRs (30d)
59

Description

### Provide a general summary of the issue here

We observe strange behaviour that is only noticeable in mobile mode. We have a navigation bar (position:fixed) with a trigger button aligned to the right side of the viewport. We scroll the page down and click the button that opens the menu, the page scrolls up a few pixels without keeping its original position then.

### 🤔 Expected Behavior?

the scroll position should remain the same

### 😯 Current Behavior

the page jumps a few pixels up after closing the menu

### 💁 Possible Solution

when we set the width or min-width of the menu in our css, the behaviour is correct

### 🔦 Context

_No response_

### 🖥️ Steps to Reproduce

- open https://stackblitz.com/edit/vitejs-vite-tg892utj
- click "Open preview in new tab"
- turn on developer tools, click Toggle Device Toolbar
- choose Responsive - Mobile mode
- make sure vertical scrollbar is on
- scroll the page down
- click "hamburger menu" icon to open the menu
- scroll position is not restored and the page is moved a few pixels up

### Version

1.10.1

### What browsers are you seeing the problem on?

Chrome

### If other, please specify.

Version 137.0.7151.69 (Official Build) (arm64)

### What operating system are you using?

MacOS

### 🧢 Your Company/Team

_No response_

### 🕷 Tracking Issue

_No response_

Contributor guide

Open the contributing guide

Assessment

This issue has not been assessed yet.

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.