The material in this course is intended to go along with the Introduction to Testing course with Frontend Masters.

Testing increases your confidence that your applications will function as expected. This workshop will teach you the fundamentals of testing and give you the foundations to write more testable code in your applications. You’ll set up an efficient testing environment where a test runner is part of your development workflow. You’ll gain practical experience writing unit and integration tests while exploring common testing tools.

Prerequisites

• A fundamental understanding JavaScript
• Familiarity with the command line (e.g just enough to navigate around directories and run a few commands)
• Experience with Node, npm, git, and Github.

The Basics

Here are some topics that we’ll cover while we’re doing some of the hands on activities, but I also wanted to include some content for you to reference later.

• Running Tests
• How Tests Work
• Filtering Tests
• Organizing and Annotating Tests

Additional Reading

In this course, we’re going try to have a bias towards being hands-on and only delve into the philosophical bits when absolutely necessary. I’d prefer we spend our time writing tests rather than talking about writing tests. That said, I do have a bunch of materials on the thinking around best practices in terms of testing and you’re more than welcome to go through them at your leisure.

• The Structure of a Unit Test
• The Types of Tests: Unit, Integration, End-to-End
• Components of a Test: Test Runners and Assertion Libraries
• Assert Versus Expect
• Mocking: Best Practices and Common Pitfalls
• What is Test Driven Development?
• Organizing and Annotating Your Tests
• Strategies for Testing Conditional Logic

Libraries and Tools Used

Throughout this course, we’ll be leveraging the following libraries.

• Vitest
• Testing Library
• Playwright

Even if you use Jest, almost all of the content in this course applies. If you’re curious, you can read more in The Differences Between Jest and Vitest.

Digging Deeper into Vitest

Additionally, I also have some further reading on some more advanced topics that are beyond the scope of this course.

• Advanced Vitest Configuration
• Advanced Debugging in Vitest
• Creating Custom Reporters in Vitest
• Creating Custom Matchers in Vitest
• Test Contexts in Vitest
• Running Tests for Related Files in Vitest