SortableJS/Sortable

[bug] The SortableJS doesn't work in Chrome Version 97. Not even the live demo. Only if you use developer tools.

csetom opened this issue · 12 comments

Describe the bug

With the new Chrome: Version 97.0.4692.71 (Official Build) (64-bit), Sortable doesn't work in user mode, but if you open inspect mode, to see what is the problem, it starts working.

To Reproduce
Steps to reproduce the behavior:

  1. Go to: http://sortablejs.github.io/Sortable/
  2. Click on any element.
  3. Nothing happend.
  4. Push F12 to get developer tools.
  5. Click on any element as normaly try to do, and its starts working.

Expected behavior

It works.

Information

Browser version Chrome: Version 97.0.4692.71 (Official Build) (64-bit)

Any sortablejs build.

Additional context

I tried it only on Linux but I am sure the new Chrome is the problem:

Operating System: Kubuntu 21.04
KDE Plasma Version: 5.21.4
KDE Frameworks Version: 5.80.0
Qt Version: 5.15.2
Kernel Version: 5.11.0-41-generic
OS Type: 64-bit
Graphics Platform: X11
Processors: 4 × Intel® Core™ i5-4590 CPU @ 3.30GHz
Memory: 7,7 GiB of RAM
Graphics Processor: Mesa DRI Intel® HD Graphics 4600

https://sortablejs.github.io/Sortable/ works on chrome 97 on Mac. confirmed just now.

Live-Demo does not work here:
Chrome Version 97.0.4692.71 (Official Build) (64-Bit)
OS: Ubuntu 20.04.3 LTS

Works fine for me on the exact same Chrome version (Windows, 64-bit).

It seems to be related to Ubuntu 20.04 in combination with Chrome Version 97.0.4692.71 (Official Build) (64-bit)

I have tested chrome-unstable (Version 98.0.4758.9 (Official Build) dev (64-bit)) on Ubuntu 20.04 and that seems to work.

We also tested Chrome Version 97.0.4692.71 (Official Build) (64-bit) on Ubuntu 21.04, that works.

Unclear to me is if it is a "sortablejs issue" or a "Chrome on Ubuntu 20.04 issue".

Doesn't work on Gentoo as well, the same Chrome version.

I can confirm this issue for Chrome 97.0.4692.71 on Ubuntu 20.04. I am able to click and drag things and see the drag image moving around, but sorting does not occur, and the dragged element can not be dropped anywhere. Opening the developer tools does not change anything for me.

Everything works as it should in Firefox.

I noticed that using the option forceFallback makes things work for Chrome 97.0.4692.71 on Ubuntu 20.04.

For me the demo worked but it didn't work in my project for some reason. Had to set forceFallback to true and that worked.

Doesn't work on Chromium 97 on Ubuntu 18.04 too, seems like a Chromium bug

I'm having this issue as well with Chrome 124.0.6367.119 (Build oficial) (arm64) on MacOs 14.4.1, it's happening on a specific case but not in others, both of them using the same JS code. So I'm wondering if it's related with the draggable and drop zone element types or attributes.

As a follow up, I found that in this case the native drag & drop API wasn't working because both the draggable element and the drop zone element have the CSS styles reseted through the all: revert; CSS property which seems to be conflicting with the DnD API. Simply removing this property fixed the issue.