Skip to content

Commit a9c39a6

Browse files
authored
Fix crash in TimeField on Android (#6717)
1 parent 96506d1 commit a9c39a6

File tree

1 file changed

+11
-0
lines changed

1 file changed

+11
-0
lines changed

packages/@react-aria/datepicker/src/useDateSegment.ts

Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -269,6 +269,17 @@ export function useDateSegment(segment: DateSegment, state: DateFieldState, ref:
269269
selection.collapse(ref.current);
270270
};
271271

272+
let documentRef = useRef(typeof document !== 'undefined' ? document : null);
273+
useEvent(documentRef, 'selectionchange', () => {
274+
// Enforce that the selection is collapsed when inside a date segment.
275+
// Otherwise, when tapping on a segment in Android Chrome and then entering text,
276+
// composition events will be fired that break the DOM structure and crash the page.
277+
let selection = window.getSelection();
278+
if (ref.current.contains(selection.anchorNode)) {
279+
selection.collapse(ref.current);
280+
}
281+
});
282+
272283
let compositionRef = useRef('');
273284
// @ts-ignore - TODO: possibly old TS version? doesn't fail in my editor...
274285
useEvent(ref, 'beforeinput', e => {

0 commit comments

Comments
 (0)