Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

bug(drag-drop): scrolling on mobile blocked for disabled drag handle #20974

Closed
patagonaa opened this issue Nov 5, 2020 · 1 comment · Fixed by #20991
Closed

bug(drag-drop): scrolling on mobile blocked for disabled drag handle #20974

patagonaa opened this issue Nov 5, 2020 · 1 comment · Fixed by #20991
Assignees
@crisbeto
Labels
area: cdk/drag-drop P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@patagonaa
Copy link

Reproduction

A cdkDropList (any kind of drag-drop-countainer would most likely have this issue as well) with disabled cdkDrag items which have a drag handle inside.
https://angular-st9rbb.stackblitz.io/
https://stackblitz.com/edit/angular-st9rbb?file=src%2Fapp%2Fcdk-drag-drop-disabled-example.html

Steps to reproduce:

  1. Switch browser to mobile view / use touchscreen
  2. Try to scroll by first touching the drag handle and moving up/down

Expected Behavior

Scrolling (with a touch screen) is possible, even on the drag handle if the cdkDrag item is disabled.

Actual Behavior

Scrolling is impossible, because the drag handle blocks scrolling, even if it is disabled:
cdk-drag-issue

Environment

  • Angular: 10.0.0
  • CDK/Material: 10.0.0 (also tested with latest 10.2.7 and issue persists)
  • Browser(s): Chrome, Firefox, iOS Safari, Android Chrome
  • Operating System (e.g. Windows, macOS, Ubuntu): Windows, iOS, Android
@patagonaa patagonaa added the needs triage This issue needs to be triaged by the team label Nov 5, 2020
@crisbeto crisbeto added area: cdk/drag-drop P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent and removed needs triage This issue needs to be triaged by the team labels Nov 9, 2020
@crisbeto crisbeto self-assigned this Nov 9, 2020
@crisbeto crisbeto added the has pr label Nov 9, 2020
crisbeto added a commit to crisbeto/material2 that referenced this issue Nov 9, 2020
@crisbeto
fix(cdk/drag-drop): don't disable native dragging on inactive handles
9390b98 
Currently we disable native drag interactions on handles once when they're registered,
however this can block scrolling on mobile devices if the handle is inactive (either it
is disabled or the drag element is disabled).

These changes toggle the state dynamically depending on the active state.

Fixes angular#20974.
@crisbeto crisbeto mentioned this issue Nov 9, 2020
Merged
wagnermaciel pushed a commit that referenced this issue Nov 17, 2020
@crisbeto
fix(cdk/drag-drop): don't disable native dragging on inactive handles (…
f133210 
…#20991)

Currently we disable native drag interactions on handles once when they're registered,
however this can block scrolling on mobile devices if the handle is inactive (either it
is disabled or the drag element is disabled).

These changes toggle the state dynamically depending on the active state.

Fixes #20974.
wagnermaciel pushed a commit that referenced this issue Nov 17, 2020
@crisbeto @wagnermaciel
fix(cdk/drag-drop): don't disable native dragging on inactive handles (…
dcf870d 
…#20991)

Currently we disable native drag interactions on handles once when they're registered,
however this can block scrolling on mobile devices if the handle is inactive (either it
is disabled or the drag element is disabled).

These changes toggle the state dynamically depending on the active state.

Fixes #20974.

(cherry picked from commit f133210)
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Dec 18, 2020
wagnermaciel pushed a commit to wagnermaciel/components that referenced this issue Jan 14, 2021
@crisbeto @wagnermaciel
fix(cdk/drag-drop): don't disable native dragging on inactive handles (…
7713705 
…angular#20991)

Currently we disable native drag interactions on handles once when they're registered,
however this can block scrolling on mobile devices if the handle is inactive (either it
is disabled or the drag element is disabled).

These changes toggle the state dynamically depending on the active state.

Fixes angular#20974.
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@crisbeto crisbeto

Labels
area: cdk/drag-drop P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(cdk/drag-drop): don't disable native dragging on inactive handles crisbeto/material2
2 participants
@crisbeto @patagonaa