// spec: e2e/plans/create-child.plan.md

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

/** Navigate to the parent children list and wait for the Add Child button to be ready. */
async function gotoParentList(page: import('@playwright/test').Page): Promise<void> {
  await page.goto('/')
  await expect(page.getByRole('button', { name: 'Add Child' })).toBeVisible({ timeout: 10000 })
}

test.describe('Create Child', () => {
  test('Cancel navigates back without saving', async ({ page }) => {
    // 1. Navigate to parent list and wait for it to fully load
    await gotoParentList(page)
    await page.getByRole('button', { name: 'Add Child' }).click()
    await expect(page.getByRole('heading', { name: 'Create Child' })).toBeVisible()

    // 2. Fill in 'Frank' and '9', then click Cancel
    await page.getByLabel('Name').fill('Frank')
    await page.getByLabel('Age').fill('9')
    await page.getByRole('button', { name: 'Cancel' }).click()

    // expect: back on /parent and 'Frank' is NOT listed
    await expect(page).toHaveURL('/parent')
    await expect(page.getByText('Frank')).not.toBeVisible()
  })
})