React Testing Library and Jest: The Complete Guide

Focused View

Stephen Grider

7:38:51

174 View

1. Dive In - Lets Get Started!

1. How to Get Help.mp4

01:17

2. Start Testing... Now!.mp4

09:05

3. A Few Critical Questions.mp4

05:30

2. A Whirlwind Overview of Testing

1. Project Setup.mp4

02:06

2. Quick Note.html

3. Adding the Form.mp4

04:51

4.1 003 - simple.zip

4. Handling User Input.mp4

03:02

5.1 004 - simple.zip

5. Rendering the List of Users.mp4

05:48

6.1 completed.zip

6. Completed Users Project.html

7.1 005 - simple.zip

7. Our First Test.mp4

08:22

8. Element Query System.mp4

03:14

9. Understanding ARIA Roles.mp4

03:22

10. Understanding Jest Matchers.mp4

03:05

11.1 009 - simple.zip

11. Simulating User Events.mp4

05:59

12.1 010 - simple.zip

12. Recording Function Calls.mp4

07:40

13.1 011 - simple.zip

13. Introducing Mock Functions.mp4

05:19

14.1 012 - simple.zip

14. Querying Elements by Labels.mp4

07:03

15.1 013 - simple.zip

15. Testing the UserList.mp4

05:31

16. Getting Help with Query Functions.mp4

08:12

17.1 015 - simple.zip

17. Query Function Escape Hatches.mp4

06:58

18. Another Query Function Fallback.mp4

06:07

19.1 017 - simple.zip

19. Testing Table Contents.mp4

04:12

20.1 018 - simple.zip

20. Avoiding BeforeEach.mp4

03:13

21.1 019 - simple.zip

21. Testing the Whole App.mp4

06:40

22.1 020 - simple.zip

22. A Touch of Test Driven Development.mp4

05:37

23.1 021 - simple.zip

23. Feature Implementation.mp4

03:11

3. Understanding Element Roles

1. Introducing RTL Book.mp4

02:29

2. A Few Notes on RTL Book.mp4

03:17

3. Partial Role List.mp4

04:08

4.1 004 - roles.zip

4. Finding Elements by Role.mp4

05:32

5.1 005 - roles.zip

5. Finding by Accessible Names.mp4

04:37

6.1 006 - roles.zip

6. Linking Inputs to Labels.mp4

05:02

7. Directly Assigning an Accessible Name.mp4

05:03

8.1 roles-notes-COMPLETE.zip

8. Completed Roles Notebook.html

4. Finding Elements with Query Functions

1.1 001 - queries.zip

1. Deeper into Query Functions.mp4

05:24

2.1 002 - queries.zip

2. GetBy, QueryBy, FindBy.mp4

08:56

3.1 003 - queries.zip

3. More on Single Queries.mp4

06:12

4.1 004 - queries.zip

4. Multiple Element Variations.mp4

03:18

5.1 005 - queries.zip

5. When to use These Queries.mp4

05:56

6. When to use Async Queries.mp4

06:54

7.1 query-notes-COMPLETE.zip

7. Completed Queries Notebook.html

5. Query Function Suffixes

1. Query Criteria.mp4

08:02

2. When to Use Each Suffix.mp4

06:59

3.1 criteria-notes-COMPLETE.zip

3. Completed Criteria Notebook.html

6. Matchers in Jest

1.1 001 - matcher.zip

1. Diving into Matchers.mp4

04:53

2. Introducing Custom Matchers.mp4

03:44

3.1 003 - matcher.zip

3. Implementing a Custom Matcher.mp4

06:58

7. Big Project Overview

1.1 codesplain.zip

1. Required Project Setup.html

2. App Overview and Setup.mp4

05:33

3. The Tech in This Project.mp4

04:21

4. The Path Ahead.mp4

04:59

5. A Process for Debugging.mp4

08:48

6. Understanding Data Flowing Into the Component.mp4

09:52

7.1 006 - app.zip

7. Developing a Test and a Fix.mp4

08:17

8. Looping Over Assertions.mp4

03:40

9.1 008 - app.zip

9. Flexible Queries.mp4

02:22

8. The Mysterious Act Function!

1. Another Bug!.mp4

04:48

2.1 002 - act.zip

2. Analyzing the Data... Again!.mp4

07:21

3.1 003 - act.zip

3. Adding Router Context.mp4

07:07

4. Unexpected State Updates.mp4

04:40

5. Act Included with React Testing Library.mp4

05:53

6. Using Act (Hopefully Not!) with RTL.mp4

02:19

7.1 007 - act.zip

7. Solving the Act Warning.mp4

09:57

8.1 008 - act.zip

8. Module Mocks.mp4

05:06

9.1 009 - act.zip

9. Absolute Last Ditch Act Solution.mp4

03:38

10.1 010 - act.zip

10. Checking the Link Href.mp4

02:46

11.1 011 - act.zip

11. Implementing the Feature.mp4

05:21

12. Checking the Icon.mp4

04:20

13.1 013 - act.zip

13. Checking the Link.mp4

03:17

9. Handling Data Fetching in Tests

1.1 001 - fetch.zip

1. Easy Fix, Hard Test.mp4

05:45

2. Options for Testing Data Fetching.mp4

05:21

3. Using a Request Handler.mp4

02:50

4.1 004 - fetch.zip

4. Initial MSW Setup.mp4

11:56

5.1 005 - fetch.zip

5. Inspecting the Component State.mp4

05:04

6.1 006 - fetch.zip

6. Effective Request Testing.mp4

11:34

7. An Issue with Fake Handlers.mp4

03:50

8.1 008 - fetch.zip

8. Easier Fake Routes - Heres the Goal.mp4

05:10

9.1 009 - fetch.zip

9. Making a Reusable Create Server Function.mp4

07:27

10. Tests Around Authentication

1. Testing Authentication.mp4

03:09

2.1 002 - auth.zip

2. Understanding the Auth API.mp4

06:11

3. Order of Execution.mp4

06:34

4.1 004 - auth.zip

4. Scoping Test Hooks.mp4

04:42

5.1 005 - auth.zip

5. Act Warnings... Again!.mp4

04:48

6.1 006 - auth.zip

6. Assertions Around Auth Links.mp4

04:13

7.1 007 - auth.zip

7. Wait... It Doesnt Work!.mp4

03:46

8.1 008 - auth.zip

8. Limiting Test Execution.mp4

04:22

9.1 009 - auth.zip

9. Using Debuggers in Tests.mp4

04:28

10.1 010 - auth.zip

10. Test Debugging in Action.mp4

08:53

11.1 011 - auth.zip

11. One Last Debugging Hint.mp4

03:51

12. It Is a Caching Issue!.mp4

04:28

13.1 013 - auth.zip

13. Solving the Caching Issue.mp4

03:16

11. Bonus!

1. Bonus!.html

Description

A complete, all-in-one guide to fully testing your React projects using React Testing Library and Jest.

What You'll Learn?

Everything you need to know about testing React Components using React Testing Library and Jest
Understand how to simulate user events and data fetching in a test environment
Verify your components the way your components work - before deploying them!
Get practical, hands-on experience adding tests to a large React project
Explore hidden aspects of testing that aren't covered in any other testing course
Save time by building your own custom Jest matchers
Focus on learning why best practices exist - and when to break them!

Who is this for?

Software engineers looking to better understand the world of testing

More details

Description
Congratulations! You've found the most popular, most complete, and most up-to-date resource online for learning how to test React apps with React Testing Library and Jest!
Thousands of other engineers have learned how to test, and you can too. This course uses a time-tested, battle-proven method to make sure you understand exactly how testing works, and will get you a new job working as a software engineer or help you build that app you've always been dreaming about.
The difference between this course and all the others: you will understand the design patterns used by top companies to test the largest React apps around.
Testing is used to verify your code works as expected. This provides a set of unique benefits to any frontend:
Author smaller, easier to understand codebases
Deploy your code with confidence that it will behave correctly
Test each portion of your app separately - limit the chance of interrupting your users
Allow each of your engineering teams to work independently
Change your codebase without worrying about breaking an existing feature
Testing is a popular topic, but there is a lot of misinformation online. This course has been developed with input from top engineers to ensure total technical accuracy.
----------------------
What will you build?
This course focuses on testing components in a variety of different environments.Â You will begin by writing tests for a small mini-project, just to get some quick initial experience.Â From there, you'll learn about React Testing Library and all of its functionality by building a series of interactive cheatsheets.Â You can use these cheatsheets as a future reference to easily remember the intricacies of testing.Â Finally, you'll add tests to a rather large React app, complete with authentication, data fetching, and navigation.
Here's a partial list of some of the topics you'll cover:
Customize your test environment by writing custom Jest matchers
Learn how to debug your tests by fixing many bugs
Run tests faster by implementing a fake data-fetching process
Understand best practices by working on a large React project
See an exhaustive list of all the functionality packed into React Testing Library
Enhance your element-selecting powers by using the ARIAÂ Role system
Get experience testing authentication and routing
Write more efficient tests by learning dozens of testing shortcuts
Finally understand the most mysterious function in React - the 'act' function!
Learn multiple ways of handling third-party libraries in a test environment
Use Jest to 'mock' functions and libraries
I spent the early years of my software engineering career writing tests non-stop.Â Every single day, I practiced Test Driven Development to write thousands of lines of code while being mentored by top industry engineers.Â Let me share this knowledge with you.Â Testing is one of the topics I am most passionate about, and I want you to get as excited as I am.Â Sign up today and join me!
Who this course is for:
Software engineers looking to better understand the world of testing

User Reviews

Rating

average 0

Total votes0

Focused display

React

Stephen Grider

Instructor's Courses

Stephen Grider has been building complex Javascript front ends for top corporations in the San Francisco Bay Area. With an innate ability to simplify complex topics, Stephen has been mentoring engineers beginning their careers in software development for years, and has now expanded that experience onto Udemy, authoring the highest rated React course. He teaches on Udemy to share the knowledge he has gained with other software engineers. Invest in yourself by learning from Stephen's published courses.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.