diff --git a/packages/manager/.changeset/pr-11340-tests-1732789911285.md b/packages/manager/.changeset/pr-11340-tests-1732789911285.md new file mode 100644 index 00000000000..06220b0c3c9 --- /dev/null +++ b/packages/manager/.changeset/pr-11340-tests-1732789911285.md @@ -0,0 +1,5 @@ +--- +"@linode/manager": Tests +--- + +Add unit test cases for `DialogTitle` component ([#11340](https://github.com/linode/manager/pull/11340)) diff --git a/packages/manager/src/components/DialogTitle/DialogTitle.test.tsx b/packages/manager/src/components/DialogTitle/DialogTitle.test.tsx new file mode 100644 index 00000000000..247d4739f81 --- /dev/null +++ b/packages/manager/src/components/DialogTitle/DialogTitle.test.tsx @@ -0,0 +1,54 @@ +import userEvent from '@testing-library/user-event'; +import React from 'react'; + +import { renderWithTheme } from 'src/utilities/testHelpers'; + +import { DialogTitle } from './DialogTitle'; + +import type { DialogTitleProps } from './DialogTitle'; + +const mockId = '1'; +const mockSubtitle = 'This a basic dialog'; +const mockTitle = 'This is a Dialog'; + +const defaultProps: DialogTitleProps = { + id: mockId, + subtitle: mockSubtitle, + title: mockTitle, +}; + +describe('DialogTitle', () => { + it('should render title, subtitle and id', () => { + const { getByRole, getByText } = renderWithTheme( + + ); + expect(getByText(mockTitle)).toBeVisible(); + expect(getByText(mockSubtitle)).toBeVisible(); + const titleElement = getByRole('heading'); + expect(titleElement).toHaveAttribute('id', mockId); + }); + + it('should not render title when isFetching is true', () => { + const { queryByText } = renderWithTheme( + + ); + expect(queryByText(mockTitle)).not.toBeInTheDocument(); + }); + + it('should close the dialog Box if the close button is clicked', async () => { + const onCloseMock = vi.fn(); + const { getByRole } = renderWithTheme( + + ); + const closeButton = getByRole('button', { + name: 'Close', + }); + expect(closeButton).toBeInTheDocument(); + await userEvent.click(closeButton); + expect(onCloseMock).toHaveBeenCalledTimes(1); + expect(onCloseMock).toHaveBeenCalledWith({}, 'escapeKeyDown'); + }); +}); diff --git a/packages/manager/src/components/DialogTitle/DialogTitle.tsx b/packages/manager/src/components/DialogTitle/DialogTitle.tsx index 62b7272aaaa..9134a6e94b8 100644 --- a/packages/manager/src/components/DialogTitle/DialogTitle.tsx +++ b/packages/manager/src/components/DialogTitle/DialogTitle.tsx @@ -6,7 +6,7 @@ import * as React from 'react'; import type { SxProps, Theme } from '@mui/material'; -interface DialogTitleProps { +export interface DialogTitleProps { className?: string; id?: string; isFetching?: boolean;