import { test, expect } from "@playwright/test"

test.describe("Form Submission & CRUD Operations", () => {
  test("Create customer form submission", async ({ page }) => {
    // Login
    await page.goto("http://localhost:5173/login")
    await page.fill("input[type='text']", "admin")
    await page.fill("input[type='password']", "password")
    await page.click("button[type='submit']")
    await page.waitForURL(/admin\/dashboard/)

    // Navigate to customers
    await page.click("text=Customers")
    await page.waitForURL(/admin\/customers/)

    // Click create customer
    await page.click("text=Create Customer")
    await page.waitForURL(/admin\/customers\/new/)

    // Fill form
    await page.fill("input#name", "Test Company ABC")
    await page.fill("input#email", "test@company.com")
    await page.fill("input#phone", "010-1234-5678")
    await page.fill("input#address", "Seoul, Korea")
    await page.fill("input#creditLimit", "5000000")

    // Submit
    await page.click("button[type='submit']:has-text('Create')")

    // Should redirect to customers list
    await page.waitForURL(/admin\/customers/)
    console.log("✅ Customer created successfully")

    // Verify in list (should show newly created customer)
    const customerNameVisible = await page.locator("text=Test Company ABC").isVisible()
    expect(customerNameVisible).toBeTruthy()
    console.log("✅ Customer appears in list")
  })

  test("View customer list with data", async ({ page }) => {
    // Login
    await page.goto("http://localhost:5173/login")
    await page.fill("input[type='text']", "admin")
    await page.fill("input[type='password']", "password")
    await page.click("button[type='submit']")
    await page.waitForURL(/admin\/dashboard/)

    // Navigate to customers
    await page.click("text=Customers")
    await page.waitForURL(/admin\/customers/)

    // Check if table has data rows
    const tableRows = await page.locator("table tbody tr").count()
    console.log(`✅ Found ${tableRows} customer rows`)

    // Verify table structure (headers)
    const headers = await page.locator("table thead th").allTextContents()
    expect(headers).toContain("Customer Name")
    expect(headers).toContain("Email")
    expect(headers).toContain("Status")
    console.log("✅ Customer table has correct structure")
  })

  test("Edit customer (if data available)", async ({ page }) => {
    // Login
    await page.goto("http://localhost:5173/login")
    await page.fill("input[type='text']", "admin")
    await page.fill("input[type='password']", "password")
    await page.click("button[type='submit']")
    await page.waitForURL(/admin\/dashboard/)

    // Navigate to customers
    await page.click("text=Customers")
    await page.waitForURL(/admin\/customers/)

    // Check if edit button exists
    const editButton = page.locator("a:text('Edit')").first()
    const isVisible = await editButton.isVisible().catch(() => false)

    if (isVisible) {
      await editButton.click()
      await page.waitForURL(/admin\/customers\/.*\/edit/)

      // Verify form loaded
      const form = await page.locator("form").first()
      expect(form).toBeTruthy()
      console.log("✅ Edit form loaded successfully")

      // Make a change
      const nameInput = page.locator("input#name")
      const currentValue = await nameInput.inputValue()
      await nameInput.fill(currentValue + " (Updated)")

      // Submit
      await page.click("button[type='submit']:has-text('Update')")
      await page.waitForURL(/admin\/customers/)
      console.log("✅ Customer updated successfully")
    } else {
      console.log("⚠️ No customers in list to edit (this is OK for fresh database)")
    }
  })

  test("Form validation on customer creation", async ({ page }) => {
    // Login
    await page.goto("http://localhost:5173/login")
    await page.fill("input[type='text']", "admin")
    await page.fill("input[type='password']", "password")
    await page.click("button[type='submit']")
    await page.waitForURL(/admin\/dashboard/)

    // Navigate to create customer
    await page.click("text=Customers")
    await page.waitForURL(/admin\/customers/)
    await page.click("text=Create Customer")
    await page.waitForURL(/admin\/customers\/new/)

    // Try to submit empty form
    await page.click("button[type='submit']:has-text('Create')")

    // Should show validation error (page should not navigate)
    await page.waitForTimeout(500)
    const currentUrl = page.url()
    expect(currentUrl).toContain("/customers/new")
    console.log("✅ Form validation prevents empty submission")

    // Fill only name and try again
    await page.fill("input#name", "Incomplete Company")
    await page.fill("input#email", "invalid-email")
    await page.click("button[type='submit']:has-text('Create')")

    // Should still be on form (email validation failed)
    await page.waitForTimeout(500)
    const stillOnForm = page.url().includes("/customers/new")
    console.log(`✅ Email validation ${stillOnForm ? "working" : "bypassed (may be OK)"}`)
  })
})