This message was deleted.
# 질문s
Slackbot
06/30/2020, 10:10 AMThis message was deleted.
u
박준혁
06/30/2020, 10:12 AM테스팅 돔에서는 다음과 같이 input value가 정상적으로 잘 입력돼있는데도 안되네용 😞
박준혁
06/30/2020, 10:14 AMhttps://www.apollographql.com/docs/react/development-testing/testing/#testing-loading-states
Copy code
Your mock request's variables object must exactly match the query variables sent from your component.h
Hyeseong Kim
07/01/2020, 1:56 AM한 번 실제 기대응답을 받아서 그대로 전달 해보는게 좋을 것 같아요
전에 MockedProvider 에 버그가 있어서 쓰지 않았던 기억이 있는데요.. 혹시 codegen 으로 인터페이스를 만들어 사용하신다면 useQuery/useMutation 훅 자체를 모킹하는게 더 쉬울 수 있습니다
u
박준혁
07/01/2020, 2:19 AM@Hyeseong Kim codegen으로 인터페이스 만들어서 사용중입니다. 혹시 useQuery/useMutation 훅 자체를 모킹한다는 걸 조금 더 상세히 설명해 주실 수 있을까요?
h
Hyeseong Kim
07/01/2020, 2:25 AM1. 코드젠이 생성한 useXXXQuery 자체를 스파이하는 방법, 코드젠이 생성한 모듈을 jest.fn()으로 대체한 다음 결과를 mockImplementationOnce 해가며 유닛테스트 하는 건 비교적 쉽습니다.
2. 테스트 프레임워크를 대체하는 방법…. cypress 나 msw 같은 경우 네트워크 레벨 스파이를 제공합니다.
3. 서버를 통째로 mocking 하는 방법… 저는 전에 1번이 버그에 막히길래 서버 하나 짜서 테스트 했었네요 하하; 찾아보면 스키마에 목 입혀주는 도구들이 몇개 있습니다.
Hyeseong Kim
07/01/2020, 2:28 AM생성된 타입이 따라오도록 유틸함수를 만들 필요는 있습니다. 저는 이런거 만들어 씁니다.
https://github.com/cometkim/cometjs/blob/master/packages/jest-utils/src/mock.ts#L24-L49
Hyeseong Kim
07/01/2020, 2:28 AM근데 require.requireActual 이 deprecated 됐다고 들은거 같으니 실 구현 섞어 쓰는건 빼야겠네요
Hyeseong Kim
07/01/2020, 2:31 AM아 그냥 위치가 jest.requireActual 로 바뀐거군
u
박준혁
07/01/2020, 2:38 AM답변 감사합니다. 알려주신 방법들 알아볼게용! 🙂 자체 패키지를 만들어서 쓰시는군요. 멋져요!
박준혁
07/01/2020, 5:58 AM다음과 같이 react state에 변경을 주는 event를 각각 act 함수로 감싸주니 해결됐습니다! 다른 분들 이 이슈로 삽질하지 마시라고 공유드려용!
h
Hyeseong Kim
07/01/2020, 6:01 AM그러고보니 act 가 빠진곳이 밑에 있었군요
u
박준혁
07/01/2020, 6:03 AM넵 ㅎㅎ 디버깅 하다보니 각 act마다 component의 로직을 실행시키는 방식으로 동작하더라구요. 그래서 저렇게 코드를 바꿨더니 테스트가 잘 됐습니당 🙂
혜성님께서 알려주신 방법도 좀 더 공부해보려구요. 감사합니당.