65 lines
2.3 KiB
TypeScript
65 lines
2.3 KiB
TypeScript
import React from 'react';
|
|
import { describe, it, expect } from 'vitest';
|
|
import { render, screen } from '@testing-library/react';
|
|
import { AuthError } from './AuthError';
|
|
|
|
describe('AuthError', () => {
|
|
describe('rendering', () => {
|
|
it('should render error message with action', () => {
|
|
render(<AuthError action="login" />);
|
|
|
|
expect(screen.getByText('Failed to load login page')).toBeInTheDocument();
|
|
expect(screen.getByText('Error')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render error message with different actions', () => {
|
|
const actions = ['login', 'register', 'reset-password', 'verify-email'];
|
|
|
|
actions.forEach(action => {
|
|
render(<AuthError action={action} />);
|
|
expect(screen.getByText(`Failed to load ${action} page`)).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
it('should render with empty action', () => {
|
|
render(<AuthError action="" />);
|
|
expect(screen.getByText('Failed to load page')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should render with special characters in action', () => {
|
|
render(<AuthError action="user-login" />);
|
|
expect(screen.getByText('Failed to load user-login page')).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
describe('accessibility', () => {
|
|
it('should have proper error banner structure', () => {
|
|
render(<AuthError action="login" />);
|
|
|
|
// The ErrorBanner component should have proper ARIA attributes
|
|
// This test verifies the component renders correctly
|
|
expect(screen.getByText('Error')).toBeInTheDocument();
|
|
expect(screen.getByText('Failed to load login page')).toBeInTheDocument();
|
|
});
|
|
});
|
|
|
|
describe('edge cases', () => {
|
|
it('should handle long action names', () => {
|
|
const longAction = 'very-long-action-name-that-might-break-layout';
|
|
render(<AuthError action={longAction} />);
|
|
|
|
expect(screen.getByText(`Failed to load ${longAction} page`)).toBeInTheDocument();
|
|
});
|
|
|
|
it('should handle action with spaces', () => {
|
|
render(<AuthError action="user login" />);
|
|
expect(screen.getByText('Failed to load user login page')).toBeInTheDocument();
|
|
});
|
|
|
|
it('should handle action with numbers', () => {
|
|
render(<AuthError action="step2" />);
|
|
expect(screen.getByText('Failed to load step2 page')).toBeInTheDocument();
|
|
});
|
|
});
|
|
});
|