Angular unit testing using karma and jasmine tutorial

We take a look at the basics of Angular unit testing using karma and jasmine. We cover writing sample unit tests for angular services, components, pipes, directives and router-outlet components. We also take a look at the various karma configurations including generating coverage reports.

00:00 - Introduction
01:30 - Karma config
05:10 - Unit test for Service
06:00 - describe()
06:30 - beforeEach/beforeAll/AfterEach/AfterAll
07:30 - it()
08:20 - HttpTestingModule
12:24 - Coverage
19:20 - fail()
21:50 - Jasmine spy
24:23 - fakeAsync/tick
26:15 - Unit test for Component
33:14 - Page object
36:52 - Detectchanges for Binding
40:58 - Updating input values
47:03 - Test component level provider/overrideComponent
52:32 - Unit test for Pipe
53:45 - Unit test for Directive
58:19 - Unit test for router-outlet
1:00:08 - fdescribe
1:02:25 - xdescribe/fit/xit
1:03:07 - Headless Chrome
1:03:52 - Debug tests in Chrome

[FrancisRodrigues]

It's incredible how we can use Karma/Jasmine with Unit testing also in Nodejs applications, allowing the DEV to build apps faster.

[deepakbawa]

Wonderful hatts off. It would be nice if you create a dummy blogging project with admin panel as well as the front-end panel and write unit tests would be the ultimate experience of unit testing. IT would be possible.

[sureshkanuri]

Sir you did good job for beginners after i watch this video here learned some many concepts

[vijayansivaraman]

Great Video. Much appreciated your efforts.

[rahulmukherjee]

Very informative. If you can give a bit more details about specific things - like waitforasync - what it does that fakeasync doesnt....then that owuld help more

[FrancisRodrigues]

What's this VSCode extension that refactors your code when you save it?

[tharuns]

very good informative video for the beginners. Thank you

[abhinav]

Sir thanks for this Video!! 
Sir You have done the unit testing on the basis of hardcode values and hardcode models. Suppose If I want the value to be dynamic and Mock models which has been created in LoginComponent and HomeComponent is same but data are different. How to handle that ?
Username and password is not same there is multiple users and users will have different credentials then how will create fake models?

[FrancisRodrigues]

Hey, would you like me to update the test cases for Angular 16? Just ping me here. :))
I was building my Angular 16 by watching your hands-on.. I fixed some parts...
Some cases are outdated. Others with WARN flag in the terminal.

[mouneshhiremani]

you didnt tell us how to configure karma and create karma config

[herculesstrydom]

I removed the line http = TestBed.inject(HttpClient); and the test still works. Why did we include this in the first place ? Is it because HttpClient is a dependency of the service?

[farhanaaz-dowz]

hi iam trying to run but error To disable this warning use "ng config -g cli.warnings.versionMismatch false".

[vishtrinity]

is it wrong to use the service instance directly without mocking it? LIke the below code?

describe('LoginService', () => {
let service: LoginService;

beforeEach(() => {

service =
});

it('should be created', () => {

});
});