diff --git a/packages/react-core/src/components/Dropdown/Dropdown.tsx b/packages/react-core/src/components/Dropdown/Dropdown.tsx index a35ad8b4b4d..92c513c7815 100644 --- a/packages/react-core/src/components/Dropdown/Dropdown.tsx +++ b/packages/react-core/src/components/Dropdown/Dropdown.tsx @@ -111,8 +111,8 @@ const DropdownBase: React.FunctionComponent = ({ }; const handleClick = (event: MouseEvent) => { - // toggle was clicked open via keyboard, focus on first menu item - if (isOpen && toggleRef.current?.contains(event.target as Node) && event.detail === 0) { + // toggle was opened, focus on first menu item + if (isOpen && toggleRef.current?.contains(event.target as Node)) { setTimeout(() => { const firstElement = menuRef?.current?.querySelector( 'li button:not(:disabled),li input:not(:disabled),li a:not([aria-disabled="true"])' diff --git a/packages/react-core/src/components/Menu/MenuContainer.tsx b/packages/react-core/src/components/Menu/MenuContainer.tsx index 027201f688b..6208fb02222 100644 --- a/packages/react-core/src/components/Menu/MenuContainer.tsx +++ b/packages/react-core/src/components/Menu/MenuContainer.tsx @@ -69,8 +69,8 @@ export const MenuContainer: React.FunctionComponent = ({ }; const handleClick = (event: MouseEvent) => { - // toggle was clicked open via keyboard, focus on first menu item - if (isOpen && toggleRef.current?.contains(event.target as Node) && event.detail === 0) { + // toggle was opened, focus on first menu item + if (isOpen && toggleRef.current?.contains(event.target as Node)) { setTimeout(() => { const firstElement = menuRef?.current?.querySelector( 'li button:not(:disabled),li input:not(:disabled),li a:not([aria-disabled="true"])' diff --git a/packages/react-core/src/components/Pagination/PaginationOptionsMenu.tsx b/packages/react-core/src/components/Pagination/PaginationOptionsMenu.tsx index 8d8f624f98e..a3d400773c5 100644 --- a/packages/react-core/src/components/Pagination/PaginationOptionsMenu.tsx +++ b/packages/react-core/src/components/Pagination/PaginationOptionsMenu.tsx @@ -124,10 +124,8 @@ export const PaginationOptionsMenu: React.FunctionComponent { - // If the event is on the toggle and was fired via keyboard 'click', focus the first - // non-disabled menu item - // https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/detail - if (event.detail === 0 && isOpen && toggleRef.current?.contains(event.target as Node)) { + // Focus the first non-disabled menu item on toggle 'click' + if (isOpen && toggleRef.current?.contains(event.target as Node)) { setTimeout(() => { const firstElement = menuRef?.current?.querySelector('li button:not(:disabled)'); firstElement && (firstElement as HTMLElement).focus(); diff --git a/packages/react-core/src/components/Select/Select.tsx b/packages/react-core/src/components/Select/Select.tsx index e5bf254ca4d..4a46ab93b12 100644 --- a/packages/react-core/src/components/Select/Select.tsx +++ b/packages/react-core/src/components/Select/Select.tsx @@ -124,8 +124,8 @@ const SelectBase: React.FunctionComponent = ({ }; const handleClick = (event: MouseEvent) => { - // toggle was clicked open via keyboard, focus on first menu item - if (isOpen && toggleRef.current?.contains(event.target as Node) && event.detail === 0) { + // toggle was opened, focus on first menu item + if (isOpen && toggleRef.current?.contains(event.target as Node)) { setTimeout(() => { const firstElement = menuRef?.current?.querySelector('li button:not(:disabled),li input:not(:disabled)'); firstElement && (firstElement as HTMLElement).focus();