diff --git a/app/ui/lib/ActionMenu.tsx b/app/ui/lib/ActionMenu.tsx index b1aef8600e..aee7a8b1d4 100644 --- a/app/ui/lib/ActionMenu.tsx +++ b/app/ui/lib/ActionMenu.tsx @@ -99,6 +99,7 @@ export function ActionMenu(props: ActionMenuProps) { if (e.key === KEYS.enter) { if (selectedItem) { selectedItem.onSelect() + e.preventDefault() onDismiss() } } else if (e.key === KEYS.down) { diff --git a/test/e2e/action-menu.e2e.ts b/test/e2e/action-menu.e2e.ts new file mode 100644 index 0000000000..6aadc1760d --- /dev/null +++ b/test/e2e/action-menu.e2e.ts @@ -0,0 +1,29 @@ +/* + * This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, you can obtain one at https://mozilla.org/MPL/2.0/. + * + * Copyright Oxide Computer Company + */ +import { expect, test, type Page } from '@playwright/test' + +import { expectNotVisible } from './utils' + +const openActionMenu = async (page: Page) => { + // open the action menu (use the sidenav button, as keyboard events aren't reliable in Playwright) + await page.getByRole('button', { name: 'JUMP TO' }).click() + // make sure the action menu modal is visible + await expect(page.getByText('Enterto submit')).toBeVisible() +} + +test('Ensure that the Enter key in the ActionMenu doesn’t prematurely submit a linked form', async ({ + page, +}) => { + await page.goto('/system/silos') + await openActionMenu(page) + // "New silo" is the first item in the list, so we can just hit enter to open the modal + await page.keyboard.press('Enter') + await expect(page.getByRole('dialog', { name: 'Create silo' })).toBeVisible() + // make sure error text is not visible + await expectNotVisible(page, [page.getByText('Name is required')]) +})