Mô tả

You’re here because you know typescript and want to write better code with fewer bugs using unit tests.


I am here because I can help you accomplish your mission. I have B.s.c + M.s.c in mechanical engineering. I have been making software applications for over 20 years in the Hi-Tec industry and have much teaching experience. You can trust me and my teaching methods. I have learned many technologies in the past (check my LinkedIn profile), and I know exactly what is needed to learn and how.


In this course, I teach you everything you need about unit tests, and I use a real-world system, typescript, vitest, and jest.


The task of writing a unit test is not simple because there are many moving parts:

- Unit test of logic code

- Unit test of code with side effects like accessing the web

- Unit test of a module that uses another module

- Mocks

- Timers

- Unit test of UI

- Unit test of code that runs on the server

- Jsdom, testing library, react testing library

- Some tools like jest need a nontrivial setup to work with typescript and ES module

- New competitor to jest, e.g., vitest

- Coverage test


This ocean is very hard to swim without first learning it properly, and this is done in this course.


Learning in this course is not just video lessons; there are other important learning materials that most courses do not provide as a whole :

- Quiz after EVERY lesson

- Coding exercise at the end of EVERY coding section

- pdf file with all the lectures

- pdf file with a dictionary of all the material that I teach in this course



Bạn sẽ học được gì

Create unit tests for real world typescript client and or server applications using vitest or jest

Write better typescript code with less bugs

Ship code to production quickly and confidently

Represent your system using advanced diagrams : block diagram ,UML sequence diagram and UML class diagram

Write unit testing of pure logic code using test and expect

Invoke test coverage tool like istanbul

Write unit testing for code with side effect using spyOn , fn and mock

Use advanced concepts for unit testing : refactoring , debugging , filtering

Use isolated test and sociable test for unit test with module interaction

Create unit testing involving real and fake timer such as in sinonjs/fake-timers

Create unit testing for frontend vanilla UI using jsdom : document , querySelector

Create unit testing for frontend vanilla UI using dom testing library : getByText , getByRole , waitFor

Create unit testing for frontend react UI using react testing library : render , screen

Use advanced typescript for better code : union , enum , type any and unknown , polymorphism using inheritance , class diagram

Create unit tests using vitest and jest and compare between these tools

Yêu cầu

  • Knowledge of typescript is required

Nội dung khoá học

18 sections

Getting started

7 lectures
Welcome to my course
06:34
Setup simple unit test project
04:57
Setup simple unit test project
6 questions
Create your first unit test
07:59
Create your first unit test
5 questions
Coding Excercise 1
02:15
Coding Excercise 1 solution
03:56

Testing concepts and tools

25 lectures
Section Intro
00:48
What is testing
03:04
What is testing
3 questions
Unit test vs integration test vs e2e test
02:18
Unit test vs integration test vs e2e test
5 questions
Side effects
01:17
Side effects
4 questions
Properties of a good unit test
01:47
Properties of good unit test
2 questions
Manual test vs automatic test
03:19
Manual test vs automatic test
2 questions
Motivation for automatic testing
02:12
Motivation for automatic testing
1 question
Should you test all your code
02:13
Should you test all your code
2 questions
Unit testing best practices
03:29
Unit testing best practices
2 questions
Unit testing modes
02:46
Unit testing modes
2 questions
Unit testing framework : vitest and jest
04:10
Unit testing framework : vitest and jest
3 questions
Vitest
01:28
Vitest
2 questions
Jest
00:46
Jest
1 question

Task queue manager- the system we will unit test

15 lectures
Section Intro
01:26
Simple system UI
04:00
Simple system UI
4 questions
Block diagram
05:36
Block diagram
6 questions
Sequence diagram
05:45
Sequence diagram
7 questions
Source code
02:56
Source code
4 questions
Motivation
03:46
Motivation
2 questions
Specification
02:01
Specification
4 questions
Project structure
01:25
Project structure
1 question

Unit test of pure logic code - TaskQueue

17 lectures
Section intro
00:45
Directory final setup
00:27
Unit test of an object or a class
01:43
Unit test of an object or a class
2 questions
Choosing the first module to unit test
01:22
Choosing the first module to unit test
1 question
Setup unit test for TaskQueue
05:18
Setup unit test for TaskQueue
5 questions
TaskQueue - test for empty queue
04:10
TaskQueue - test for empty queue
3 questions
TaskQueue - test for non empty queue
06:21
TaskQueue - test for non empty queue
5 questions
Fix the test using beforeEach and add clear function to TaskQueue
05:04
Fix the test using beforeEach and add clear function
4 questions
Code at section end
00:04
Coding Excercise 2
02:34
Coding Excercise 2 - solution
08:03

Code coverage

11 lectures
Section intro
01:06
Code coverage meaning and motivation
00:58
Code coverage meaning and motivation
2 questions
Do we need 100% code coverage
00:57
Do we need 100% code coverage
3 questions
Inatallation
01:15
Inatallation
2 questions
Usage
02:50
Usage
1 question
Coding Excercise 3
01:00
Coding Excercise 3 - solution
06:06

Unit testing of pure logic code - TaskDispatcher

28 lectures
Section intro
00:45
Choose the second module to unit test
03:58
Choose the second module to unit test
3 questions
Dive into TaskDispatch code
02:07
Dive into TaskDispatch code
6 questions
Prepare the test file
00:48
Prepare the test file
1 question
Unit test empty map - dispatch throw
06:35
Unit test empty map - dispatch throw
5 questions
Unit test task not found - dispatch throw
03:54
Unit test task not found - dispatch throw
2 questions
Function type as function argument issue
01:09
Function type as function argument issue
1 question
Refactor types
04:46
Refactor types
2 questions
Test dispatch status is ok
03:48
Test dispatch status is ok
2 questions
Test reveal bug in dispatch -> debug and fix
03:00
Test reveal bug in dispatch -> debug and fix
2 questions
Test dispatch result is ok for add function
04:55
Test dispatch result is ok for add function
2 questions
Check code coverge
00:31
Check code coverge
1 question
How to filter tests
03:49
How to filter tests
4 questions
Code at section end
00:04
Coding Excercise 4
02:31
Coding Excercise 4 - solution
17:39

Introduction to unit testing of code with side effects and module interaction

13 lectures
Section intro
00:55
What is a side effect
01:13
What is a side effect
1 question
What is a mock
00:48
What is a mock
3 questions
Motivation for mocks
02:03
Motivation for mocks
3 questions
API for mocks
00:49
API for mocks
2 questions
Modules with side effects and module interaction
01:37
Modules with side effects and module interaction
3 questions
Solitary (isolated) test vs sociable test
00:32
Solitary (isolated) test vs sociable test
1 question

Unit test of persist with side effect

9 lectures
Unit test using jsdom
19:47
Unit test using jsdom
4 questions
Unit test with console.log and spyOn()
18:13
Unit test with console.log and spyOn()
8 questions
Unit test with Storage.prototype and spyOn()
06:46
Unit test with Storage.prototype and spyOn()
1 question
Code at section end
00:04
Coding Excercise 5
01:46
Coding Excercise 5 - solution
12:23

Unit test of TaskQueue with persist module interaction

17 lectures
Unit test using sociable test
05:58
Unit test using sociable test
3 questions
Motivation for unit test using isolated (solitary) test
04:33
Motivation for unit test using isolated (solitary) test
3 questions
Using mock() and fn() for persist using isolated (solitary) test for TaskQueue
06:22
Using mock() and fn() for persist using isolated (solitary)
3 questions
Refactor taskQueue to a class
09:48
Refactor taskQueue to a class
1 question
Add persist related test cases and use sociable test for TaskQueue
10:16
Add persist related test cases and use sociable test for TaskQueue
3 questions
Use isolated (solitary) test for added test cases
16:14
Use isolated (solitary) test for added test cases
6 questions
Should you use sociable or isolated (solitary) test
02:26
Should you use sociable or isolated (solitary) test
2 questions
Code at section end
00:04
Coding Excercise 6
02:21
Coding Excercise 6 - solution
12:57

Unit test of TaskScheduler with fake timer and module interaction

12 lectures
Test plan
01:26
Test plan
1 question
Use fake timers in unit test
07:41
Use fake timers in unit test
4 questions
Test for result and add callback in TaskScheduler
12:33
Test for result and add callback in TaskScheduler
3 questions
Finish the unit test
05:15
Finish the unit test
1 question
Summary unit test of TaskScheduler
02:06
Code at section end
00:04
Coding Excercise 7
01:42
Coding Excercise 7 - solution
03:16

Introduction to frontend unit testing

7 lectures
Section intro - Where are we now and how to continue
06:20
Where are we now and how to continue
2 questions
Dom unit testing tools
01:53
Dom unit testing tools
2 questions
Download and invoke the UI
08:56
Download and invoke the UI
8 questions
Code at section end
00:04

Frontend unit testing with jsdom

17 lectures
Jsdom setup and simple unit test for h1 text
06:00
Jsdom setup and simple unit test for h1 text
5 questions
Unit test for buttons count and text
06:15
Unit test for buttons count and text
3 questions
Elegant unit test for buttons using enum and loop
02:07
Elegant unit test for buttons using enum and loop
1 question
Powerful unit test for 'enqueue add(1,2)' button
06:49
Powerful unit test for 'enqueue add(1,2)' button
7 questions
Unit test with spyOn to test 'queue length' buttton
01:51
Unit test with spyOn to test 'queue length' buttton
1 question
Use spyOn to test for failure to appear in the UI
08:06
Use spyOn to test for failure to appear in the UI
5 questions
More jsdom unit test to get 100% coverage
05:05
More jsdom unit test to get 100% coverage
2 questions
Code at section end
00:04
Coding Excercise 8
00:17
Coding Excercise 8 - solution
02:03

Frontend unit testing with dom testing library

26 lectures
Introduction and motivation for testing library
02:13
Introduction and motivation for testing library
3 questions
Setup for dom testing library
01:51
Setup for dom testing library
1 question
Flexible unit test for heading using role and getByRole
02:30
Flexible unit test for heading using role and getByRole
3 questions
Use setup.tc for an extended matcher like toBeInTheDocument
01:58
Use setup.tc for an extended matcher
2 questions
Button role and getAllByRole for a flxible unit test
02:17
Button role and getAllByRole for a flxible unit test
2 questions
userEvent , getByText and status role in unit test
03:06
userEvent , getByText and status role in unit test
3 questions
Repalce sleep with smart wait using waitFor
02:59
Repalce sleep with smart wait using waitFor
3 questions
Unit test for failure to appear in the UI after task has failed
03:53
Unit test for failure to appear in the UI after task has failed
1 question
Unit test for empty string to appear in the UI if task is not dispatched
02:16
Unit test for empty string to appear in the UI
1 question
Unit test with console.log and console.error
05:10
Unit test with console.log and console.error
1 question
Section summary
01:21
Code at section end
00:04
await on userEvent.click
01:36
await on userEvent.click
1 question
Coding Excercise 9
03:10
Coding Excercise 9 - solution
17:38

More requirements -> code changes -> unit test

31 lectures
Section intro
01:43
Section intro
2 questions
Add is scheduler started in logic and render to the UI
14:36
Add is scheduler started in logic and render to the UI
4 questions
Update test to get 100% coverage
00:42
Update the test to get 100% coverage
1 question
Render queue length
02:59
Render queue length
1 question
Support async dispatch function
13:53
Support async dispatch function
4 questions
Faketimer problem with async dispatch solved with flushPromises
02:38
Faketimer problem with async dispatch
1 question
Unit test of async dispatch functions : add and getPosts
08:35
Unit test of async dispatch functions : add and getPosts
3 questions
Add enqueGetPosts in the UI + unit test + ad hoc vitest fix
05:38
Add enqueGetPosts in the UI + unit test + ad hoc vitest fix
1 question
Task overlapping problem
02:51
Task overlapping problem
2 questions
Implement step by step a real timer test for task overlapping
09:35
Implement step by step a real timer test for task overlapping
2 questions
Final task overlapping test + source code
05:30
Final task overlapping test + source code
2 questions
Add action with result to the UI
07:51
Add action with result to the UI
2 questions
Add try catch in dispatch
05:14
Add try catch in dispatch
1 question
Fix save on empty array for dequeue
03:45
Fix save on empty array for dequeue
2 questions
Code at section end
00:04
Coding Excercise 10
00:34
Coding Excercise 10 - solution
06:23

Advanced typescript for better code

29 lectures
Section intro
01:08
Section intro
2 questions
The problems with string as action type and possible solutions
01:38
The problems with string as action type and possible solutions
1 question
Union of strings as action type
02:55
Union of strings as action type
2 questions
Enum as action type
11:45
Enum as action type
3 questions
The problematics of working with type any
01:19
The problematics of working with type any
1 question
Use type unknown instead of type any
04:07
Use type unknown instead of type any
5 questions
From unknown type to the correct type using validation
04:40
From unknown type to the correct type using validation
1 question
Unit test for code with unknown
08:07
Unit test for code with unknown
3 questions
Motivation for generic task queue manager
01:37
Motivation for generic task queue manager
1 question
Design of generic storage using polymorphism , inheritance and interface
02:43
Design of generic storage using polymorphism , inheritance and interface
1 question
Implement Persist class and IPersistStorage interface
05:55
Implement Persist class and IPersistStorage interface
2 questions
Implement class LocalStoragePersist and check with unit test
07:05
Implement class LocalStoragePersist and check with unit test
2 questions
Refactor and use queue length getter
01:35
Refactor and use queue length getter
1 question
Code at section end
00:04
Coding Excercise 11
02:16
Coding Excercise 11 - solution
11:58

React UI : Unit testing with react testing library - RTL

23 lectures
Section intro
00:24
Download react ui and invoke vanilla or react ui
06:12
Download react ui and invoke vanilla or react ui
3 questions
Tools to test react applications - mostly RTL
02:48
Tools to test react applications - mostly RTL
2 questions
Use jsdom to test that a text exists on react ui
07:37
Use jsdom to test that a text exists on react ui
4 questions
Use the RTL to create the first react unit test
04:38
Use the RTL to create the first react unit test
3 questions
More unit tests using the RTL
06:38
More unit tests using the RTL
1 question
Unit test with document and RTL
03:17
Unit test with document and RTL
1 question
Complete the remaining tests using the RTL
04:47
Complete the remaining tests using the RTL
2 questions
Fix react bug using unit test
09:58
Fix react bug using unit test
1 question
Use code coverage to remove unused code
01:58
Use code coverage to remove unused code
1 question
Section summary
03:22
Code at section end
00:04
Coding Excercise 12
01:53
Coding Excercise 12 - solution
12:02

Unit tests with Jest

33 lectures
Section intro
01:23
What is jest and its API relation with vitest
01:21
What is jest and its API relation with vitest
2 questions
Create jest setup
05:34
Create jest setup
5 questions
Add watch mode
01:02
Add watch mode
2 questions
Add coverage test
00:59
Add coverage test
2 questions
Configure vitest to handle only the test directory
03:06
Configure vitest to handle only the test directory
1 question
Tweak tests with jest to compile
06:06
Tweak tests with jest to compile
6 questions
Fix test with jest: add jsdom to jest.config.ts
02:00
Fix test with jest: add jsdom to jest.config.ts
2 questions
Fix test with jest: add matchers
01:29
Fix test with jest: add matchers
1 question
Fix test with jest regarding toContain
03:18
Fix test with jest regarding toContain
2 questions
Fix test with jest : dayjs problem -> add "esModuleInterop": true in tsconfig.js
01:22
Fix test with jest : dayjs problem
1 question
Fix test with jest : persist mock problems --> add clearMocks and replace mock()
02:52
Fix test with jest : persist mock problems
1 question
Use testMatch in jest.config.ts for better test file filtering
02:11
Use testMatch in jest.config.ts for better test file filtering
1 question
Fix test with jest: problem with fetch --> replace with axios in src
07:02
Fix test with jest: problem with fetch
2 questions
Build the comparison between jest and vitest
12:58
Build the comparison between jest and vitest
1 question
Summary of the comparison between jest and vitest
01:23
Code at section end
00:04
Coding Excercise 13
01:25
Coding Excercise 13 - solution
08:23

Where to go from here

3 lectures
Here we are - course summary
04:18
Where to go from here - task queue manager
02:14
Where to go from here - testing
00:52

Đánh giá của học viên

Chưa có đánh giá
Course Rating
5
0%
4
0%
3
0%
2
0%
1
0%

Bình luận khách hàng

Viết Bình Luận

Bạn đánh giá khoá học này thế nào?

image

Đăng ký get khoá học Udemy - Unica - Gitiho giá chỉ 50k!

Get khoá học giá rẻ ngay trước khi bị fix.