|
| 1 | +import { render, fireEvent } from '../../__tests__/utils'; |
| 2 | +import { DBreadcrumb } from './Breadcrumb'; |
| 3 | + |
| 4 | +describe('DBreadcrumb', () => { |
| 5 | + it('renders the breadcrumb with items', () => { |
| 6 | + const breadcrumbItems = [ |
| 7 | + { id: 'home', title: 'Home' }, |
| 8 | + { id: 'about', title: 'About', link: true }, |
| 9 | + { id: 'contact', title: 'Contact' }, |
| 10 | + ]; |
| 11 | + |
| 12 | + const { getByText } = render(<DBreadcrumb dList={breadcrumbItems} />); |
| 13 | + |
| 14 | + expect(getByText('Home')).toBeInTheDocument(); |
| 15 | + expect(getByText('About')).toBeInTheDocument(); |
| 16 | + expect(getByText('Contact')).toBeInTheDocument(); |
| 17 | + }); |
| 18 | + |
| 19 | + it('calls "onItemClick" when an item is clicked', () => { |
| 20 | + const onItemClickMock = jest.fn(); |
| 21 | + const breadcrumbItems = [ |
| 22 | + { id: 'home', title: 'Home' }, |
| 23 | + { id: 'about', title: 'About', link: true }, |
| 24 | + ]; |
| 25 | + |
| 26 | + const { getByText } = render(<DBreadcrumb dList={breadcrumbItems} onItemClick={onItemClickMock} />); |
| 27 | + |
| 28 | + fireEvent.click(getByText('About')); |
| 29 | + expect(onItemClickMock).toHaveBeenCalledWith('about', breadcrumbItems[1]); |
| 30 | + }); |
| 31 | + |
| 32 | + it('uses the custom separator if provided', () => { |
| 33 | + const customSeparator = '>'; |
| 34 | + const breadcrumbItems = [ |
| 35 | + { id: 'home', title: 'Home' }, |
| 36 | + { id: 'about', title: 'About', link: true }, |
| 37 | + ]; |
| 38 | + |
| 39 | + const { queryAllByRole } = render(<DBreadcrumb dList={breadcrumbItems} dSeparator={customSeparator} />); |
| 40 | + |
| 41 | + const separators = queryAllByRole('separator'); |
| 42 | + separators.forEach((separator) => { |
| 43 | + expect(separator).toHaveTextContent(customSeparator); |
| 44 | + }); |
| 45 | + }); |
| 46 | +}); |
0 commit comments