fix(workspace): align project menu edge
This commit is contained in:
@@ -395,12 +395,14 @@ describe('ProjectSwitcher runtime fields', () => {
|
||||
it('floats the project menu outside the sidebar and keeps menu interactions open', async () => {
|
||||
renderSwitcher()
|
||||
const trigger = screen.getByRole('button', { name: '当前项目' })
|
||||
vi.spyOn(trigger, 'getBoundingClientRect').mockReturnValue(new DOMRect(16, 16, 240, 60))
|
||||
fireEvent.click(trigger)
|
||||
const menu = screen.getByRole('menu')
|
||||
expect(trigger.closest('.project-switcher')).not.toContainElement(menu)
|
||||
expect(menu.closest('.floating-portal')?.parentElement).toBe(document.body)
|
||||
const surface = screen.getByRole('dialog', { name: '项目与活动' })
|
||||
expect(surface.style.width).toBe('680px')
|
||||
expect(surface.style.left).toBe('14px')
|
||||
const selected = within(menu).getByRole('menuitemradio', { checked: true })
|
||||
await waitFor(() => expect(screen.getByRole('tab', { name: '全部项目' })).toHaveFocus())
|
||||
fireEvent.pointerDown(selected)
|
||||
@@ -409,7 +411,7 @@ describe('ProjectSwitcher runtime fields', () => {
|
||||
const width = vi.spyOn(window, 'innerWidth', 'get').mockReturnValue(360)
|
||||
fireEvent(window, new Event('resize'))
|
||||
expect(surface.style.width).toBe('328px')
|
||||
expect(surface.style.left).toBe('16px')
|
||||
expect(surface.style.left).toBe('14px')
|
||||
width.mockRestore()
|
||||
fireEvent.keyDown(selected, { key: 'Escape' })
|
||||
expect(screen.queryByRole('menu')).not.toBeInTheDocument()
|
||||
|
||||
@@ -174,7 +174,7 @@ export function WorkspaceMenu({
|
||||
const rect = anchor.getBoundingClientRect()
|
||||
const width = Math.min(680, window.innerWidth - 32)
|
||||
menu.style.width = `${width}px`
|
||||
menu.style.left = `${Math.max(16, Math.min(rect.left, window.innerWidth - width - 16))}px`
|
||||
menu.style.left = `${Math.max(14, Math.min(rect.left - 2, window.innerWidth - width - 16))}px`
|
||||
const top = Math.max(16, rect.bottom + 8)
|
||||
menu.style.top = `${top}px`
|
||||
menu.style.maxHeight = `${Math.max(0, window.innerHeight - top - 16)}px`
|
||||
|
||||
Reference in New Issue
Block a user