diff --git a/exercises/02.server-components/01.problem.rsc/tests/solution.test.js b/exercises/02.server-components/01.problem.rsc/tests/solution.test.js index 4ee0e40..3c800e8 100644 --- a/exercises/02.server-components/01.problem.rsc/tests/solution.test.js +++ b/exercises/02.server-components/01.problem.rsc/tests/solution.test.js @@ -1,7 +1,39 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/01.solution.rsc/tests/solution.test.js b/exercises/02.server-components/01.solution.rsc/tests/solution.test.js index 4ee0e40..3c800e8 100644 --- a/exercises/02.server-components/01.solution.rsc/tests/solution.test.js +++ b/exercises/02.server-components/01.solution.rsc/tests/solution.test.js @@ -1,7 +1,39 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/02.problem.async-components/tests/solution.test.js b/exercises/02.server-components/02.problem.async-components/tests/solution.test.js index 4ee0e40..3c800e8 100644 --- a/exercises/02.server-components/02.problem.async-components/tests/solution.test.js +++ b/exercises/02.server-components/02.problem.async-components/tests/solution.test.js @@ -1,7 +1,39 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/02.solution.async-components/tests/solution.test.js b/exercises/02.server-components/02.solution.async-components/tests/solution.test.js index 4ee0e40..3c800e8 100644 --- a/exercises/02.server-components/02.solution.async-components/tests/solution.test.js +++ b/exercises/02.server-components/02.solution.async-components/tests/solution.test.js @@ -1,7 +1,39 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/03.problem.streaming/tests/solution.test.js b/exercises/02.server-components/03.problem.streaming/tests/solution.test.js index 4ee0e40..79bb293 100644 --- a/exercises/02.server-components/03.problem.streaming/tests/solution.test.js +++ b/exercises/02.server-components/03.problem.streaming/tests/solution.test.js @@ -1,7 +1,57 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Wait for the loading placeholders to disappear + await page.waitForSelector('li a:has-text("... loading")', { + state: 'detached', + }) + + // Verify that the list is populated with actual ship names + const shipList = page.getByRole('list').first() + await expect(shipList.getByRole('link').first()).not.toHaveText('... loading') + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Check for loading indicators after search + await expect( + page.locator('li a:has-text("... loading")').first(), + ).toBeVisible() + // Wait for the loading placeholders to disappear + await page.waitForSelector('li a:has-text("... loading")', { + state: 'detached', + }) + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/03.solution.streaming/tests/solution.test.js b/exercises/02.server-components/03.solution.streaming/tests/solution.test.js index 4ee0e40..79bb293 100644 --- a/exercises/02.server-components/03.solution.streaming/tests/solution.test.js +++ b/exercises/02.server-components/03.solution.streaming/tests/solution.test.js @@ -1,7 +1,57 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Wait for the loading placeholders to disappear + await page.waitForSelector('li a:has-text("... loading")', { + state: 'detached', + }) + + // Verify that the list is populated with actual ship names + const shipList = page.getByRole('list').first() + await expect(shipList.getByRole('link').first()).not.toHaveText('... loading') + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Check for loading indicators after search + await expect( + page.locator('li a:has-text("... loading")').first(), + ).toBeVisible() + // Wait for the loading placeholders to disappear + await page.waitForSelector('li a:has-text("... loading")', { + state: 'detached', + }) + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/04.problem.server-context/tests/solution.test.js b/exercises/02.server-components/04.problem.server-context/tests/solution.test.js index 4ee0e40..3c800e8 100644 --- a/exercises/02.server-components/04.problem.server-context/tests/solution.test.js +++ b/exercises/02.server-components/04.problem.server-context/tests/solution.test.js @@ -1,7 +1,39 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) }) diff --git a/exercises/02.server-components/04.solution.server-context/tests/solution.test.js b/exercises/02.server-components/04.solution.server-context/tests/solution.test.js index 4ee0e40..3c800e8 100644 --- a/exercises/02.server-components/04.solution.server-context/tests/solution.test.js +++ b/exercises/02.server-components/04.solution.server-context/tests/solution.test.js @@ -1,7 +1,39 @@ import { test, expect } from '@playwright/test' -test('TODO: write an appropriate test for this exercise', async ({ page }) => { +test('should display the home page and perform search', async ({ page }) => { await page.goto('/') - expect(true).toBe(true) - // TODO: write a test for this exercise + await expect(page).toHaveTitle('Starship Deets') + + // Check for the filter input + const filterInput = page.getByPlaceholder('filter ships') + await expect(filterInput).toBeVisible() + + // Perform a search + await filterInput.fill('hopper') + await filterInput.press('Enter') + + // Verify URL change with search params + await expect(page).toHaveURL('/?search=hopper') + + // Verify filtered results + const shipLinks = page + .getByRole('list') + .first() + .getByRole('listitem') + .getByRole('link') + for (const link of await shipLinks.all()) { + await expect(link).toContainText('hopper', { ignoreCase: true }) + } + + // Find and click on a ship in the filtered list + const shipLink = shipLinks.first() + const shipName = await shipLink.textContent() + await shipLink.click() + + // Verify URL change + await expect(page).toHaveURL(/\/[a-zA-Z0-9-]+/) + + // Verify ship detail view + const shipTitle = page.getByRole('heading', { level: 2 }) + await expect(shipTitle).toHaveText(shipName) })