smoothschedule/frontend/src/components/__tests__/MasqueradeBanner.test.tsx

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(<MasqueradeBanner {...defaultProps} />);
    expect(screen.getByText('John Doe')).toBeInTheDocument();
  });

  it('renders effective user role', () => {
    render(<MasqueradeBanner {...defaultProps} />);
    // The role is split across elements: "(" + "staff" + ")"
    expect(screen.getByText(/staff/)).toBeInTheDocument();
  });

  it('renders original user info', () => {
    render(<MasqueradeBanner {...defaultProps} />);
    expect(screen.getByText(/Admin User/)).toBeInTheDocument();
  });

  it('calls onStop when button is clicked', () => {
    render(<MasqueradeBanner {...defaultProps} />);
    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(<MasqueradeBanner {...propsWithPrevious} />);
    expect(screen.getByText(/platform.masquerade.returnTo/)).toBeInTheDocument();
  });

  it('shows stop masquerading text when no previousUser', () => {
    render(<MasqueradeBanner {...defaultProps} />);
    expect(screen.getByText('platform.masquerade.stopMasquerading')).toBeInTheDocument();
  });

  it('renders with masquerading label', () => {
    render(<MasqueradeBanner {...defaultProps} />);
    expect(screen.getByText(/platform.masquerade.masqueradingAs/)).toBeInTheDocument();
  });
});