Confident React ⚛️

...with react-testing-library

Kent C. Dodds

Utah

wife, 4 kids, & a dog

PayPal, Inc.

Please Stand...

if you are able ❤️ ♿️

What this talk is

  • Discussion how to test web applications (React) effectively
  • A bit of a pitch for a testing library that enables more maintainable tests

What this talk is not

  • Discussion of functional/E2E testing
  • Boring? Hopefully it's not boring...

Let's
Get
STARTED!

Why do we test our software?

CONFIDENCE

What tests give the MOST confidence?

The more your tests resemble the way your software is used, the more confidence they can give you.

What tests give the MOST confidence?

Manual!!!

Well... not really...

How do we overcome human shortcomings?

Automation!

... that automates what the manual tester would do. Because:

The more your tests resemble the way your software is used, the more confidence they can give you.

How would you manually test this?

The State of the Art

jsdom

Jest

enzyme

Introducing:

render

fireEvent

cleanup

wait

waitForElement

render

  • container
  • rerender
  • unmount
  • getByLabelText
  • getByPlaceholderText
  • getByAltText
  • getByText
  • getByTestId

Thank you!

Confident React

By Kent C. Dodds

Confident React

We want to make sure that when we ship new code, our users can use the application. The best way we've found to do that is to write automated tests that run before we deploy a new version of the app. But if our tests aren't doing exactly what the user will do, then how do we really know that things will work when users interact with our apps? Let's rethink what it means to ship applications with confidence and what it takes to get there. With improved tools and practices, we can be more certain that what we're shipping to our users will work the way it's intended.

  • 1,928
Loading comments...

More from Kent C. Dodds