fix: close other open toolbar menus when a menu button is clicked
The toggle button used @click.stop, which halted the click before it reached the document-level outside-click listeners. As a result, opening one dropdown (e.g. export) left a previously-opened dropdown (e.g. generate) still open. The containment check in handleDocumentClick already prevents a toggle's own opening click from self-closing, so .stop was unnecessary; removing it lets sibling menus close on outside click as intended. Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
@@ -69,4 +69,21 @@ describe('ToolbarMenuButton', () => {
|
||||
expect(wrapper.find('[data-testid="item-a"]').exists()).toBe(false)
|
||||
wrapper.unmount()
|
||||
})
|
||||
|
||||
it('closes an open menu when another menu button is clicked', async () => {
|
||||
const first = mountMenu({ label: '生成 ▾', toggleTestid: 'generate-menu-toggle' })
|
||||
const second = mountMenu({ label: '导出 ▾', toggleTestid: 'export-menu-toggle' })
|
||||
|
||||
await first.get('button[data-testid="generate-menu-toggle"]').trigger('click')
|
||||
expect(first.find('[data-testid="item-a"]').exists()).toBe(true)
|
||||
|
||||
await second.get('button[data-testid="export-menu-toggle"]').trigger('click')
|
||||
await first.vm.$nextTick()
|
||||
|
||||
expect(second.find('[data-testid="item-a"]').exists()).toBe(true)
|
||||
expect(first.find('[data-testid="item-a"]').exists()).toBe(false)
|
||||
|
||||
first.unmount()
|
||||
second.unmount()
|
||||
})
|
||||
})
|
||||
|
||||
@@ -47,7 +47,7 @@ onUnmounted(() => {
|
||||
:data-testid="toggleTestid"
|
||||
:disabled="disabled"
|
||||
:aria-expanded="open"
|
||||
@click.stop="toggle"
|
||||
@click="toggle"
|
||||
>
|
||||
{{ label }}
|
||||
</button>
|
||||
|
||||
Reference in New Issue
Block a user