Angular Unit Testing: Login

Photo by Zany Jadraque on Unsplash

This article documented how I write units test for Login Features.

Before I started, I’ll have prepared

• An Angular Project with Login Component. You can find the code here.
• Isolated Test
• Shallow Test
• Integrated Test

Isolated Test

I am only going to test component class logic for Isolated Test without rendering.

There are 5 test cases:

1.) Ensure the component is successfully created (Boilerplate Test Case)

2.) Ensure the component initial state is correct

3.) submitted should true and authError should be false when onSubmit function called.

4.) Verify the form field value updated correctly

5.) Form should be invalid when blank field entered

Shallow Test

The main test I focus in Shallow Test is template rendering. For e.g, I would ensure the button.click() will…