벌써 우테코 프리코스 3주 차가 시작되었습니다! 이번 새로운 과제에서의 테스트 코드가 조금 바뀌었는데요, 단순히 jest로 실행하던 테스트 CLI가 다음과 같이 변경되었습니다.
"scripts": {
"test": "jest --detectOpenHandles --watch"
}
watch라는 명령어가 추가되었는데요, 그렇다면 이게 무엇을 하는 것일까요?
❓Watch 모드는 어떤걸 하는 걸까?
Watch 모드는 실패한 테스트, 정규 표현식을 사용하여 테스트 하고 싶은 파일만 실행시켜주는 기능입니다. 원하는 테스트를 골라서 실행할 수 있게 되는 것이죠!
jest --watch 를 실행하게 되면 다음과 같은 화면이 나옵니다.
Watch를 실행하게 되면 다양한 옵션을 선택할 수 있습니다.
- a 를 입력해 모든 테스트 실행.
- f를 입력해 실패한 테스트 실행
- p와 t를 입력해 정규 표현식을 사용하여 테스트 실행
저는 여기서 의문이 들었습니다. f를 통해 실패한 테스트를 실행할 수 있다는데, 그렇다면 여기서 말하는 실패한 테스트가 무엇인지 궁금했습니다. 어떻게 작동하는 걸까요?
❓Watch 모드에서 실패한 테스트 기준
우선 jest --watch 를 실행 후, f를 눌러 실패한 테스트를 실행시켜 봅시다.
실패한 테스트가 없다고 나옵니다.
그렇다면 실패한 테스트가 무엇일까요?
jest --watch 를 실행후 a 를 실행하면 일반적인 jest 처럼 동작하게 됩니다. jest --watch대신 jest --watchAll 이라는 명령어를 사용할 수도 있습니다.
하지만 아래 Watch Usage 라는 것 보이시나요? 이는 아직 Watch 모드가 동작하고 있다는 것입니다.
바로 여기서 실패한 테스트가 watch 모드에서 말하는 failed test입니다.
여기서 f 를 실행하게 된다면, 위에서 실패한 테스트 2개만 실행하게 되는 것입니다.
Test Suties 가 3개였는데, 2개가 되었죠? 실패한 테스트만 실행 되었습니다.
이렇게 유용한 명령어가 있었다는 걸 이제 알았네요!
❓ --detectOpenHandles 은 무엇일까?
그렇다면 --watch 앞에 있는 --detectOpenHandles는 무엇일까요?
이는 Jest 테스트가 완료된 후에도 여전히 열려있는, 즉 닫히지 않은 핸들을 찾아주는 기능입니다.
사실 이 부분은 잘 이해가 되지 않더라구요, ‘닫히지 않는 핸들? 테스트가 완료된다면 모든 함수는 실행 될 것이고, 그래야만 테스트가 끝이 날텐데, 어떻게 닫히지 않는다는거지?’
이것에 대한 예제를 찾아보니 ‘파일, 네트워크 연결’ 과 같은 상황에서 이런 환경이 만들어 질 수 있다는 것을 알았습니다.
const fs = require('fs');
test('파일 핸들을 닫지 않는 테스트', () => {
const handle = fs.openSync('example.txt', 'r');
// 파일 핸들을 열고 테스트 종료
});
// 테스트가 완료된 후에도 파일 핸들이 닫히지 않았을 수 있음
이 외에도 express 와 같은 백엔드 환경에서 서버를 실행시키는 테스트에서도 이를 활용할 수 있는데요,
const express = require('express');
test('Express 서버 테스트', () => {
const app = express();
app.get('/', (req, res) => {
res.send('Hello, World!');
});
const server = app.listen(3000, () => {
console.log('서버가 시작되었습니다.');
});
// 서버를 닫지 않고 테스트가 종료됨
});
// 테스트가 완료된 후에도 서버가 닫히지 않을 경우 detectOpenHandles 옵션을 통해 이를 감지
이때 서버가 닫히지 않아 메모리 누수가 발생할 수 있는 것을 이 --detectOpenHandles 옵션으로 감지할 수 있다는 것입니다!
😊결론!
jest에서는 --watch와--detectOpenHandles이외에도 다양한 CLI 옵션들을 제공하는데요. 이는 jest 공식 문서에서 확인하실 수 있습니다! 이러한 옵션들을 통해 TDD 환경을 개선할 수 있겠네요!
'Front End > Javascript' 카테고리의 다른 글
[Javascript] Object.freeze()된 객체는 변경할 수 없을까? (0) | 2023.11.10 |
---|---|
[Javascript] If 조건문과 Switch 조건문의 차이 (0) | 2023.11.07 |
[Javascript] 전역에서 객체를 선언하면 안되는 이유 (0) | 2023.11.02 |
[Javascript] 객체 지향의 의존성 (0) | 2023.10.30 |
[Javascript] 객체 지향 (Object Oriented)의 핵심, JS의 다중 패러다임 (0) | 2023.10.28 |