Fix ConfirmButton Enter/Space keydown bubbling to parent row handler
The button's onClick stopped mouse event propagation, but keyboard Enter/Space fired a separate keydown event that bubbled to the combatant row's onKeyDown, opening the stat block side panel instead of arming/confirming the button. Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -195,4 +195,24 @@ describe("ConfirmButton", () => {
|
||||
fireEvent.blur(button);
|
||||
expect(screen.getByTestId("x-icon")).toBeTruthy();
|
||||
});
|
||||
|
||||
it("Enter/Space keydown stops propagation to prevent parent handlers", () => {
|
||||
const parentHandler = vi.fn();
|
||||
render(
|
||||
// biome-ignore lint/a11y/noStaticElementInteractions: test wrapper
|
||||
<div onKeyDown={parentHandler}>
|
||||
<ConfirmButton
|
||||
icon={<XIcon />}
|
||||
label="Remove combatant"
|
||||
onConfirm={vi.fn()}
|
||||
/>
|
||||
</div>,
|
||||
);
|
||||
const button = screen.getByRole("button");
|
||||
|
||||
fireEvent.keyDown(button, { key: "Enter" });
|
||||
fireEvent.keyDown(button, { key: " " });
|
||||
|
||||
expect(parentHandler).not.toHaveBeenCalled();
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user