diff --git a/libs/ui-toolkit/src/components/dropdown-menu/dropdown-menu.spec.tsx b/libs/ui-toolkit/src/components/dropdown-menu/dropdown-menu.spec.tsx new file mode 100644 index 000000000..e636bc798 --- /dev/null +++ b/libs/ui-toolkit/src/components/dropdown-menu/dropdown-menu.spec.tsx @@ -0,0 +1,34 @@ +import { + DropdownMenu, + DropdownMenuContent, + DropdownMenuTrigger, +} from './dropdown-menu'; +import { render, screen } from '@testing-library/react'; +import userEvent from '@testing-library/user-event'; + +describe('DropdownMenu', () => { + const text = 'Dropdown menu content'; + + // Upgrade from @radix-ui/react-dropdown-menu 0.1.6 to 2.0.2 renders + // dropdowns inline (rather than portals). Currently not using a portal + // will break the UI due to z-index issues + it('renders using a portal', async () => { + render( +
+ Trigger} + > + +

{text}

+
+
+
+ ); + + userEvent.click(screen.getByText(/trigger/i)); + const contentElement = await screen.findByText(text); + expect(contentElement).toBeInTheDocument(); + // if content is within .test-wrapper then its not been rendered in a portal + expect(contentElement.closest('.test-wrapper')).toBe(null); + }); +});