import { test, expect, Page } from '@playwright/test'

test.describe.configure({ mode: 'serial' })

let page: Page

test.beforeAll(async ({ browser }) => {
  page = await browser.newPage()
})

test.afterAll(async () => {
  await page.reload()
  await page.click("//button[@data-testid='actiontest-delete-file/']")
  await page.click("(//div[@id='FileltemActiondelete']//div)[2]")
  await page.click("(//button[@id='dialogDeleteConfirm']//span)[2]")
  await page.close()
})

test('Login', async ({}) => {
  await page.goto('http://localhost:3010/admin')

  await expect(page).toHaveTitle('Sign in to EDM')
  await page.fill("input[name='username']", 'admin')
  await page.fill("input[name='password']", 'P@ssw0rd')
  await page.click("input[name='login']")
})

test('Create Cabinet', async () => {
  await page.click("//div[@id='triggerFolderCreateFileItem']")
  await page.fill("(//input[@placeholder='กรอกชื่อ'])[1]", 'test-delete-file')
  await page.click("//button[@type='submit']")
  await expect(page.locator("(//div[@class='col'])[3]")).toContainText(
    /test-delete-file/,
  )
})

test('Go into Cabinet', async () => {
  await page.click("//div[@data-pathname='test-delete-file/']")
  await expect(
    page.locator("//div[contains(@class,'flex items-center')]//div[1]"),
  ).toContainText(/test-delete-file/)
})

test('Create Drawer', async () => {
  await page.click("//div[@id='triggerFolderCreateFileItem']")
  await page.fill("(//input[@placeholder='กรอกชื่อ'])[1]", 'test-delete-file')
  await page.click("//button[@type='submit']")
  await expect(page.locator("(//div[@class='col'])[3]")).toContainText(
    /test-delete-file/,
  )
})

test('Go into Drawer', async () => {
  await page.click("//div[@data-pathname='test-delete-file/test-delete-file/']")
  await expect(
    page.locator("//div[contains(@class,'flex items-center')]//div[3]"),
  ).toContainText(/test-delete-file/)
})

test('Create Folder', async () => {
  await page.click("//div[@id='triggerFolderCreateFileItem']")
  await page.fill("(//input[@placeholder='กรอกชื่อ'])[1]", 'test-delete-file')
  await page.click("//button[@type='submit']")
  await expect(page.locator("(//div[@class='col'])[3]")).toContainText(
    /test-delete-file/,
  )
})

test('Go into Folder', async () => {
  await page.click(
    "//div[@data-pathname='test-delete-file/test-delete-file/test-delete-file/']",
  )
  await expect(
    page.locator("//div[contains(@class,'flex items-center')]//div[5]"),
  ).toContainText(/test-delete-file/)
})

test('Upload File', async () => {
  await page.click("//div[@id='triggerFileCreateFileItem']")
  await page.setInputFiles("//input[@type='file']", 'tests/file.txt')
  await page.fill("//input[@placeholder='กรอกชื่อเรื่อง']", 'test-delete-file')
  await page.click("(//form[@class='q-form']//button)[2]")
  await page.waitForTimeout(3000)
  await expect(
    page.locator(
      "//div[@data-pathname='test-delete-file/test-delete-file/test-delete-file/file.txt']",
    ),
  ).toContainText(/test-delete-file/)
})

test('Delete File', async () => {
  await page.click(
    "//button[@data-testid='actiontest-delete-file/test-delete-file/test-delete-file/file.txt']",
  )
  await page.click("//div[@id='FileltemActiondelete']")
  await page.click("//button[@id='dialogDeleteConfirm']")
  await page.waitForTimeout(3000)
  await expect(
    page.locator("(//div[@class='grid q-mt-md'])[2]"),
  ).not.toContainText(/test-delete-file/)
})