From the course: Angular: Workflows

Basic testing setup with the CLI - Angular Tutorial

From the course: Angular: Workflows

Start my 1-month free trial

Basic testing setup with the CLI

“

- [Instructor] We will first be taking a look at different testing workflows and several things that you can do to improve both developer experience and productivity. The CLI does so much for you in setting up your unit and then to a testing infrastructure. But there are several things that you can do to customize your workflow. Let's go ahead and open up the exercise files for this video and run npm install. I've already done it here. I have provided a sample application that was generated with the Angular CLI called the Grid. Let's run npm start to see what it looks like and then we'll take a look at the internals and how it all works. Open up the terminal here and run npm start. The app opens in our default browser and it has a sample application showing tabular data. We can search by status and by name and we can click on a row and view the details. We also have another view showing a chart. Let's take a look now at the internals and head over to the package.json file. We have a few npm scripts setup here. We are using json-server which provides a quick REST API for prototyping. It uses a sample db.json file which includes a list of hackers and we are specifying that the API routes will be redirected to the root. In your browser, you can open up localhost port 3000 and we see a confirmation page. Heading to /api/hackers will return our list of hackers. Let's head back to the package.json file. The start:client script use ng serve along with a proxy configuration file. Because ng serve uses a local web pack dev server at port 4200 and we have a proxy API running in port 3000, we need to proxy requests. We will proxy requests to /api to the json-server that was setup. This application also includes a sample test suite which includes tests for most components, services, and directives. You can head to a particular component and view the sample unit test. Looking at our npm scripts, this is simply run by running npm test. Let's go ahead and open up our terminal and run npm test. I'm going to kill the server using Control + C, clear my terminal, and then run npm test. The CLI is compiling our tests since we can write our tests in TypeScript and runs our suite against an instance of Chrome and then exits. We can see that all 27 tests are passing. The CLI does a fantastic job in setting this up for us as you don't have to write this configuration yourself.

Contents