inflearn logo
강의

강의

N
챌린지

챌린지

멘토링

멘토링

N
클립

클립

로드맵

로드맵

지식공유

따라하며 배우는 리액트 테스트 [2023.11 업데이트]

카운터 숫자 구현하기

test를 위한 컴포넌트 변경

194

이지일렉트릭

작성한 질문수 3

0

안녕하세요, 강의 잘 보고있습니다.

 

이번 강의에서 test로 컴포넌트를 갖고오기 위해 data-testid를 넣어주셨는데,

기존 구현되어있는 컴포넌트를 테스트 하기 위해 기존 컴포넌트를 변경을 해주어야하는게 맞을까요???

예를들어, 
5분 31초 가량 코드 10번째 라인에서

<h3 id="counter">0</h3>의 코드를 테스트를 위해서

<h3 id="counter" data-testid="counter">0</h3>로 변경을 해야하는 걸까요??

모든 코드를 테스트를 위해 컴포넌트를 변경해야하는지 의문이 들어 질문을 드리게 되었습니다.

 

감사합니다.

react React-Context 웹앱 jest

답변 2

1

John Ahn

안녕하세요!!! 

 

id를 이용해서 컴포넌트를 테스트하는 부분은 그리 이상적이지 않은 방법입니다. 

그렇기에 뒷부분으로 가서는 id 이외의 방법으로 테스트를 하게 됩니다! 

여러 방법을 보여드리기 위해서 id를 사용한 것이므로 강의를 계속 봐주셔서 다른 방법을 사용해서 엘리멘트를 가져와주시면 될 것 같습니다! 

감사합니다.

0

이지일렉트릭

안녕하세요, 한가지 더 궁금증이 있어 질문드립니다.

 

jest를 사용하여 컴포넌트 테스트를 해주셨는데, 이 과정을 end to end 테스트라고 생각해도되는건가요??

또한, 컴포넌트 테스트를 jest 대신 storybook을 사용하여 테스트 할 수 있는 것으로 아는데,  두 가지 방법이 '컴포넌트 테스트를 jest대신 storybook으로 한다'처럼 비교할 수 있는 방법들인지 궁금합니다.

 

마지막으로, jest나 storybook을 사용하여 컴포넌트 테스트를 하는 것을 end to end 테스트라고 할 수 있는 건가요??

 

 

감사합니다!

제공해주신 코드를 vscode에서 켜도 eslint가 안됩니다.

0

278

2

ERROR

0

210

1

테스트 시간을 단축할 수 있는 방법에 대하여 문의드립니다.

0

362

1

useState 배열값 변경의 경우 테스트 멈춤

0

411

1

test was not wrapped in act관련 질문

0

290

2

안녕하세요! 로딩 상태 테스트에 관련된 질문입니다.

0

395

1

강의 관련 내용 github 업로드 질문

0

307

1

이미지가 안보인다 하셔서 다시 질문드립니다.

0

414

2

Test Fail이 발생합니다 ㅠㅠ

0

357

1

스타일 컴포넌트 테스트 방법

0

439

1

msw 에러

0

632

1

toHaveTextContent 에러

0

446

1

msw안돼는사람

0

579

1

This could be because the text is broken up by multiple elements. 에러

0

1717

2

Type.test.js파일에 궁금한점이 생겼습니다

0

351

1

28강 수강 중 JSX 작성 방법에 대해 궁금해져서 질문 남깁니다!

0

398

1

toHaveTextContent 에서 에러가 자꾸 나는데 아무리 찾아도 잘 모르겠습니다.

0

612

2

aria-*

0

440

1

This XML file does not appear to have any style information associated with it. The document tree is shown below. 에러

1

14115

1

컴포넌트 props내려줄때 코드는 어떻게 해야하나요

0

248

0

es6 jest 미지원 오류 문의

0

859

1

test 여러 개 실행 - fail 발생

0

292

1

useMemo

0

282

1

axios 1.1.2 버전 issue ( SyntaxError: Cannot use import statement outside a module)

4

2225

5