What is “Testing”?
Manual Testing Automated Testing
Write Code <> Preview & Test
Code that tests your code
in Browser
Very important: You see what You test the individual building
your users will see blocks of your app
Error-prone: It’s hard to test all
Very technical but allows you to
possible combinations and
test ALL building blocks at once
scenarios
Different Kinds Of Automated Tests
Unit Tests Integration Tests End-to-End (e2e) Tests
Test the individual Test complete scenarios in
Test the combination of
building blocks (functions, your app as the user
multiple building blocks
components) in isolation would experience them
Projects typically contain
Projects typically contain a Projects typically contain
dozens or hundreds of unit
couple of integration tests only a few e2e tests
tests
The most common / Also important, but focus Important but can also be
important kind of test on unit tests in most cases done manually (partially)
What To Test
What? How?
Test success and error cases, also
Test the different building blocks
test rare (but possible) results
Unit Tests: The smallest building
blocks that make up your app
Required Tools & Setup
We need a tool for running our tests and We need a tool for “simulating” (rendering)
asserting the results our React app / components
Jest React Testing Library
Both tools are already set up for you when using create-react-app
Writing Tests – The Three “A”s
Arrange Set up the test data, test conditions and test environment
Act Run logic that should be tested (e.g. execute function)
Assert Compare execution results with expected results
