123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108 |
- /*
- * SonarQube
- * Copyright (C) 2009-2023 SonarSource SA
- * mailto:info AT sonarsource DOT com
- *
- * This program is free software; you can redistribute it and/or
- * modify it under the terms of the GNU Lesser General Public
- * License as published by the Free Software Foundation; either
- * version 3 of the License, or (at your option) any later version.
- *
- * This program is distributed in the hope that it will be useful,
- * but WITHOUT ANY WARRANTY; without even the implied warranty of
- * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the GNU
- * Lesser General Public License for more details.
- *
- * You should have received a copy of the GNU Lesser General Public License
- * along with this program; if not, write to the Free Software Foundation,
- * Inc., 51 Franklin Street, Fifth Floor, Boston, MA 02110-1301, USA.
- */
- import { act, screen, waitFor } from '@testing-library/react';
- import { noop } from 'lodash';
- import { render, renderWithRouter } from '../../helpers/testUtils';
- import {
- DropdownMenu,
- ItemButton,
- ItemCheckbox,
- ItemCopy,
- ItemDangerButton,
- ItemDivider,
- ItemHeader,
- ItemLink,
- ItemNavLink,
- ItemRadioButton,
- } from '../DropdownMenu';
- import { Tooltip } from '../Tooltip';
- import { MenuIcon } from '../icons/MenuIcon';
-
- beforeEach(() => {
- jest.useFakeTimers();
- });
-
- afterEach(() => {
- jest.runOnlyPendingTimers();
- jest.useRealTimers();
- });
-
- it('should render a full menu correctly', () => {
- renderDropdownMenu();
- expect(screen.getByRole('menuitem', { name: 'My header' })).toBeInTheDocument();
- expect(screen.getByRole('menuitem', { name: 'Test menu item' })).toBeInTheDocument();
- expect(screen.getByRole('menuitem', { name: 'Test disabled item' })).toHaveClass('disabled');
- });
-
- it('menu items should work with tooltips', async () => {
- const { user } = render(
- <Tooltip overlay="test tooltip">
- <ItemButton onClick={jest.fn()}>button</ItemButton>
- </Tooltip>,
- {},
- { delay: null },
- );
-
- expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
-
- await user.hover(screen.getByRole('menuitem'));
- expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
-
- act(() => {
- jest.runAllTimers();
- });
- expect(screen.getByRole('tooltip')).toBeVisible();
-
- await user.unhover(screen.getByRole('menuitem'));
- expect(screen.getByRole('tooltip')).toBeVisible();
-
- act(() => {
- jest.runAllTimers();
- });
- await waitFor(() => {
- expect(screen.queryByRole('tooltip')).not.toBeInTheDocument();
- });
- });
-
- function renderDropdownMenu() {
- return renderWithRouter(
- <DropdownMenu>
- <ItemHeader>My header</ItemHeader>
- <ItemNavLink to="/test">Test menu item</ItemNavLink>
- <ItemDivider />
- <ItemLink disabled to="/test-disabled">
- Test disabled item
- </ItemLink>
- <ItemButton icon={<MenuIcon />} onClick={noop}>
- Button
- </ItemButton>
- <ItemDangerButton onClick={noop}>DangerButton</ItemDangerButton>
- <ItemCopy copyValue="copy" tooltipOverlay="overlay">
- Copy
- </ItemCopy>
- <ItemCheckbox checked onCheck={noop}>
- Checkbox item
- </ItemCheckbox>
- <ItemRadioButton checked={false} onCheck={noop} value="radios">
- Radio item
- </ItemRadioButton>
- </DropdownMenu>,
- );
- }
|