뒤로 가기
홈으로 이동
LearnFit
공유하기
YouTube, Jest 강좌 #6 리액트 컴포넌트 + 스냅샷 테스트 - 자바스크립트 테스트 프레임워크
서원석님의 학습노트

[Jest - 요약] 리액트 컴포넌트 + 스냅샷 테스트

#전체
#개발자
#프론트엔드
#자바스크립트
#javascript
#js
#es6
#강좌
#tutorial
#중급
#intermediate
#mock
#목 함수
#jest
#test
#제스트
#테스트
#사용법
#비동기
#asynchronous
#async
#callback
#promise
#await
#toBe
#toEqual
#toStrictEqual
#toBeNull
#toBeUndefined
#toBeDefined
#toBeTruthy
#toBeFalsy
#toBeGreaterThan
#toBeGreaterThanOrEqual
#toBeLessThan
#toBeLessThanOrEqual
#toBeCloseTo
#toMatch
#toThrow
#matcher
#matchers
#beforeAll
#beforeEach
#afterAll
#afterEach
#only
#skip
#react
#component
#testing
#snapshot
#스냅샷
#리액트
#컴포넌트
00:00jest 활용해서 react 컴포넌트 테스트하는 법
03:06snapshot test 하는 법 *snapshot test: 컴포넌트가 성공하는 케이스를 찍어두고 비교하며 테스팅하는 방식
07:01시간에 따라 변화하는 컴포넌트에 대해 snapshot test 하는 법
08:52Date.now = jest.fn(()=> 123456789); 을 하면 Date.now()는 항상 123456789를 return 하는 함수가 됩니다. *Timer 컴포넌트 안의 Date.now에 적용되는 사항입니다. // 참고하기(Timer 컴포넌트 내부 코드) const now = 123456789; const sec = new Date(now).getSeconds(); console.log('sec: ', sec); // sec: 36
09:36snapshot 테스트의 의의와 인지할 점
✔ 학습 완료

이 학습노트가 포함된 러닝패스예요.

서원석님의 다른 노트는 어때요?

서원석의 프로필 이미지
서원석
의 학습노트

리액트로 이미지 미리보기 구현(feat. useState, useEffect, useRef, FileReader)

영상 재생 모양 아이콘
Video
⏱ 핵심 스탬프
25
00:01
이 학습노트에서 구현하는 결과물 입니다.(파일 선택기에서 이미지 파일을 고르면 이미지 미리보기)
00:25
코드 살펴보기 시작
👍
2
스크랩
서원석의 프로필 이미지
서원석
의 학습노트

네거티브 마진 negative margins | 코딩가나다 | 빔캠프

영상 재생 모양 아이콘
Video
⏱ 핵심 스탬프
6
04:38
B에 negative margin을 적용하기
05:00
마크업 상에서 아래 쪽에 위치하면 위로 올라갑니다. *negative margin과 상관없는 이야기
👍
6
스크랩
👋 다양한 인사이트를 읽어보고 계신가요?
나만의 학습 기록을 남기고, 관리하고 싶다면!
다양한 전문가의 멤버십 전용 콘텐츠를 보고 싶다면!
나의 학습 내용을 공유하고, 수익을 올리고 싶다면!
3초 회원가입/로그인으로, 런핏의 커뮤니티에 여러분도 함께하세요.
3초 만에 가입하기