fix(ui): reset higlighted action on keyboard navigation (#32051)

Closes https://github.com/microsoft/playwright/issues/32050

When keyboarding through the action view, the UI continues showing the
hovered action. This makes keyboard nav hard to use.

The fix is to reset the higlighted action on keyboard navigation. This
is what we do when the mouse pointer leaves an action, and what I think
is reasonable.
This commit is contained in:
Simon Knott 2024-08-08 10:06:36 +02:00 committed by GitHub
parent 3d2b5e6801
commit 17bb36a7fe
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
2 changed files with 3 additions and 1 deletions

View file

@ -113,8 +113,9 @@ export const Workbench: React.FunctionComponent<{
const onActionSelected = React.useCallback((action: modelUtil.ActionTraceEventInContext) => {
setSelectedAction(action);
setHighlightedAction(undefined);
onSelectionChanged?.(action);
}, [setSelectedAction, onSelectionChanged]);
}, [setSelectedAction, onSelectionChanged, setHighlightedAction]);
const selectPropertiesTab = React.useCallback((tab: string) => {
setSelectedPropertiesTab(tab);

View file

@ -128,6 +128,7 @@ export function ListView<T>({
scrollIntoViewIfNeeded(element || undefined);
onHighlighted?.(undefined);
onSelected?.(items[newIndex], newIndex);
setHighlightedItem(undefined);
}}
ref={itemListRef}
>