[moin 회고] 2021-08-19

김_리트리버·2021년 8월 20일
0

Facts

  • jest user module mocking 버그 해결

Findings

  • glob pattern $1 사용법
  • regex(.*)$ 사용법
  • (.*)$: capture whatever comes after the exact match (the directory)
    ( = 뒤에 오는 파일, 폴더 전부 )
  • $1: map it to this value in the directory I specify.
    ( = 해당 폴더에 있는 파일 전부 )

ex > '^@modules/(.*)$': '<rootDir>/src/modules/$1'

@modules/sample.js = <rootDir>/src/modules/sample.js'

https://mug896.github.io/bash-shell/exp_and_sub/filename_expansion.html

Feelings

hooks 폴더에 여러 사용자 hooks 를 모아두고 index.ts 로 import 한 후 한꺼번에 export 하는 파일이 있었음

test 하려는 파일에서 해당 index.ts 의 hook 을 사용하는 부분이 있어 mocking 처리를 해줘야 했음

같은 폴더에 __mocks__ 폴더에 index.ts 로 mock file 을 만들어서

기존에 moduleNameMapper 에서 설정한대로

test.ts 에서 jest.mock("@hooks") 로 mocking 할 거라는 걸 jest 에 알리고자 했음

하지만 jest 에서는 Cannot find module '@hooks' from 'src/views/components/**tests**/RemitComponent.test.tsx' 처럼

module 을 찾을 수 없다고 error 를 띄웠음

moduleNameMapper 쪽에 문제가 있을 것이라 가정하고

@hooks 부분을 확인해 보았음

@hooks 에는 하위 폴더가 없고, index.ts 에서 모아서 export 시키는데 moduleNameMapper 설정을 아래처럼 해놓은 게 원인이었음

'^@hooks/(.*)$': '<rootDir>/src/lib/hooks/$1',

@hooks 의 특정 파일을 import 하지 않을 것이기 때문에 moduleNameMapper 설정을 아래처럼 변경해 주었음

'^@hooks/(.*)$': '<rootDir>/src/lib/hooks',
profile
web-developer

0개의 댓글