본문으로 건너뛰기

테스트 철학

사용자에게 보이는 동작을 테스트하기​

자동화된 테스트는 애플리케이션 코드가 최종 사용자에게 작동하는지 확인해야 합니다. 함수의 이름, 배열 여부, 특정 요소의 CSS 클래스와 같이 사용자가 일반적으로 사용하지 않고, 볼 수 없고, 알 수도 없는 구체적인 구현에 의존하지 말아야 합니다. 테스트도 최종 사용자와 동일하게 페이지에서 렌더링된 것을 보고 상호 작용해야 합니다.

가능한 한 격리된 테스트 만들기​

각 테스트는 다른 테스트와 완전히 격리되어야 하며 자체 로컬 스토리지, 세션 스토리지, 데이터, 쿠키 등을 가져야 합니다. 테스트 격리는 재현성을 향상시키고, 디버깅을 용이하게 하며, 계단식 테스트 실패를 방지합니다.

테스트의 특정 부분에 대한 반복을 피하기 위해 before과 after 훅을 사용할 수 있습니다. 각 테스트 전에 특정 URL로 이동하거나 앱의 일부에 로그인하려면, 테스트 파일에 before 훅을 추가합니다. 이렇게 하면 다른 테스트에 의존하는 테스트가 없으므로 테스트가 격리됩니다. 그러나 테스트가 충분히 간단할 때, 특히 테스트의 가독성과 유지를 위해서라면 약간의 중복이 있어도 괜찮습니다.

js
import { test } from '@playwright/test';
test.beforeEach(async ({ page }) => {
  // 각 테스트 전에 실행되며 각 페이지에 로그인합니다.
  await page.goto('https://github.com/login');
  await page.getByLabel('Username or email address').fill('username');
  await page.getByLabel('Password').fill('password');
  await page.getByRole('button', { name: 'Sign in' }).click();
});
test('first', async ({ page }) => {
  // 페이지가 로그인되었습니다.
});
test('second', async ({ page }) => {
  // 페이지가 로그인되었습니다.
});
js
import { test } from '@playwright/test';
test.beforeEach(async ({ page }) => {
  // 각 테스트 전에 실행되며 각 페이지에 로그인합니다.
  await page.goto('https://github.com/login');
  await page.getByLabel('Username or email address').fill('username');
  await page.getByLabel('Password').fill('password');
  await page.getByRole('button', { name: 'Sign in' }).click();
});
test('first', async ({ page }) => {
  // 페이지가 로그인되었습니다.
});
test('second', async ({ page }) => {
  // 페이지가 로그인되었습니다.
});

전역 설정을 사용하여 테스트에서 로그인 상태를 재사용하는 것도 가능합니다. 이렇게 하면 한 번만 로그인한 다음 모든 테스트에서 로그인 단계를 건너뛸 수 있습니다.

적은 수의 테스트와 긴 테스트 작성하기​

종단 간 테스트에서는 긴 테스트를 작성하는 것이 나쁘지 않습니다. 전체 앱 흐름을 테스트할 수 있도록 테스트에 여러 동작과 단언이 있어도 괜찮습니다. 단언을 개별 테스트 블록으로 분리하는 것은 실제로 큰 이득이 없고 테스트 실행 속도를 늦추기 때문에 피해야 합니다.

테스트가 실패하면 플레이라이트는 테스트의 실패 부분을 보여주는 오류 메시지를 제공합니다. 이는 VS 코드, 터미널, HTML 보고서, 추적 뷰어에서 확인할 수 있습니다. 테스트 실행을 종료하지 않고 테스트를 실패로 표시하는 느슨한 단언을 사용할 수도 있습니다.

js
// 실패해도 테스트가 중지되지 않는 몇 가지 검사를 수행합니다.
await expect.soft(page.getByTestId('status')).toHaveText('Success');
// 더 많은 것을 확인하기 위해 테스트를 계속합니다.
await page.getByRole('link', { name: 'next page' }).click();
js
// 실패해도 테스트가 중지되지 않는 몇 가지 검사를 수행합니다.
await expect.soft(page.getByTestId('status')).toHaveText('Success');
// 더 많은 것을 확인하기 위해 테스트를 계속합니다.
await page.getByRole('link', { name: 'next page' }).click();

타사 의존성에 대한 테스트 피하기​

직접 제어하는 것만 테스트하세요. 직접 제어하지 않는 외부 사이트에 대한 링크나 타사 서버를 테스트하지 마세요. 시간이 많이 걸리고 테스트 속도가 느려질 수 있습니다. 그리고 링크된 페이지의 콘텐츠, 쿠키 배너, 오버레이 페이지 등 테스트 실패의 원인이 될 수 있는 요소를 제어할 수 없습니다.

데이터베이스를 사용하는 테스트​

데이터베이스로 사용한다면 데이터를 제어할 수 있는지 확인하세요. 준비 환경에 대해 테스트하고 환경이 변하지 않는지 확인하세요. 시각적 회귀 테스트(visual regression test)의 경우에는 운영 체제와 브라우저 버전이 동일한지 확인하세요.