Angular + AWS Code Build Unit and E2E testing

Angular and AWS code build unit and e2e testing

Angular is a framework to build rich Single Page Applications and Desktop applications and preferred writing programming language is TypeScript.
In this article, we will setup AWS Code build CI/CD for angular CLI generated project.

AWS Code Build is an AWS Cloud platform service which is used to do project builds, it supports all types of application build as Frontend build and backend builds.

Pre-Requisite

We need to setup a AWS code build project with some source artifact like Github or AWS Code commit. Link https://docs.aws.amazon.com/codebuild/latest/userguide/getting-started.html to setup a project.

Project Setup

Generate a new angular project with angular-cli or clone repo — https://github.com/vinaymavi/Angular-AWS-Code-Build-Unit-and-E2E-testing.

Folder structure of generated project:

angular project structure

Configuration Update for CI/CD setup

Update Karma Configuration to support headless chrome:

update karma configuration at src/karma.conf.js .

karma-configuration

Update protractor configuration to support headless chrome:

Update protractor configuration file at e2e/protractor.conf.js

protractor configuration

Validation:

validate unit tests npm run test .

validate end to end tests npm run e2e .

AWS Code Build Configuration:

place a buildspec.yml file in root folder of project with given configuration 🚀 🚀 🚀

Push code to your AWS code build linked git repository:

Push code AWS code build linked git repository and start build 👏 👏

start build screen