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

test('Verify page title is correct', async ({ page }) => {
  await page.goto('https://demo.playwright.dev/todomvc');
  await expect(page).toHaveTitle('React • TodoMVC');
});

test('Add a new to-do item', async ({ page }) => {
  await page.goto('https://demo.playwright.dev/todomvc');
  await page.locator('.new-todo').fill('Buy milk');
  await page.keyboard.press('Enter');
  await expect(page.locator('.todo-list li')).toHaveText(['Buy milk']);
});

test('Mark a to-do item as completed', async ({ page }) => {
  await page.goto('https://demo.playwright.dev/todomvc');
  await page.locator('.new-todo').fill('Buy milk');
  await page.keyboard.press('Enter');
  await page.locator('.toggle').check();
  await expect(page.locator('.todo-list li')).toHaveClass(/completed/);
});

test('Delete a to-do item', async ({ page }) => {
  await page.goto('https://demo.playwright.dev/todomvc');
  await page.locator('.new-todo').fill('Buy milk');
  await page.keyboard.press('Enter');
  await page.hover('.todo-list li');
  await page.click('.destroy', { force: true });
  await expect(page.locator('.todo-list li')).toHaveCount(0);
});
