@kadconsulting/dry
Version:
KAD Reusable Component Library
103 lines • 5.02 kB
JavaScript
import { jsx as _jsx } from "react/jsx-runtime";
import React from 'react';
import { render, screen } from '@testing-library/react';
import '@testing-library/jest-dom';
import Breadcrumbs from './Breadcrumbs';
import { usePathname } from 'next/navigation';
// Mock the usePathname hook
jest.mock('next/navigation', () => ({
usePathname: jest.fn(),
}));
describe('Breadcrumbs', () => {
const mockUsePathname = usePathname;
beforeEach(() => {
mockUsePathname.mockClear();
});
it('renders with a dry-prepended className', () => {
mockUsePathname.mockReturnValue('/test');
const { container } = render(_jsx(Breadcrumbs, {}));
expect(container.firstChild).toHaveClass('breadcrumbs');
});
it('passes a ref to its outermost element', () => {
mockUsePathname.mockReturnValue('/test');
const ref = React.createRef();
render(_jsx(Breadcrumbs, {}));
expect(ref.current).not.toBeNull();
expect(ref.current?.tagName).toBe('NAV');
});
it('passes downstream props correctly', () => {
mockUsePathname.mockReturnValue('/test');
const testId = 'test-breadcrumbs';
const className = 'custom-class';
const style = { color: 'red' };
const dataAttr = 'test-value';
render(_jsx(Breadcrumbs, { "data-testid": testId, className: className, style: style, "data-custom": dataAttr }));
const breadcrumbs = screen.getByTestId(testId);
expect(breadcrumbs).toHaveClass('breadcrumbs');
expect(breadcrumbs).toHaveClass(className);
expect(breadcrumbs).toHaveStyle('color: red');
expect(breadcrumbs).toHaveAttribute('data-custom', dataAttr);
});
it('renders correct breadcrumbs for a given path', () => {
mockUsePathname.mockReturnValue('/products/electronics/smartphones');
render(_jsx(Breadcrumbs, {}));
expect(screen.getByText('Home')).toBeInTheDocument();
expect(screen.getByText('Products')).toBeInTheDocument();
expect(screen.getByText('Electronics')).toBeInTheDocument();
expect(screen.getByText('Smartphones')).toBeInTheDocument();
});
it('uses custom home route when provided', () => {
mockUsePathname.mockReturnValue('/users/profile');
render(_jsx(Breadcrumbs, { homeRoute: '/dashboard' }));
const homeLink = screen.getByText('Home');
expect(homeLink).toHaveAttribute('href', '/dashboard/');
});
it('excludes routes specified in noShowRoutes', () => {
mockUsePathname.mockReturnValue('/admin/users/settings');
render(_jsx(Breadcrumbs, { noShowRoutes: ['admin'] }));
expect(screen.queryByText('Admin')).not.toBeInTheDocument();
expect(screen.getByText('Users')).toBeInTheDocument();
expect(screen.getByText('Settings')).toBeInTheDocument();
});
it('handles root path correctly', () => {
mockUsePathname.mockReturnValue('/');
const { container } = render(_jsx(Breadcrumbs, {}));
expect(container.firstChild).toBeNull();
});
it('handles long paths correctly', () => {
mockUsePathname.mockReturnValue('/category1/subcategory2/product3/details/specifications');
render(_jsx(Breadcrumbs, {}));
expect(screen.getByText('Category1')).toBeInTheDocument();
expect(screen.getByText('Subcategory2')).toBeInTheDocument();
expect(screen.getByText('Product3')).toBeInTheDocument();
expect(screen.getByText('Details')).toBeInTheDocument();
expect(screen.getByText('Specifications')).toBeInTheDocument();
});
it('renders the last item as text, not a link', () => {
mockUsePathname.mockReturnValue('/products/electronics/smartphones');
render(_jsx(Breadcrumbs, {}));
const lastItem = screen.getByText('Smartphones');
expect(lastItem.tagName).toBe('SPAN');
expect(lastItem).not.toHaveAttribute('href');
});
it('renders all other items as links', () => {
mockUsePathname.mockReturnValue('/products/electronics/smartphones');
render(_jsx(Breadcrumbs, {}));
const homeLink = screen.getByText('Home');
const productsLink = screen.getByText('Products');
const electronicsLink = screen.getByText('Electronics');
expect(homeLink.tagName).toBe('A');
expect(productsLink.tagName).toBe('A');
expect(electronicsLink.tagName).toBe('A');
expect(homeLink).toHaveAttribute('href', '/');
expect(productsLink).toHaveAttribute('href', '/products');
expect(electronicsLink).toHaveAttribute('href', '/products/electronics');
});
it('handles paths with special characters correctly', () => {
mockUsePathname.mockReturnValue('/search/query%20with%20spaces');
render(_jsx(Breadcrumbs, {}));
expect(screen.getByText('Search')).toBeInTheDocument();
expect(screen.getByText('Query with spaces')).toBeInTheDocument();
});
});
//# sourceMappingURL=Breadcrumbs.test.js.map