[LWC] TaskBoard ColumnDrag feature not working with Lightning Web Security

[chuckn0rris]

Forum post

Hello there!

I've come across this bug whilst working on other LWS related issues, and it is a weird one. The columnDrag feature is working OK with the Locker Service but is broken when Lightning Web Security is enabled. The weirdness comes from the fact that task dragging is fine!

After some debugging I discovered that when I'm dragging a task, the target of "mousemove" event is the element which I clicked to initiate the drag. But if I grab a column, then the event.target is suddenly the topmost Lightning web component's custom element, way up the DOM tree and outside of the TaskBoard's host element! Because of this, updating the targetElement on the DragContext fails to locate droppables in the DomDataStore, which is why the target is never updated, the dragEnter is never called, and dropIndicators are never defined, which causes and exception in insertDropIndicators, which results in missing drop zones and the frozen UI.

I had a closer look at both TaskDrag and ColumnDrag features, but still could not understand why they receive such different targets from the "mousemove" event. I can see that their dragSelector config is different, but this does not explain why one works as expected and the other one is misbehaving.

I would very much appreciate it if someone pointed me in the right direction.

Thanks