All checks were successful
Deploy to Test Environment / deploy-to-test (push) Successful in 13m30s
31 lines
1.2 KiB
TypeScript
31 lines
1.2 KiB
TypeScript
// src/components/ErrorDisplay.test.tsx
|
|
import React from 'react';
|
|
import { screen } from '@testing-library/react';
|
|
import { describe, it, expect } from 'vitest';
|
|
import { ErrorDisplay } from './ErrorDisplay';
|
|
import { renderWithProviders } from '../tests/utils/renderWithProviders';
|
|
|
|
describe('ErrorDisplay (in components)', () => {
|
|
it('should not render when the message is empty', () => {
|
|
const { container } = renderWithProviders(<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 } = renderWithProviders(<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.';
|
|
renderWithProviders(<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');
|
|
});
|
|
});
|