Files
flyer-crawler.projectium.com/src/components/AnonymousUserBanner.test.tsx
Torben Sorensen 19885a50f7
All checks were successful
Deploy to Test Environment / deploy-to-test (push) Successful in 13m30s
unit test auto-provider refactor
2026-01-01 23:12:32 -08:00

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);
});
});