# react testing library

29개의 포스트

[React Test] jest-dom custom matcher, rtl 쿼리 종류 링크

jest-dom custom matcher, rtl 쿼리 종류 링크

2022년 7월 30일
·
0개의 댓글
·

React Testing Library 사전 학습

리액트 컴포넌트 테스트 React Testing Library

2022년 7월 24일
·
0개의 댓글
·

React App Test(5-2) : 비동기 작업 개선

이전 포스트의 내용을 통해 비동기 코드의 테스트를 위해서 findAllByRole 퀴리를 사용하는 방법을 알아보았다. findAllByRole로 Async.js가 리렌더링 되기를 기다려 결과적으로 listitem에 접근할 수 있다. 딱히 문제는 없었지만, 최선의 코드는

2022년 6월 25일
·
0개의 댓글
·

React App Test(5-1) : 비동기 작업

비동기 코드 테스트를 위해 Async.js와 Async.test.js를 만들어 보도록 하자. fetch 해 온 posts data를 setPost로 담는다. return되는 부분은 아래와 같다. state에 저장한 data 값을 li로 렌더링해주고 있다. 먼저 Asy

2022년 6월 25일
·
0개의 댓글
·

React App Test(4) : UI, State 테스트하기

React App을 테스트 할 때, state 값과 UI(User Interaction)에 관련된 내용은 어떻게 처리가 가능할까?이 내용을 알아보기 위해 Greeting이라는 컴포넌트를 아래와 같이 작성해보도록 하자.state값에 따라 처음 화면에는 It's good

2022년 6월 25일
·
0개의 댓글
·

React App Test(3) : 테스트 그룹화(Suite)

Test Suite에 대해 알아보도록 하자.App의 규모가 커질수록 적게는 수십 개에서 수백 개의 test 파일이 생길 수 있다. 이런 여러 테스트 파일을 Test Suite로 묶어 정리할 수 있다. 예를 들어 feature나 관련 component를 기준으로 하여 해

2022년 6월 25일
·
0개의 댓글
·

React App Test(2) : 코드 작성과 실행

두근두근.. 첫 번째 테스트를 실행해보자React App 작업이 완료되었다면, create-react-app으로 프로젝트 생성시 함께 만들어진 setupTests.js와 App.test.js 파일에 주목해보자.파일 이름이 의미하듯, 몇 가지 setup 작업을 수행하는

2022년 6월 24일
·
0개의 댓글
·

React App Test(1) : 개념과 종류, tools

작성한 코드를 '테스트'하는 코드를 작성하자!React 앱과 컴포넌트에 초점을 맞춰 자동화된 테스팅의 세계로 뛰어들어 보자..테스팅(Testing)이란 정확히 무엇일까? 왜 하는 것일까?Unit Test를 이해해보자리액트 컴포넌트를 테스트하고 build해보자

2022년 6월 24일
·
0개의 댓글
·
post-thumbnail

React App Test

React Library Testing과 Jest로 유닛 테스트 방법에 대해서

2022년 6월 21일
·
0개의 댓글
·
post-thumbnail

INSTACOOLIKE 테스팅 코드 TIL

사진에서 처럼 await has no effect 라고 되어있으면서 await를 없애면 event가 먹히지 않는다... 아무것도 입력되지 않은것으로 나온다. await를 입력하자...(진짜 이것때문에 1시간이상을 헤맸다... jest 일해라...)Use .toHaveB

2022년 6월 6일
·
0개의 댓글
·

TDD(Test-Driven Development), RTL(React Testing Library), Test Types

코드 작성 전에 테스트를 작성하고, 테스트에 통과하도록 코드를 작성하는 것입니다 (Write tests before writing code then write code according to "spec" set by tests)흔히 레드-그린 테스트라고 합니다 ("re

2022년 6월 5일
·
0개의 댓글
·

RTL(React Testing Library) vs Jest

테스트를 위한 가상 DOM을 제공(Provides virtual DOM for tests)브라우저 없이 테스트를 진행하면 클릭 요소와 같은 작업을 할 때 가상 DOM이 필요, 그리고 가상 DOM이 원하는 대로 작동하는지 확인가능테스트 러너(Test runner that

2022년 6월 3일
·
0개의 댓글
·
post-thumbnail

react-testing-library로 테스트 코드를 작성해보자

테스트 코드를 사용하면 우리가 프로젝트를 개발하는 과정에서 우리가 써내려가는 코드가 기존의 기능들을 실수로 망가뜨리는 것을 아주 효과적으로 방지할 수 있다. 또한 개발하게 될 때 실제 발생할 수 있게 되는 상황에 대하여 미리 정해놓고 그에 맞춰 코드를 작성하게 되면 우

2022년 4월 22일
·
0개의 댓글
·

react-testing-library, 유저 이벤트

[TIL][엘리스 SW 엔지니어 트랙] 12주차 - react-testing-library, 유저 이벤트

2022년 1월 15일
·
0개의 댓글
·
post-thumbnail

CRA 프로젝트에 Jest 설정 추가하기

✅ cra + typescript + jest 로 테스트환경을 만들면서 마주한 에러들 뿌시기 👊🏻

2022년 1월 7일
·
0개의 댓글
·
post-thumbnail

React Testing Library(Jest)를 활용하여 TDD 경험해보기 -2(Unit Test 편)

프론트엔드에서 간단하게 Unit test를 적용하는 법✨

2021년 10월 25일
·
0개의 댓글
·

React Testing Library로 List 요소 찾기

React Testing Library의 getByRole을 통해 list 요소 찾는 간단한 예제.

2021년 9월 28일
·
0개의 댓글
·
post-thumbnail

typescript, ESLint, Prettier, Jest, React-Testing-Library

nextjs에서 제공하는 명령어를 사용하여 nextjs 초기 프로젝트를 생성한다

2021년 7월 10일
·
0개의 댓글
·