angular / angular/components

mat-dialog-content bottom edge scroll blocked on iPhone

Open
#15,995 11 comments 1 reaction 0 assignees View on GitHub
area: material/dialog help wanted P4
Dominant language
TypeScript
Stars
25k
Forks
6.8k
Avg merge
1d 8h
Merged PRs (30d)
91

Description

#### What is the expected behavior?
Scroll at the edges(bottom edge, top edge) of dialog content not blocked..

#### What is the current behavior?
When I test your example Dialog with header, scrollable content and actions - on iPhone - and I scroll and reach the bottom of the scrollable content - when I by accident try to scroll once more towards the bottom - the scroll becomes unresponsive and I cant scroll up or down until I wait one second or more and try to scroll again towards the top...

#### What are the steps to reproduce?
https://stackblitz.com/angular/nqvvaaopbel?file=app%2Fdialog-content-example.ts
Scroll till the bottom end, and when You reach the bottom and scroll bar dissapears - try to scroll again towards bottom - at that moment scroll is blocked (off course you cant scroll towards the bottom because you reached the end - BUT at that moment you ALSO CANT SCROLL TOWARDS THE TOP and seems like scroll is unresponsive until you stop touching the screen for a short time - for example 1second (or little bit less maybe)...

#### Which versions of Angular, Material, OS, TypeScript, browsers are affected?
I tested it on IPhone, Safari, version 12.1...

#### Is there anything else we should know?

Contributor guide

Open the contributing guide

Research direction

Start with the linked StackBlitz Dialog with header, scrollable content and actions, then trace the mat-dialog-content scrolling behavior on iPhone Safari. Done means scrolling remains responsive after reaching either edge, including when an additional swipe is made toward the bottom.

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
42/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.