import { test, expect } from '@playwright/test'
import { loginAndNavigate, waitForChatReady, getChatInput, getSendButton, askQuestion } from './auth.setup'

/**
 * Basic chat functionality tests for ArchiefAssistent
 * 
 * These tests verify the core chat UI works correctly:
 * - Input field accepts text
 * - Send button submits query
 * - Messages appear in chat history
 * - Assistant responds to queries
 */

test.describe('Chat UI', () => {
  test.beforeEach(async ({ page }) => {
    await loginAndNavigate(page)
    await waitForChatReady(page)
  })

  test('should display chat input and send button', async ({ page }) => {
    const chatInput = getChatInput(page)
    
    await expect(chatInput).toBeVisible()
    // Send button may be disabled when input is empty, but should exist
  })

  test('should accept text input', async ({ page }) => {
    const chatInput = getChatInput(page)
    
    await chatInput.fill('Test bericht')
    await expect(chatInput).toHaveValue('Test bericht')
  })

  test('should submit query and show user message', async ({ page }) => {
    const chatInput = getChatInput(page)
    
    const testQuery = 'Hoeveel archieven zijn er in Utrecht?'
    await chatInput.fill(testQuery)
    await chatInput.press('Enter')
    
    // Wait for user message to appear in the chat
    await expect(page.locator('text=' + testQuery)).toBeVisible({ timeout: 10000 })
  })

  test('should receive assistant response', async ({ page }) => {
    // Use the shared askQuestion helper that properly waits for response
    const response = await askQuestion(page, 'Hoeveel archieven zijn er in Utrecht?')
    
    // Response should contain a number (COUNT query)
    expect(response).toMatch(/\d+/)
  })

  test('should clear input after sending', async ({ page }) => {
    const chatInput = getChatInput(page)
    
    await chatInput.fill('Test vraag')
    await chatInput.press('Enter')
    
    // Input should be cleared after sending
    await expect(chatInput).toHaveValue('', { timeout: 5000 })
  })

  test('should allow multiple messages in conversation', async ({ page }) => {
    const chatInput = getChatInput(page)
    
    // Send first message
    await chatInput.fill('Hoeveel musea zijn er in Gelderland?')
    await chatInput.press('Enter')
    
    // Wait for response (look for any response text)
    await page.waitForTimeout(3000) // Brief wait for message to appear
    
    // Send second message
    await chatInput.fill('En hoeveel bibliotheken?')
    await chatInput.press('Enter')
    
    // Wait a bit for the second message to process
    await page.waitForTimeout(2000)
  })

  test('should support Enter key to submit', async ({ page }) => {
    const chatInput = getChatInput(page)
    
    const testQuery = 'Test met Enter toets'
    await chatInput.fill(testQuery)
    await chatInput.press('Enter')
    
    // User message should appear
    await expect(page.locator('text=' + testQuery)).toBeVisible({ timeout: 5000 })
  })
})