Jest 부분 스냅샷 매칭

snapshot testing 을 처음 살펴보았으므로 이미 몇 가지 이상한 사용 사례를 발견했을 수 있습니다.

예를 들어 데이터가 날짜 객체를 반환한다면 어떻게 될까요?
아니면 ID가 역동적이고 끊임없이 변화합니까?

즉, 스냅샷의 일부만 일치해야 합니다.

Jest 부분 스냅샷 매칭

예를 들어 다음 테스트를 봅시다.

test('snapshot testing', async () => {
  const randomFact = {
    id: Math.random().toString(36).slice(2),
    fact: 'Chris is writing about Jest',
    createdAt: new Date(),
  };

  expect(randomFact).toMatchSnapshot();
});

이 코드를 실행하면 스냅샷이 멋지게 생성되고 테스트가 성공합니다.

exports[`snapshot testing 1`] = `
Object {
  "createdAt": 2022-03-30T04:36:39.987Z,
  "fact": "Chris is writing about Jest",
  "id": "eq8b6a67yjb",
}
`;

그러나 다음 실행에서 어떤 일이 일어날 것이라고 생각하십니까?
맞습니다. createdAt와 id가 다르기 때문에 모두 실패합니다.



이 문제를 해결하려면 Jest가 createdAt가 모든 날짜가 될 수 있고 ID가 모든 문자열 유형이 될 수 있음을 알고 있는지 확인해야 합니다.

운 좋게도 이 함수와 함께 제공됩니다. toMatchSnapshot 함수 내에서 다음과 같이 어떤 객체로 만들어야 하는지 정의할 수 있습니다.

test('snapshot testing', async () => {
  const randomFact = {
    id: Math.random().toString(36).slice(2),
    fact: 'Chris is writing about Jest',
    createdAt: new Date(),
  };

  expect(randomFact).toMatchSnapshot({
    id: expect.any(String),
    createdAt: expect.any(Date),
  });
});

fact 를 추가하지 않은 방법에 유의하십시오. 이는 여전히 각 스냅샷에 대해 고유하게 확인함을 의미합니다.

이제 업데이트 플래그를 전달하는 동안 다음 테스트를 실행해야 합니다.

npm run test -u

업데이트 후 스냅샷은 다음과 같아야 합니다.

exports[`snapshot testing 1`] = `
Object {
  "createdAt": Any<Date>,
  "fact": "Chris is writing about Jest",
  "id": Any<String>,
}
`;

완벽한!
이제 createdAt 필드에 대한 고유한 날짜 검사와 id에 대한 문자열 검사가 있습니다.

읽어주셔서 감사합니다. 연결합시다!

제 블로그를 읽어주셔서 감사합니다. 내 이메일 뉴스레터를 구독하고 Facebook에 연결하거나