7.1 Next.js 애플리케이션 개발과 통합 테스트

• https://github.com/frontend-testing-book-kr/nextjs

7.1.1 애플리케이션 개요

기술 관련 기사를 작성하고 공유하는 애플리케이션.

7.1.2 단위 테스트 및 통합 테스트 실행하기

$ npm i $ npm test $ open reports/jest.html

7.2 React Context와 통합하기

• https://github.com/frontend-testing-book-kr/nextjs/blob/main/src/components/providers/ToastProvider/index.test.tsx

7.2.1 테스트할 UI 컴포넌트

테스트 대상은 사용자에게 애플리케이션의 응답 결과를 통지하는 <Toast> 컴포넌트

Context API를 활용하여 상태 갱신하기.

// src/components/providers/ToastProvider/ToastContext.tsx

export const initialState: ToastState = {
  isShown: false,
  message: "",
  style: "succeed",
};