fix: prevent drag selection from blocking input focus (#12322)
closes #12309 Fixes input elements becoming unusable due to drag selection preventing default browser behavior. **Problem:** - Input elements couldn't receive focus because `event.preventDefault()` was called unconditionally - Removing `preventDefault()` broke click-outside-to-deselect functionality **Solution:** - Only call `preventDefault()` when actually starting drag selection - Preserves input focus while maintaining drag selection and deselection behavior **Changes:** - Move `event.preventDefault()` inside the `shouldStartSelecting` condition - Update test to reflect correct behavior for disabled elements
This commit is contained in:
@ -101,8 +101,8 @@ export const DragSelect = ({
|
|||||||
width: 0,
|
width: 0,
|
||||||
height: 0,
|
height: 0,
|
||||||
});
|
});
|
||||||
|
event.preventDefault();
|
||||||
}
|
}
|
||||||
event.preventDefault();
|
|
||||||
},
|
},
|
||||||
onMouseMove: ({ x, y, event }) => {
|
onMouseMove: ({ x, y, event }) => {
|
||||||
if (isDragging) {
|
if (isDragging) {
|
||||||
|
|||||||
@ -76,6 +76,28 @@ describe('DragSelect', () => {
|
|||||||
event: mockEvent,
|
event: mockEvent,
|
||||||
});
|
});
|
||||||
|
|
||||||
|
expect(mockEvent.preventDefault).not.toHaveBeenCalled();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should start selection and call preventDefault on regular elements', () => {
|
||||||
|
renderDragSelect();
|
||||||
|
|
||||||
|
const callbacks = (window as any).trackPointerCallbacks;
|
||||||
|
const mockTarget = document.createElement('div');
|
||||||
|
mockSelectableContainer.appendChild(mockTarget);
|
||||||
|
mockSelectableContainer.contains = jest.fn().mockReturnValue(true);
|
||||||
|
|
||||||
|
const mockEvent = {
|
||||||
|
target: mockTarget,
|
||||||
|
preventDefault: jest.fn(),
|
||||||
|
};
|
||||||
|
|
||||||
|
callbacks.onMouseDown({
|
||||||
|
x: 150,
|
||||||
|
y: 150,
|
||||||
|
event: mockEvent,
|
||||||
|
});
|
||||||
|
|
||||||
expect(mockEvent.preventDefault).toHaveBeenCalled();
|
expect(mockEvent.preventDefault).toHaveBeenCalled();
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
Reference in New Issue
Block a user