Skip to content

fix(drag-drop): prevent dragging selected text with the mouse #18103

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.

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

Merged
merged 1 commit into from
Jan 22, 2020

Conversation

crisbeto
Copy link
Member

@crisbeto crisbeto commented Jan 4, 2020

When a drag item has some selected text inside it and the user starts dragging after a small delay, they'll pause our dragging sequence mid-way and start the native browser text dragging. Once they've stopped dragging the text, our dragging takes over which ends up looking glitchy. The problem comes from the fact that for mouse events we were calling preventDefault only after the delay and the drag threshold had been reached, whereas for touch events we were doing it all the time. These changes move the preventDefault call up so we call it for all mouse events as well.

Here's what the bug looks like:
demo

When a drag item has some text inside it and the user starts dragging after a small delay, they'll pause our dragging sequence mid-way and start the native browser text dragging. Once they've stopped dragging the text, our dragging takes over which ends up looking glitchy. The problem comes from the fact that for mouse events we were calling `preventDefault` only after the delay and the drag threshold had been reached, whereas for touch events we were doing it all the time. These changes move the `preventDefault` call up so we call it for all mouse events as well.
@crisbeto crisbeto added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release labels Jan 4, 2020
@googlebot googlebot added the cla: yes PR author has agreed to Google's Contributor License Agreement label Jan 4, 2020
Copy link
Member

@jelbourn jelbourn left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

LGTM

@jelbourn jelbourn added pr: lgtm action: merge The PR is ready for merge by the caretaker labels Jan 10, 2020
@jelbourn jelbourn merged commit a949db3 into angular:master Jan 22, 2020
jelbourn pushed a commit that referenced this pull request Jan 22, 2020
When a drag item has some text inside it and the user starts dragging after a small delay, they'll pause our dragging sequence mid-way and start the native browser text dragging. Once they've stopped dragging the text, our dragging takes over which ends up looking glitchy. The problem comes from the fact that for mouse events we were calling `preventDefault` only after the delay and the drag threshold had been reached, whereas for touch events we were doing it all the time. These changes move the `preventDefault` call up so we call it for all mouse events as well.

(cherry picked from commit a949db3)
yifange pushed a commit to yifange/components that referenced this pull request Jan 30, 2020
…r#18103)

When a drag item has some text inside it and the user starts dragging after a small delay, they'll pause our dragging sequence mid-way and start the native browser text dragging. Once they've stopped dragging the text, our dragging takes over which ends up looking glitchy. The problem comes from the fact that for mouse events we were calling `preventDefault` only after the delay and the drag threshold had been reached, whereas for touch events we were doing it all the time. These changes move the `preventDefault` call up so we call it for all mouse events as well.
@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 Feb 22, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
action: merge The PR is ready for merge by the caretaker cla: yes PR author has agreed to Google's Contributor License Agreement P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent target: patch This PR is targeted for the next patch release
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants