Cypress 테스트 격리 — 예측 가능한 테스트 환경

Cypress 테스트 격리 — 예측 가능한 테스트 환경

테스트는 실행 순서와 상관없이 항상 같은 결과를 내야 해요. Cypress는 이를 위해 각 테스트가 시작하기 전에 상태를 정리해서 "깨끗한 시트(clean test slate)"로 시작하게 해 줘요. 이 동작을 **테스트 격리(test isolation)**라고 불러요.

출처: Test isolation in Cypress | Cypress Documentation

Cypress는 각 테스트 전에 상태를 정리해서, 한 테스트의 동작이 나중 테스트에 영향을 주지 않도록 보장해요. 각 테스트의 목표는 격리되어 실행되든 다른 테스트와 연속으로 실행되든 안정적으로 통과하는 거예요. 이전 테스트의 상태에 의존하는 테스트는 잠재적으로 오류를 만들 수 있어요.

Cypress는 각 테스트를 깨끗한 시트로 시작하기 위해 다음을 복원·정리해요.

  • aliases
  • clock mocks
  • intercepts
  • spies
  • stubs
  • viewport changes

깨끗한 테스트 시트뿐 아니라, Cypress는 깨끗한 브라우저 컨텍스트에서 테스트를 실행하기를 지향해요. 그래야 테스트 대상 앱이나 컴포넌트가 일관되게 동작하거든요. 이 동작이 곧 testIsolation이에요. 테스트 격리는 전역 설정이고, E2E 테스트에서는 describe 레벨에서 testIsolation 옵션으로 재정의할 수 있어요.

E2E 테스트에서의 테스트 격리

켜져 있을 때 (Enabled)

테스트 격리를 켜면 Cypress가 각 테스트 전에 브라우저 컨텍스트를 리셋해요.

  • about:blank를 방문해 DOM 상태를 비움
  • 모든 도메인의 쿠키를 비움
  • 모든 도메인의 localStorage를 비움
  • 모든 도메인의 sessionStorage를 비움

IndexedDB와 기타 브라우저 저장 메커니즘은 테스트 격리를 켜도 지워지지 않아요(정리되지 않는 저장소 참고). 테스트가 새 브라우저 컨텍스트에서 시작하므로, 각 테스트마다 애플리케이션을 다시 방문하고 DOM·브라우저 상태를 만들기 위한 상호작용을 수행해야 해요.

또한 cy.session() 커맨드는 이 설정을 물려받아, 브라우저 세션을 맺을 때 페이지와 현재 브라우저 컨텍스트를 비워요. 그래서 테스트가 단독 실행 또는 무작위 순서로도 안정적으로 통과할 수 있어요.

꺼져 있을 때 (Disabled)

테스트 격리를 끄면 Cypress가 테스트 시작 전에 브라우저 컨텍스트를 바꾸지 않아요. 페이지가 테스트 사이에 지워지지 않고, 쿠키·로컬 저장소·세션 저장소가 그 수트의 테스트들 간에 유지돼요.

컴포넌트 테스트

Cypress는 컴포넌트 테스트에서 테스트 격리 동작 구성을 지원하지 않아요. 컴포넌트 테스트를 실행할 때는 항상 각 테스트 전에 브라우저 컨텍스트를 리셋해요 — 렌더링된 컴포넌트를 언마운트하고, 모든 도메인의 쿠키를 비우는 식으로요.

테스트 격리의 트레이드오프

테스트 격리를 끄면 E2E 테스트의 전반적인 성능이 좋아질 수 있어요. 하지만 테스트 간에 상태가 "새어 나갈(leak)" 수도 있어요. 이는 나중 테스트가 이전 테스트의 결과에 의존하게 만들고, 오해를 부르는 테스트 실패를 일으킬 수 있어요. 이 모드를 쓸 때는 어떤 방식으로 테스트를 쓰는지 극도로 주의하고, 테스트가 서로 독립적으로 계속 실행되도록 보장해야 해요.

테스트 독립성을 보장하는 가장 좋은 방법은 테스트에 .only()를 붙여, 앞선 테스트 없이도 그 테스트만 성공적으로 실행되는지 확인하는 거예요.

정리하면, Cypress는 기본적으로 각 테스트를 깨끗한 브라우저 컨텍스트로 시작해 테스트 간 간섭을 막아요. 성능 때문에 격리를 끄고 싶을 때는 상태 누수가 생길 수 있으니 주의해야 하고, 테스트 독립성을 .only()로 확인하는 것이 좋아요.

더 알아보기