Skip to content

Cannot select text inside a draggable item that has a drag handle #241

@smassa-auditboard

Description

@smassa-auditboard

Text Selection Issue

I have an element that's marked as a draggable item and a drop zone (for sorting). It has a drag handle. The other text inside the element (not inside the drag handle) can no longer be selected by dragging the cursor over it.

The dragstart event hander gets stuck here:

// if we are not dragging from the drag handle (or something inside the drag handle)
// then we will cancel the active drag
if (!entry.dragHandle.contains(over)) {
event.preventDefault();
return;
}

This guard must be in place for a reason, but I'm not sure what that would be. It does seem to be preventing text selection, though.

Reproducing

I tried to reproduce this in the examples. I can in the Table example (source), but not in the List example (source).

Is the difference that the List example treats the drag handle as the draggable element?

Path Forward

Is this a bug that needs to be fixed in the library or am I approaching it the wrong way?

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type
    No fields configured for issues without a type.

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions