
Learn real-world TypeScript unit testing from beginner to hero, using V test and Jest, with 13 coding exercises and a real system project to practice.
learn to set up a vanilla TypeScript project in VS Code, install vitest as a dev dependency, and configure package.json to run tests with vitest.
Create your first unit test for a TypeScript function by placing a .test.ts file in a test directory, importing test from vitest, and validating add(1,2) equals 3.
Practice real-world TypeScript unit testing by implementing a calculate average function using reduce and creating tests in math.tests for empty arrays (return none), a single value, and the 1,2,3 case.
Explore testing concepts and tools essential for understanding unit tests, end-to-end tests, integration tests, automatic tests, and jest in real-world TypeScript.
Understand software testing basics, verify that code meets the spec, and explore unit, integration, end-to-end, performance, and stress tests with test descriptions and expected versus actual values.
Explore side effects in real-world TypeScript unit testing, contrast pure functions with external dependencies, and learn to use mocks and spies to isolate logic during tests.
Explore the properties of good unit tests: automate tests, ensure determinism and repeatability, run fast, and isolate from external side effects for consistent results.
Determine when to unit test in real-world TypeScript apps by focusing on critical modules, like the quiz, and automate tests during releases for reliable results.
Master real-world unit testing by applying one concept at a time, keeping tests small and fast, covering positive and negative cases, with arrange-act-assert, and integrating with continuous integration.
Discover unit testing modes in real-world TypeScript: test client or server code, simulate the DOM with jsdom, and validate React, Vue, or Angular components.
Compare vitest and jest as two popular unit testing frameworks for JavaScript, noting their speed, npm adoption, TypeScript support, and watch mode.
Discover Vitest, a fast, multithreaded TypeScript unit tester powered by esbuild, with smart watch mode, hot reload, snapshot filtering, and built-in code coverage for an improved development experience.
Jest is a JavaScript testing framework designed for JavaScript, supports TypeScript with configuration, works with node and React, offers snapshot testing, and features a simple API similar to Vitest.
Explore how to understand a system before unit testing it. Use UI, block diagrams, sequence diagrams, and source code to grasp the system, its motivation, specification, and the project structure.
Demonstrates a simple TypeScript queue system where users enqueue add and get posts operations, and a scheduler processes the head every two seconds.
Explore a block diagram showing a task queue, scheduler, and dispatcher. See how the scheduler runs every two seconds with start and stop controls and persistence via load and save.
Explore sequence diagram in UML to illustrate interactions among scheduler, task queue, task dispatcher, and persist, showing empty and nonempty queue scenarios and the dispatch callback flow.
This lecture explains the motivation behind a browser extension that automates LinkedIn tasks using a simple task queue and a scheduler that runs at four-minute intervals to avoid bot detection.
Copy TypeScript starter code from the starter to the final directory, then validate a model and the event queue by checking the queue length and any changes.
Copy the starter directory into the final directory to begin working there, and then mark the version and tags within that directory.
Practice unit testing real-world TypeScript by testing modules, objects, and persistence and task queue functions, focusing on public methods like start, stop, and dispatch while avoiding private methods.
Start with unit testing pure logic code to avoid local storage side effects. Use sequence diagram to pick between task dispatcher and task queue, and begin with the task module.
Set up unit tests for a TypeScript task queue, verify the empty queue case, fix a null input bug, and run tests with npm test after creating a test directory.
Demonstrate enqueueing tasks in a TypeScript queue and verify length updates for non-empty states, using an I task interface with action and payload and tests for queue behavior.
Implement a clear function on the global task queue to reset its length, and apply beforeEach to run it before every test, ensuring reliable unit tests and full coverage insights.
Access the source code link provided in the attached resource. Use this code to support real-world TypeScript unit testing.
Explore the grade calculator module with parse CSV and calculate average, and practice unit testing by relocating tests outside the SSC to validate the model functions and uncover a bug.
Practice real-world TypeScript unit testing by importing the calculate average function, writing tests for empty inputs and valid data, and revealing a bug with array equality checks.
Explore code coverage concepts and coverage tests, install and use two popular coverage packages, and assess test coverage for the task queue and other modules.
Evaluate when 100% code coverage is practical and prioritize testing critical models first, balancing time and effort, using Istanbul for coverage in this course.
Install the code coverage tool, run the coverage script, and set Istanbul as the coverage provider across three steps: install, prepare the script, and configure the test.
Invoke unit tests with npm test and view results. Use npm run coverage to measure code coverage and reveal untested lines, then restore tests to return to 100% coverage.
Set up the system, fix the source file, and add tests to achieve 100% coverage in the starter directory, using the docs dictionary file for the coverage test.
Install dependencies, configure coverage with Istanbul, and run tests with vitest to fix a line-number bug and add a not-a-number case, achieving improved coverage.
Explore unit testing for pure logic code by examining a model, analyzing the sequence diagram, and implementing two tests to verify dispatch is okay and dispatch throw, ensuring code coverage.
Analyze diagrams to identify a pure logic module, and choose the task dispatcher for unit testing, since it has no external dependencies.
Explore how a task dispatcher's private action-to-function map routes tasks by action, invoking the matched function with a payload and returning a result object with status and result.
Explore unit testing in real-world TypeScript by validating a dispatch that throws on an empty map, and learn to wrap the code in a function to catch errors.
Validates dispatch throw in TypeScript unit tests when an action is not found in the map, and shows how to insert actions with map.set to test two tasks.
Investigate a dispatch function issue where TypeScript fails to enforce a function's required argument. A map accepts a one-argument function, yet a no-argument function slips through, and tests still pass.
Refactor types by moving interfaces and types to a types directory and import action and payload. Run tests to confirm the dispatch changes remain correct and refactoring keeps code reliable.
Design and validate a dispatch test to confirm that a successful status yields a success result while a failure yields a failure, and identify a bug revealed by the test.
Identify a bug revealed by a unit test, debug with a breakpoint and terminal, trace dispatch behavior, implement a fix to return dispatch function result, and verify the test passes.
Test dispatch result for the add function, ensuring a successful status and the correct 3 result from payloads 1 and 2, using a dispatcher and map.
Invoke the code coverage test, close it, run npm, and confirm 100% code coverage for real world TypeScript unit testing.
Learn to filter tests in real-world TypeScript unit testing by running npm test with path filters to target a module or a single test using the -t option, jest guidance.
Access the source code by following the link in the attached resource at the section end, aligning with real-world TypeScript unit testing insights.
Master real-world TypeScript unit testing with coding exercise 4 - solution by running targeted tests, debugging with breakpoints, and fixing csv parsing to grade display.
Explore how to test code with side effects using mocks. Understand the motivation for mocks and when to use mocks versus other testing approaches, including API for mocks.
Identify side effects as interactions with the external world relative to your unit, including local storage, console, DOM manipulation, IO operations, network fetch, and database updates.
Discover how mocks emulate side effects by replacing external calls with simulated behavior, preventing real file or local storage interactions in unit tests.
Explore how mocks isolate unit tests by replacing dependencies like local storage or external APIs (axios) with simulations, enabling fast, reliable tests even when the outside world is unavailable.
Explore the API for mocks, including Spy On to detect outside calls and simulate return codes, and use mock functions, models, and timers to replace real behavior.
Mock the dome and local storage to test modules with side effects and module interaction in real-world TypeScript unit testing, using jest dome mocks for persist, timer, and task dispatcher.
Explore the difference between solitary (isolated) tests and sociable tests in real-world TypeScript unit testing, contrasting mocks with social tests as a step toward integration.
Learn how to unit test a persist object using jsdom, mocking local storage to verify save and load functionality for tasks in a TypeScript app.
Learn how to test side effects with spyOn in TypeScript unit tests by spying on console.log to verify it is called with correct parameters on save and load operations.
Master unit testing persistence by spying on Storage.prototype to confirm localStorage.getItem is called on load and localStorage.setItem is called on save.
Explore real-world TypeScript unit testing by accessing the source code via the attached resource, enabling hands-on practice with practical examples tied to the course content.
Test side effects in a TypeScript test by spying console.logs for grade in pass csv and average in calculate average on the grade calculator, and compare loose versus strict equality.
Learn real-world ts unit testing by implementing a grade calculator with npm test, logging grades and averages, and validating console output with spies; explore strict equal vs equal in tests.
Explore sociable tests for a task queue that uses persist, comparing mocking persist with local storage emulation to evaluate integration versus isolation, as explained by Martin Fowler.
Explore testing a task queue with isolated mocks when persist is not ready, contrasting sociable and solitary unit tests using a save and load API.
Use mock() to replace persistence load and save and fn() to supply custom implementations in an isolated test for TaskQueue.
Refactor the task queue to a class and add persistence tests for save, load, and clear to ensure new instances load data and cleared queues start empty.
Shows persisting a task queue and testing with and without mocks, using sociable test approaches to verify zero start, enqueue two tasks, dequeue, and persistent clear.
Master isolated (solitary) unit tests by mocking persist and validating enqueue, dequeue, and clear through load and save call assertions.
Prefer sociable tests when you can write a short running test not tied to implementation; if not, use isolated tests to keep unit tests fast.
Explore real-world TypeScript unit testing by reviewing the source code linked in the attached resource.
Install and use a TypeScript abstract logger with dummy and console implementations, spy on logger calls in unit tests, and refactor for dependency injection to flexibly swap loggers.
Learn to use fake timers to mock intervals and dates in TypeScript unit tests. Install and configure the library, and progress time with ticks to test schedulers without real delays.
Learn to test a task scheduler with a fake timer by queuing a task, starting the scheduler, waiting for an interval, and capturing the result via a callback.
Practice finishing the unit test by validating enqueueing two tasks with and without start, confirming callbacks fire on intervals, and ensuring stop prevents further dispatches for 100% code coverage.
Demonstrate unit testing a task scheduler with a mix of isolated and fake timer setups (Sinon JS), highlighting callback use, task queue interactions, and clock-driven events.
Find the source code by following the link in the attached resource, enabling practical exploration of real-world TypeScript unit testing.
Develop unit tests for the create calculate time function by using fake timer to manipulate current time, following exercise seven starter and the updated UI.
Mock time in tests by using fake timers with jest or vitest, set a specific date and time, and verify timing-dependent code through compatible APIs and test setup.
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