SearchItem.test.tsx 2.0 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273
  1. import { fireEvent, render, screen } from '@testing-library/react';
  2. import React from 'react';
  3. import { selectors } from '@grafana/e2e-selectors';
  4. import { DashboardSearchItemType } from '../types';
  5. import { Props, SearchItem } from './SearchItem';
  6. beforeEach(() => {
  7. jest.clearAllMocks();
  8. });
  9. const data = {
  10. id: 1,
  11. uid: 'lBdLINUWk',
  12. title: 'Test 1',
  13. uri: 'db/test1',
  14. url: '/d/lBdLINUWk/test1',
  15. slug: '',
  16. type: DashboardSearchItemType.DashDB,
  17. tags: ['Tag1', 'Tag2'],
  18. isStarred: false,
  19. checked: false,
  20. };
  21. const setup = (propOverrides?: Partial<Props>) => {
  22. const props: Props = {
  23. item: data,
  24. onTagSelected: jest.fn(),
  25. editable: false,
  26. };
  27. Object.assign(props, propOverrides);
  28. render(<SearchItem {...props} />);
  29. };
  30. describe('SearchItem', () => {
  31. it('should render the item', () => {
  32. setup();
  33. expect(screen.getAllByTestId(selectors.components.Search.dashboardItem('Test 1'))).toHaveLength(1);
  34. expect(screen.getAllByText('Test 1')).toHaveLength(1);
  35. });
  36. it('should toggle items when checked', () => {
  37. const mockedOnToggleChecked = jest.fn();
  38. setup({ editable: true, onToggleChecked: mockedOnToggleChecked });
  39. const checkbox = screen.getByRole('checkbox');
  40. expect(checkbox).not.toBeChecked();
  41. fireEvent.click(checkbox);
  42. expect(mockedOnToggleChecked).toHaveBeenCalledTimes(1);
  43. expect(mockedOnToggleChecked).toHaveBeenCalledWith(data);
  44. });
  45. it('should mark items as checked', () => {
  46. setup({ editable: true, item: { ...data, checked: true } });
  47. expect(screen.getByRole('checkbox')).toBeChecked();
  48. });
  49. it("should render item's tags", () => {
  50. setup();
  51. expect(screen.getAllByText(/tag/i)).toHaveLength(2);
  52. });
  53. it('should select the tag on tag click', () => {
  54. const mockOnTagSelected = jest.fn();
  55. setup({ onTagSelected: mockOnTagSelected });
  56. fireEvent.click(screen.getByText('Tag1'));
  57. expect(mockOnTagSelected).toHaveBeenCalledTimes(1);
  58. expect(mockOnTagSelected).toHaveBeenCalledWith('Tag1');
  59. });
  60. });