Home

Awesome

Learning react-testing-library

Just one of the things I'm learning. https://github.com/hchiam/learning

react-testing-library focuses on best-practices by testing the DOM and what users with interact with, INSTEAD of React state/props/components, which can change (otherwise use data-testids for robust tests). It works well with jest and is great for unit tests and integration tests, but end-to-end testing may be better left to cypress with @testing-library/cypress.

BTW:

https://github.com/testing-library/react-testing-library

https://testing-library.com/docs/react-testing-library/intro

https://www.youtube.com/watch?v=JKOwJUM4_RM

https://raw.githubusercontent.com/testing-library/react-testing-library/master/other/cheat-sheet.pdf

https://testing-playground.com

From scratch

Using yarn:

yarn add react react-dom
yarn add --dev @testing-library/react @testing-library/jest-dom @babel/preset-react @babel/preset-env babel-jest jest-cli;

Or with npm:

npm install react react-dom
npm install --save-dev @testing-library/react @testing-library/jest-dom @babel/preset-react @babel/preset-env babel-jest jest-cli

And then:

touch babel.config.js # and fill in this file
jest

Starting by testing out this repo

Using yarn: (triple-click to select all)

git clone https://github.com/hchiam/learning-react-testing-library.git && cd learning-react-testing-library && yarn && jest

Or with npm: (triple-click to select all)

git clone https://github.com/hchiam/learning-react-testing-library.git && cd learning-react-testing-library && npm install && jest