profile
Why?에서 시작해 How를 찾는 과정을 좋아합니다. 그 고민과 성장의 과정을 꾸준히 기록하고자 합니다.
태그 목록
전체보기 (465)error(9)알고리즘(8)DFS(7)Algorythm(7)Two pointers(7)git(7)js(6)BFS(5)webpack(5)React(5)redux(5)leetcode(4)breadth first search(4)ts(4)test(4)리액트(4)State(3)백준(3)shallow copy(3)DP(3)depth first search(3)offsetX(3)TIL(3)keydown(3)Binary Search(3)rotate(3)recursion(3)transform(3)bindActionCreators(3)JS30(3)getBoundingClientRect(2)자바스크립트(2)프로그래머스(2)hash set(2)mapstatetoprops(2)next.js(2)slice(2)Node(2)transform-origin(2)innerHeight(2)절대경로(2)Bit manipulation(2)offsetTop(2)scrollY(2)Constructor(2)Array.from(2)ghost defense(2)pageX(2)transitionend(2)semantic(2)scroll(2)async(2)Sliding Window(2)mapdispatchtoprops(2)Map(2)repository(2)reduce(2)algo(2)currentTime(2)router(2)얕은복사(2)fromIndex(2)refactoring(2)connect()(2)type(2)convention(2)프로토타입(2)vanilla js(2)modal(2)Suspense(2)Next.js 13(2)입출력과사칙연산(2)indexOf(2)linked list(2)stack(2)unit test(2)Recoil(2)login(2)컴포넌트(2)Prototype(2)tsconfig(2)path parameter(2)dynamic programming(2)jest(2)offsetWidth(2)rebase(1)약수(1)평균(1)http(1)동적 라우팅(1)CRA(1)googleid(1)next error(1)댓글삭제(1)queue(1)Absolute Path(1)S3(1)TWIL(1)git revert(1)unit(1)해시(1)serialize(1)성능개선(1)REST(1)얕은복사 전개연산자(1)iteration(1)가운데정렬(1)serializes(1)atom(1)once(1)카카오(1)oAuth(1)reword(1)absolutepath(1)premitive(1)findIndex(1)iterable(1)iterator(1)소수찾기(1)toEqual(1)cypress(1)path(1)flatmap(1)mouseenter(1)FileReader(1)forinloop(1)callback(1)shiftKey(1)useSetRecoilState(1)blur(1)Module(1)실행컨텍스트(1)legacy-peer-deps(1)arguments(1)Rollup(1)라우팅(1)MVC(1)reference(1)행렬(1)@compound component(1)hamming weight(1)매개변수(1)콜라츠(1)capturing(1)끝까지 스크롤했는지 판별(1)Object.assign(1)dotenv(1)input: range(1)await(1)naming convention(1)functionComponent(1)원시값(1)useEffect(1)event loop(1)유사배열객체(1)짝수(1)환경변수(1)scrollLeft(1)교육과정 설계(1)margin:auto(1)revert(1)바닐라 자바스크립트(1)cryptowallet(1)참조값(1)(1)leeetCode(1)react-icon(1)node.js(1)hasOwnProperty(1)class(1)while(1)for(1)textShadow(1)in(1)&&(1)useParams(1)pagination(1)react-modal(1)useRecoilValue(1)mouseenter event(1)cubic-bezier(1)ESLint(1)paddingTop(1)ts error(1)nodeList(1)return-type(1)charCodeAt(1)Flexbox(1)offset(1)pointer-events(1)생성자함수(1)query(1)env(1)DROP(1)selector(1)인터넷(1)SOME(1)배열 안 모든 요소 인덱스 찾기(1)Web3(1)Depth-first searach(1)classList(1)테스트(1)OAuth2.0(1)git log(1)switch(1)bundler(1)unhandledPromiseRejection(1)REST API(1)JWT(1)find(1)pathname(1)토큰(1)next(1)concat(1)sytaxError(1)event.preventDefault()(1)클로저(1)(1)라우터(1)textContent(1)CS(1)원티드 프리온보딩(1)offsetLeft(1)filter(1)소셜 로그인(1)module format(1)eth(1)input event(1)data binding(1)for...in(1)regex(1)온보딩(1)댓글추가(1)npm error(1)build(1)복사(1)base64(1)clientHeight(1)blockchain(1)commit(1)context(1)소셜로그인(1)연결리스트(1)local storage(1)entries(1)mouseleave(1)코드스플리팅(1)Sort(1)vite(1)keyCode(1)this(1)challenge(1)preonboarding(1)DOM(1)transition-timing-function(1)tofixed(1)toBe(1)테스트코드(1)offsetHeight(1)예외처리(1)E2ETest(1)CSS(1)함수선언(1)중복값제거(1)소수(1)Sementic web(1)reset(1)object.entries(1)arrayLike(1)Design Pattern(1)fork(1)data-*(1)shift(1)Context API(1)기프티콘 앱(1)DevTool(1)SSR(1)static method(1)line height(1)dependency(1)React18(1)innerText(1)handleActions(1)transform:rotate(1)--force(1)좋은 컴포넌트(1)execution context(1)시멘틱(1)state 끌어올리기(1)git reset(1)InnerHTML(1)정적 메서드(1)METAMASK(1)transition(1)클래스(1)moduleFormat(1)KeyboardEvent.shiftkey(1)mock(1)for...of(1)provider(1)재귀(1)array(1)spread operator(1)text-align:center(1)super(1)프로젝트(1)coordinates(1)innderHeight(1)display(1)translate(1)useLocation(1)aws(1)github(1)IntersectionObserver(1)icon(1)RenderTree(1)bundle(1)lazy(1)cornify_add()(1)evendigits(1)JSX(1)express(1)semantic web(1)CSSOM(1)git push -f origin(1)setAttribute(1)LIMIT(1)원티드 프리온보딩 프론트엔드(1)path variable(1)squash(1)비트연산(1)redux-devtools-extension(1)event delegation(1)rendering(1)immutability(1)createAction(1)재사용성(1)HTMLCollection(1)object.keys(1)Database(1)yield(1)outerHeight(1)input: color(1).env(1)디자인 패턴(1)(1)again(1)hash(1)streaming SSR(1)duration(1)race condition(1)origin(1)object.values(1)니콘내콘(1)radix-ui(1)SDK(1)bubbling(1)code_splitting(1)drag(1)array replace(1)Singleton(1)playbackRate(1)deep copy(1)closure(1)fallback(1)rm --cached(1)Routes(1)NFT(1)KeyboardEvent(1)유닛테스트(1)교육과정(1)싱글턴 패턴(1)event.isComposing()(1)dynamic programing(1)headless(1)cloudfront(1)sop(1)screenX(1)--legacy-peer-deps(1)query parameter(1)과반수(1)routing(1)pick(1)keyup(1)정규표현식(1)nextjs(1)screenHeight(1)Maximum call stack size exceeded(1)인증(1)배열(1)cors(1)인가(1)asynchronous(1)스테이메모리(1)유닛 테스트(1)Flux(1)position(1)ListNode(1)headless ui(1)semantic tag(1)숙박플랫폼(1)promise(1)formData(1)clientX(1)import(1)video(1)every(1)useRecoilState(1)ScrollIntoView(1)깊은복사(1)자료구조(1)Center(1)social-login(1)dynamic routing(1)API(1)npm(1)URI(1)esbuild(1)parsing(1)timeupdate(1)localeCompare(1)testingLibraryElementError(1)배열 요소의 모든 위치 찾기(1)setProperty()(1)stopPropagation(1)merge(1)
post-thumbnail

[Jest][유닛테스트] (1) 테스트 코드 작성전 설정하기, 에러 해결하기 ( jsx, unhandledPromiseRejection, TestingLibraryElementError)

프로젝트에서 중요한 부분인 예약 기간 선택 기능에 오류가 있는 것을 발견했다. 의도한 대로 동작하지 않는 부분이 있었는데,이것을 하나하나 브라우저에서 실행해 테스트하는 대신 테스트 코드를 작성해두고 사용해보기로 했다. > TDD를 제대로 진행해보고 싶었다. 그냥 새로운 프로젝트부터 TDD를 하기에는 시간도 부족했지만 기능 명세가 부족해 오히려 유연하게 대처하지 못할 위험이 있었다. 모든 기능이 구현 된 이후 리팩토링 단계에서 진행하면 테스트 범위와 내용이 명확해질 뿐더러 에러 해결에도 큰 도움을 받을 수 있을 것이라고 생각했다. 테스트 내용 테스트할 내용은 상세 페이지의 날짜 예약 컴포넌트의 함수들이다. 날짜를 선택하세요 버튼 클릭 시 달력 창 열기 달력 창이 렌더링 된 후 예약 불가능한 날짜 받아오기 예약 불가능한 날짜로 달력에 선택 불가하도록 표시 (disableDates()) 체크인 날짜를 선택하면, checkFirstUnavailableDate

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