/**
 * Component tests for Login.svelte
 */
import { describe, it, expect, beforeEach, vi } from 'vitest';
import { render, screen, fireEvent } from '@testing-library/svelte';
import Login from '../../src/routes/Login.svelte';

// Mock the API module
vi.mock('../../src/lib/api.js', () => ({
  login: vi.fn(),
  setToken: vi.fn(),
  setCurrentUser: vi.fn(),
}));

describe('Login Component', () => {
  beforeEach(() => {
    vi.clearAllMocks();
  });

  it('should render login form', () => {
    render(Login);

    // Check for username and password inputs
    expect(screen.getByLabelText(/username/i) || screen.getByPlaceholderText(/username/i)).toBeTruthy();
    expect(screen.getByLabelText(/password/i) || screen.getByPlaceholderText(/password/i)).toBeTruthy();
  });

  it('should have login button', () => {
    render(Login);

    const loginButton = screen.getByRole('button', { name: /sign in/i }) ||
                        screen.getByText(/sign in/i);
    expect(loginButton).toBeTruthy();
  });

  it('should accept user input', async () => {
    render(Login);

    const usernameInput = screen.getByLabelText(/username/i) ||
                          screen.getByPlaceholderText(/username/i);
    const passwordInput = screen.getByLabelText(/password/i) ||
                          screen.getByPlaceholderText(/password/i);

    await fireEvent.input(usernameInput, { target: { value: 'testuser' } });
    await fireEvent.input(passwordInput, { target: { value: 'testpass' } });

    expect(usernameInput.value).toBe('testuser');
    expect(passwordInput.value).toBe('testpass');
  });
});