30 lines
1.1 KiB
TypeScript
30 lines
1.1 KiB
TypeScript
// src/components/ErrorDisplay.test.tsx
|
|
import React from 'react';
|
|
import { render, screen } from '@testing-library/react';
|
|
import { describe, it, expect } from 'vitest';
|
|
import { ErrorDisplay } from './ErrorDisplay';
|
|
|
|
describe('ErrorDisplay (in components)', () => {
|
|
it('should not render when the message is empty', () => {
|
|
const { container } = render(<ErrorDisplay message="" />);
|
|
expect(container.firstChild).toBeNull();
|
|
});
|
|
|
|
it('should not render when the message is null', () => {
|
|
// The component expects a string, but we test for nullish values as a safeguard.
|
|
const { container } = render(<ErrorDisplay message={null as unknown as string} />);
|
|
expect(container.firstChild).toBeNull();
|
|
});
|
|
|
|
it('should render the error message when provided', () => {
|
|
const errorMessage = 'Something went terribly wrong.';
|
|
render(<ErrorDisplay message={errorMessage} />);
|
|
|
|
const alert = screen.getByRole('alert');
|
|
expect(alert).toBeInTheDocument();
|
|
expect(screen.getByText('Error:')).toBeInTheDocument();
|
|
expect(screen.getByText(errorMessage)).toBeInTheDocument();
|
|
expect(alert).toHaveClass('bg-red-100');
|
|
});
|
|
});
|