Skip to content

Commit

Permalink
finish tests for exercise 3
Browse files Browse the repository at this point in the history
  • Loading branch information
kentcdodds committed Sep 17, 2024
1 parent 1f637e2 commit f286d5d
Show file tree
Hide file tree
Showing 34 changed files with 216 additions and 52 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { test, expect } from '@playwright/test'

test('should display the home page and perform search', async ({ page }) => {
await page.goto('/')
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)
})

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { test, expect } from '@playwright/test'

test('should display the home page and perform search', async ({ page }) => {
await page.goto('/')
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)
})

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { test, expect } from '@playwright/test'
import { searchShips } from '../db/ship-api.js'

test('should display the home page and perform search', async ({ page }) => {
const {
ships: [ship],
} = await searchShips({ search: 'hopper' })
const newName = `${ship.name} 🚀`
await page.goto(`/${ship.id}`)

// Wait for the loading state to disappear
await page.waitForSelector('h2:has-text("Loading...")', { state: 'detached' })

// Ensure the ship name is visible
await expect(page.getByRole('heading', { name: ship.name })).toBeVisible()
// Find and click the edit button
await page.getByRole('button', { name: ship.name }).click()

// Check if the input is focused
await expect(page.getByRole('textbox', { name: 'Ship Name' })).toBeFocused()

// Change the value of the input
await page.getByRole('textbox', { name: 'Ship Name' }).fill(newName)

// Press Enter
await page.keyboard.press('Enter')

// Check if the button is back
await expect(page.getByRole('button', { name: newName })).toBeVisible()
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { test, expect } from '@playwright/test'

test('should display the home page and perform search', async ({ page }) => {
await page.goto('/')
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)
})

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import { test, expect } from '@playwright/test'
import { searchShips } from '../db/ship-api.js'

test('should display the home page and perform search', async ({ page }) => {
const {
ships: [ship],
} = await searchShips({ search: 'hopper' })
const newName = `${ship.name} 🚀`
await page.goto(`/${ship.id}`)

// Wait for the loading state to disappear
await page.waitForSelector('h2:has-text("Loading...")', { state: 'detached' })

// Ensure the ship name is visible
await expect(page.getByRole('heading', { name: ship.name })).toBeVisible()
// Find and click the edit button
await page.getByRole('button', { name: ship.name }).click()

// Check if the input is focused
await expect(page.getByRole('textbox', { name: 'Ship Name' })).toBeFocused()

// Change the value of the input
await page.getByRole('textbox', { name: 'Ship Name' }).fill(newName)

// Press Enter
await page.keyboard.press('Enter')

// Check if the button is back
await expect(page.getByRole('button', { name: newName })).toBeVisible()
})
Original file line number Diff line number Diff line change
@@ -0,0 +1,39 @@
import { test, expect } from '@playwright/test'

test('should display the home page and perform search', async ({ page }) => {
await page.goto('/')
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)
})

This file was deleted.

Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/01.problem.router/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/01.solution.router/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/02.problem.pending-ui/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/02.solution.pending-ui/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/04.problem.history/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/04.solution.history/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/05.problem.cache/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/04.router/05.solution.cache/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -64,7 +64,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -70,7 +70,6 @@ export function EditableText({ id, shipId, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,6 @@ export function EditableText({ id, shipId, action, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/05.actions/02.problem.client/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,6 @@ export function EditableText({ id, shipId, action, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
1 change: 0 additions & 1 deletion exercises/05.actions/02.solution.client/ui/edit-text.js
Original file line number Diff line number Diff line change
Expand Up @@ -65,7 +65,6 @@ export function EditableText({ id, shipId, action, initialValue = '' }) {
: h(
'button',
{
'aria-label': 'Ship Name',
ref: buttonRef,
type: 'button',
style: {
Expand Down
Loading

0 comments on commit f286d5d

Please sign in to comment.