angular 프로젝트 폴더에 e2e 폴더란?
프로젝트 이름이 demo인 angular 프로젝트를 생성하면..
ng new demo
e2e 폴더가 생성된다.
여기서 이 e2e 폴더는 무엇일까?
e2e 폴더안에는
- src폴더
- protractor.conf.js
- tsconfig.e2e.json
구조로 되어 있다.
src폴더 안에는
- app.e2e-spec.ts
- app.po.ts
구조로 되어 있다.
여기서 e2e란?
e2e 는 end to end 를 뜻한다.
끝에서 끝
end to end test 끝에서 끝을 테스트한다.
- 소프트웨어의 흐름을 처음부터 끝까지 테스트 한다.
- 실제 사용자 시나리오를 시뮬레이션 한다.
- 테스트 하고자 하는 시스템과 연계된 서브 시스템까지의 흐름도 테스트
- 시스템간의 데이터 무결성 확인
- 다른 시스템, 인터페이스, 데이터베이스, 네트워크 및 기타 응용 프로그램과의 통신에 대한 테스트
e2e 에 대해서는 더 많고 다양한 정의와 정의 뿐만이 아닌 테스트를 해야하는 목적과 테스트 하는 방법 등에 대해 찾아 보자.
간단히 이야기해서 웹의 경우 사용자가 실제 로그인, 또는 계좌 이체, 상품 구매 등의 행위를 했을 시 정상적으로 동작하는지 테스트 하는 것이다.
angular 는 angular cli 를 통해서 e2e 테스트를 수행할 수 있다.
cmd 로 명령어 실행 시 angular 프로젝트 경로에서 ng e2e 명령을 실행하면 e2e 테스트가 실행된다.
도움말을 보고싶으면 ng e2e --help 명령어를 실행하면 e2e 옵션에 대해 볼 수 있고,
또한 https://angular.io/cli/e2e 에 가서 확인해도 된다.
여기서 한가지 보게 되면
protractor.conf.js 가 있는 것을 볼 수 있다.
protractor가 무엇인지 찾아보면
protractor 라는 사이트를 찾을 수 있다.
protractor
사이트 주소는 http://www.protractortest.org/
angular application을 위한 end to end test 프레임워크라고 나와 있다.
여기서 우선 추측해보자면..
app.po.ts 파일은
테스트를 실행하기 위해 application이 실행된 뒤 web에 접근하기 위한 코드인 거 같다.
특정 url로 특정페이지를 요청하는 코드.
해당 페이지에 그려진 html 코드를 가져오기 위한 코드.
그리고
app.e2e-spce.ts 는
e2e 테스트를 실행하는 테스트 코드로 보여진다.
angular 각 컴포넌트 파일당 spec.ts 파일이 단위 테스트 파일로 만들어지는 것과 동일하게 만든것 같다.
그리고
protractor.conf.js 파일은
파일명 그대로 e2e테스트를 위한 protractor 의 설정 파일로 보여진다.
여기서 angular는 karma.conf.js 파일도 만든다.
여기서 karma는 카르마 테스트 러너라고 한다.
jasmine 이라는 frontend 테스트 프레임워크를 실행시키기 위한 러너라고 보여진다.
angular cli 를 통해
ng generate component demo 를 이용해서 demo 라는 이름의 컴포넌트를 생성하게 되면
component.ts 파일 외에 component.spec.ts 파일이 만들어지는데..
이 파일이 바로 angular 단위 테스트를 하기 위해 만들어진 파일로
karma 러너를 통해서 실행되는 jasmine 프론트 엔드 테스트 코드 파일이다.
우선 여기까지..