All checks were successful
Deploy to Test Environment / deploy-to-test (push) Successful in 13m30s
42 lines
1.7 KiB
TypeScript
42 lines
1.7 KiB
TypeScript
// src/components/AnonymousUserBanner.test.tsx
|
|
import React from 'react';
|
|
import { screen, fireEvent } from '@testing-library/react';
|
|
import { describe, it, expect, vi } from 'vitest';
|
|
import { AnonymousUserBanner } from './AnonymousUserBanner';
|
|
import { renderWithProviders } from '../tests/utils/renderWithProviders';
|
|
|
|
// Mock the icon to ensure it is rendered correctly
|
|
vi.mock('./icons/InformationCircleIcon', () => ({
|
|
InformationCircleIcon: (props: React.SVGProps<SVGSVGElement>) => (
|
|
<svg data-testid="info-icon" {...props} />
|
|
),
|
|
}));
|
|
|
|
describe('AnonymousUserBanner', () => {
|
|
it('should render the banner with the correct text content and accessibility role', () => {
|
|
const mockOnOpenProfile = vi.fn();
|
|
renderWithProviders(<AnonymousUserBanner onOpenProfile={mockOnOpenProfile} />);
|
|
|
|
// Check for accessibility role
|
|
expect(screen.getByRole('alert')).toBeInTheDocument();
|
|
|
|
expect(screen.getByText(/you're viewing as a guest/i)).toBeInTheDocument();
|
|
expect(
|
|
screen.getByText(/to save your flyers, create a watchlist, and access more features/i),
|
|
).toBeInTheDocument();
|
|
expect(screen.getByRole('button', { name: /sign up or log in/i })).toBeInTheDocument();
|
|
expect(screen.getByTestId('info-icon')).toBeInTheDocument();
|
|
expect(screen.getByTestId('info-icon')).toHaveClass('text-blue-500');
|
|
});
|
|
|
|
it('should call onOpenProfile when the "sign up or log in" button is clicked', () => {
|
|
const mockOnOpenProfile = vi.fn();
|
|
renderWithProviders(<AnonymousUserBanner onOpenProfile={mockOnOpenProfile} />);
|
|
|
|
const loginButton = screen.getByRole('button', { name: /sign up or log in/i });
|
|
fireEvent.click(loginButton);
|
|
|
|
expect(mockOnOpenProfile).toHaveBeenCalledTimes(1);
|
|
});
|
|
});
|