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.

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

H5 Delay on dropping elements on latest Chrome MacOS Big Sur #1541

Closed
kevinlandsberg opened this issue Dec 20, 2020 · 5 comments
Closed

H5 Delay on dropping elements on latest Chrome MacOS Big Sur #1541

kevinlandsberg opened this issue Dec 20, 2020 · 5 comments

Comments

@kevinlandsberg
Copy link

kevinlandsberg commented Dec 20, 2020

Subject of the issue

Disturbing delay on dropping grid item after they were dragged around

Your environment

  • Gridstack.js version: 3.1.2 with HTML5
  • Google Chrome Version 87.0.4280.88 (Official Build) (arm64)

Steps to reproduce

Visit homepage of library and drag any grid-item of any example.

Expected behavior

No delay on dropping grid-items after they were dragged around

Actual behavior

Delays 1-2 seconds on dropping grid-items after they were dragged around

@kevinlandsberg kevinlandsberg changed the title Delay on dropping elements on Chrome MacOS Big Sur Delay on dropping elements on latest Chrome MacOS Big Sur Dec 20, 2020
@adumesny
Copy link
Member

what browser is that for and do you see the same slowdown in other browsers (which I don't see on chrome/Win10)

@adumesny adumesny changed the title Delay on dropping elements on latest Chrome MacOS Big Sur H5 Delay on dropping elements on latest Chrome MacOS Big Sur Dec 20, 2020
@kevinlandsberg
Copy link
Author

Hi @adumesny ,

this slowdown happened to me on Googles Chrome and Firefox on MacOS Big Sur latest version, also latest versions of both browsers. In Safari gridstack does not seem to work anyway...
I cannot reproduce these issues on Windows on any browser also...

@kevinlandsberg kevinlandsberg changed the title H5 Delay on dropping elements on latest Chrome MacOS Big Sur H5 Hard delay on dropping elements on latest Chrome MacOS Big Sur Dec 20, 2020
@kevinlandsberg kevinlandsberg changed the title H5 Hard delay on dropping elements on latest Chrome MacOS Big Sur H5 Delay on dropping elements on latest Chrome MacOS Big Sur Dec 20, 2020
@adumesny
Copy link
Member

adumesny commented Jan 4, 2021

no longer seeing the issue with Chrome and 3.1.3-dev build (appears fixed), BUT still seeing on Safari! (it animates back to original location (if I force a clone copy I can see old+new), then to new location - hence the 300msec delay before animating to dropped location.

@kevinlandsberg
Copy link
Author

@adumesny , correct. Still seeing delays on dropping elements.

adumesny added a commit to adumesny/gridstack.js that referenced this issue Jan 9, 2021
fix for gridstack#1541
* on Safari we had a delay due to a 300ms+ animatin back to old location on drop.
'dragend' wasn't called (what we use) until that animation was done.
to fix that had to call `preventDefault()` during drag
https://stackoverflow.com/questions/61760755/how-to-fire-dragend-event-immediately
* for that to work I ALSO had to remove `{passive: true}` when adding the drag event, so passing just 'true' for grabing event

NOTE:  I noticed Safari doesn't auto-scroll the grid (didn't before), but chrome Mac does.
html5 drag event is painfully incompatible between browsers...
adumesny added a commit to adumesny/gridstack.js that referenced this issue Jan 9, 2021
fix for gridstack#1541
* on Safari we had a delay due to a 300ms+ animating back to old location on drop.
'dragend' wasn't called (what we use) until that animation was done.
to fix that had to call `preventDefault()` during drag
https://stackoverflow.com/questions/61760755/how-to-fire-dragend-event-immediately
* for that to work I ALSO had to remove `{passive: true}` when adding the drag event, so passing just 'true' for grabing event

NOTE:  I noticed Safari doesn't auto-scroll the grid (didn't before), but chrome Mac does.
html5 drag event is painfully incompatible between browsers...
@adumesny
Copy link
Member

adumesny commented Jan 9, 2021

fixed in next 3.1.4 release

@adumesny adumesny closed this as completed Jan 9, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants