Skip to content

Commit 2487c50

Browse files
authored
Prevent unexpected column resizer input blur when focused via dropdown menu (#4876)
* Fix resize input focus issue when triggering resize from dropdown menu in Android Chome due to #1513, Android Chrome would cause a premature focus shift from the resizer input to the body/whatever element was underneath the "resize column" menu option, causing resizing to end early and canceling the 2nd delayed focusInput call. We delay the first focusInput call now so that it happens after the browser delayed click on touch end * clear timeout if it column somehow unmounts before it also reconfirmed that we still need the 400ms timeout for VO iOS
1 parent 1fe3d69 commit 2487c50

File tree

1 file changed

+7
-3
lines changed

1 file changed

+7
-3
lines changed

packages/@react-aria/table/src/useTableColumnResize.ts

Lines changed: 7 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -199,10 +199,14 @@ export function useTableColumnResize<T>(props: AriaTableColumnResizeProps<T>, st
199199
if (prevResizingColumn.current !== resizingColumn && resizingColumn != null && resizingColumn === item.key) {
200200
wasFocusedOnResizeStart.current = document.activeElement === ref.current;
201201
startResize(item);
202-
focusInput();
202+
// Delay focusing input until Android Chrome's delayed click after touchend happens: https://bugs.chromium.org/p/chromium/issues/detail?id=1150073
203+
let timeout = setTimeout(() => focusInput(), 0);
203204
// VoiceOver on iOS has problems focusing the input from a menu.
204-
let timeout = setTimeout(focusInput, 400);
205-
return () => clearTimeout(timeout);
205+
let VOTimeout = setTimeout(focusInput, 400);
206+
return () => {
207+
clearTimeout(timeout);
208+
clearTimeout(VOTimeout);
209+
};
206210
}
207211
prevResizingColumn.current = resizingColumn;
208212
}, [resizingColumn, item, focusInput, ref, startResize]);

0 commit comments

Comments
 (0)