`프론트엔드 개발자` 개형이의 벽돌집

1. describe 테스트를 구성하는 가장 큰 틀이다. Jest에서 테스트를 구성하는 방식과 동일하다. describe('나의 테스트', {testIsolation: false}, () => { // 나의 테스트 }) 🛑 testIsolation 옵션: 기본적으로 테스트는 테스트간 독립성을 보장해서 클린하게 유지해야 한다. 다만 해당 옵션을 false로 두면 테스트 간 독립성을 해제하고 describe 블럭 안의 테스트끼리는 연관성을 가지게 될 것이다. 2. it describe 안에서 독립적으로 실행될 테스트 단위이다. it 블럭 안에서 한 기능에 대한 테스트를 수행하면 된다. 이 역시 Jest에서 테스트를 구성하는 방식과 동일하다. it('나의 테스트 첫번째', () => { // 나의 테스트 첫번..

지난 포스팅에 이어 테스트코드 작성 방법에 대해 기록해보려고 한다. 테스트 코드 Arrange, Act, Assert 🤔 테스트 코드의 작성은 Arrange, Act, Assert 세가지의 세팅을 해준다고 보면 된다. test('loads and displays greeting', async () => { // Arrange // Act // Assert }) 먼저 테스트할 컴포넌트 예시 코드를 하나 작성해봤다. // Hello.jsx const Hello = () => { return ( Hello World ) } export default Hello 위 컴포넌트에서 Hello World가 제대로 렌더링되는지 테스트하고 싶다. 우선 테스트 코드를 만들어주는데 {name}.test.js 와 같은 네이밍..

이전 회사에서 자동화 테스트를 도입하기 전, 엑셀 시트에 작성된 테스트 케이스를 보며 일일이 매뉴얼 테스트를 했던 경험이 있다. 이 경험은 썩 좋지 않았다. 서비스가 변경될 때마다 테스트 케이스를 변경해 줘야 했고 업데이트될 때마다 테스트를 일일이 수행하는 건 상당한 번거로움이 있었다 🤕 그리고 매뉴얼 테스트만 진행할 경우 파생되는 다른 에러를 잡기에는 분명 어려움이 있을 것이다... 그렇기에 자동화된 테스팅을 도입하면 언급된 문제점들을 어느정도 보완해줄 수 있고 자동 테스트와 매뉴얼 테스트를 함께 진행하면 품질이 더 우수해질 것이다. 단위 테스트란? 🤔 흔히 테스트의 종류는 세 가지로 분류되는 듯하다. 1) 단위 테스트: 모듈 테스트라고도 한다. 하나의 기능을 테스트한다고 보면 되며 단위는 함수, 컴포..