angular / angular/components

bug(autocomplete): scroll locking

Open
#26,484 7 comments 5 reactions 0 assignees View on GitHub
area: material/autocomplete P4
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

### Is this a regression?

- [ ] Yes, this behavior used to work in the previous version

### The previous version in which this bug was not present was

_No response_

### Description

autocomplete does not behave like other material compnents like menu or select - those lock the scrolling of the underlying div/html/body.

![autocomplete](https://user-images.githubusercontent.com/27373333/214404976-70301962-bd39-4340-922c-451d59411a5c.gif)

### Reproduction

Steps to reproduce:
1. https://material.angular.io/components/select/overview
2. open autocomplete and scroll on body

### Expected Behavior

scroll is locked

### Actual Behavior

scrolling is enabled - inconvenient behavior between material components, resulting in multiple issues e.g. z-index or if a container for scrolling is used the autocomplete panel does not scroll.

### Environment

- Angular: 15.1.1
- CDK/Material: 15.1.1
- Browser(s): all
- Operating System (e.g. Windows, macOS, Ubuntu): all

Contributor guide

Open the contributing guide

Research direction

Start by reproducing the issue at the linked Material select overview, comparing autocomplete scrolling with the menu or select behavior. Trace the autocomplete and related overlay behavior in the Angular components repository; done means scrolling the underlying div, html, or body is locked consistently while the autocomplete panel is open.

Written by the indexing model from the issue text.

Assessment

Tech stack
angular, typescript
Domain
frontend
Issue type
Bug
Difficulty
3/5
Estimated time
1-2 days
Activity status
Stale
Clarity
Mostly clear
Newbie friendliness
45/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.