|
26 | 26 |
|
27 | 27 | ## The problem
|
28 | 28 |
|
29 |
| -You want to write maintainable tests for your React components. However, the |
30 |
| -de facto standard for testing ([enzyme](https://github.com/airbnb/enzyme)) is |
31 |
| -bloated with complexity and features, most of which encourage poor testing |
32 |
| -practices (mostly relating to testing implementation details). |
| 29 | +You want to write maintainable tests for your React components. As a part of |
| 30 | +this goal, you want your tests to avoid including implementation details of |
| 31 | +your components and rather focus on making your tests give you the confidence |
| 32 | +for which they are intended. As part of this, you want your testbase to be |
| 33 | +maintainable in the long run so refactors of you components (changes to |
| 34 | +implementation but not functionality) don't break your tests and slow you and |
| 35 | +your team down. |
33 | 36 |
|
34 | 37 | ## This solution
|
35 | 38 |
|
36 | 39 | The `react-testing-library` is a very light-weight solution for testing React
|
37 | 40 | components. It provides light utility functions on top of `react-dom` and
|
38 | 41 | `react-dom/test-utils`, in a way that encourages better testing practices.
|
| 42 | +It's primary guiding principle is: |
| 43 | + |
| 44 | +> [The more your tests resemble the way your software is used, the more confidence they can give you.][guiding-principle] |
| 45 | +
|
| 46 | +So rather than dealing with instances of rendered react components, your tests |
| 47 | +will work with actual DOM nodes. The utilities this library provides facilitate |
| 48 | +querying the DOM in the same way the user would. Finding for elements by their |
| 49 | +label text (just like a user would), finding links and buttons from their text |
| 50 | +(like a user would). It also exposes a recommended way to find elements by a |
| 51 | +`data-testid` as an "escape hatch" for elements where the text content and label |
| 52 | +do not make sense or is not practical. |
| 53 | + |
| 54 | +This library encourages your applications to be more accessible and allows you |
| 55 | +to get your tests closer to using your components the way a user will, which |
| 56 | +allows your tests to give you more confidence that your application will work |
| 57 | +when a real user uses it. |
| 58 | + |
| 59 | +This library is a replacement for [enzyme](http://airbnb.io/enzyme/). While you |
| 60 | +_can_ follow these guidlines using enzyme itself, enforcing this is harder |
| 61 | +because of all the extra utilities that enzyme provides (utilities which |
| 62 | +facilitate testing implementation details). Read more about this in |
| 63 | +[the FAQ](#faq) below. |
| 64 | + |
| 65 | +**What this library is not**: |
| 66 | + |
| 67 | +1. A test runner or framework |
| 68 | +2. Specific to a testing framework (though we recommend Jest as our |
| 69 | + preference, the library works with any framework) |
39 | 70 |
|
40 | 71 | ## Table of Contents
|
41 | 72 |
|
|
0 commit comments