WEBBOOK CHAPTER

Next.js 16.3, 서비스로 완성하기: 32장. Playwright로 구매 가능한 서비스인지 검증한다

32장. Playwright로 구매 가능한 서비스인지 검증한다

E2E는 CSS selector가 아니라 사용자 관점 role과 label을 우선한다. 각 test는 독립 fixture를 만들고 고유 request id를 쓴다. waitForTimeout으로 운을 시험하지 말고 사용자에게 보이는 완료 상태나 network contract를 기다린다. 실패 artifact에는 screenshot, trace, console, request id가 남아야 한다.


test('마지막 좌석은 한 사람만 예약한다', async ({ browser }) => {
  const a = await browser.newContext({ storageState: 'fixtures/a.json' })
  const b = await browser.newContext({ storageState: 'fixtures/b.json' })
  const [ra, rb] = await Promise.all([
    reserve(await a.newPage(), '도자기 저녁반'),
    reserve(await b.newPage(), '도자기 저녁반'),
  ])
  expect([ra, rb].sort()).toEqual(['CONFIRMED', 'SOLD_OUT'])
})

test가 DB를 직접 고쳐 원하는 상태를 만들었다면 실제 migration과 API 계약을 우회했는지 표시한다. Preview에서는 OAuth sandbox, test bucket, mail sink를 연결하고 Production smoke는 쓰기 없는 health와 synthetic tenant만 사용한다.