import { describe, it, expect, vi } from 'vitest'; import { render, screen, fireEvent } from '@testing-library/react'; import MasqueradeBanner from '../MasqueradeBanner'; // Mock react-i18next vi.mock('react-i18next', () => ({ useTranslation: () => ({ t: (key: string, options?: { name?: string }) => { if (options?.name) return `${key} ${options.name}`; return key; }, }), })); describe('MasqueradeBanner', () => { const defaultProps = { effectiveUser: { id: '1', name: 'John Doe', email: 'john@test.com', role: 'staff' as const }, originalUser: { id: '2', name: 'Admin User', email: 'admin@test.com', role: 'superuser' as const }, previousUser: null, onStop: vi.fn(), }; beforeEach(() => { vi.clearAllMocks(); }); it('renders effective user name', () => { render(); expect(screen.getByText('John Doe')).toBeInTheDocument(); }); it('renders effective user role', () => { render(); // The role is split across elements: "(" + "staff" + ")" expect(screen.getByText(/staff/)).toBeInTheDocument(); }); it('renders original user info', () => { render(); expect(screen.getByText(/Admin User/)).toBeInTheDocument(); }); it('calls onStop when button is clicked', () => { render(); const stopButton = screen.getByRole('button'); fireEvent.click(stopButton); expect(defaultProps.onStop).toHaveBeenCalled(); }); it('shows return to previous user text when previousUser exists', () => { const propsWithPrevious = { ...defaultProps, previousUser: { id: '3', name: 'Manager', email: 'manager@test.com', role: 'owner' as const }, }; render(); expect(screen.getByText(/platform.masquerade.returnTo/)).toBeInTheDocument(); }); it('shows stop masquerading text when no previousUser', () => { render(); expect(screen.getByText('platform.masquerade.stopMasquerading')).toBeInTheDocument(); }); it('renders with masquerading label', () => { render(); expect(screen.getByText(/platform.masquerade.masqueradingAs/)).toBeInTheDocument(); }); });