From 6388adf7bce33a49711805335b9c6838d87979f8 Mon Sep 17 00:00:00 2001 From: Donavon West Date: Tue, 5 Feb 2019 17:32:40 -0500 Subject: [PATCH 1/4] =?UTF-8?q?feat(testHook):=20add=20testHook=20utility?= =?UTF-8?q?=20for=20Testing=20custom=20hooks=20=F0=9F=8E=A3=20(#274)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .all-contributorsrc | 12 ++++++++ README.md | 35 +++++++++++------------ examples/__tests__/react-hooks.js | 46 +++++++++++++++++++++++++++++++ examples/react-hooks.js | 10 +++++++ package.json | 5 ++-- src/__tests__/testHook.js | 14 ++++++++++ src/index.js | 12 +++++++- typings/index.d.ts | 5 ++++ 8 files changed, 119 insertions(+), 20 deletions(-) create mode 100644 examples/__tests__/react-hooks.js create mode 100644 examples/react-hooks.js create mode 100644 src/__tests__/testHook.js diff --git a/.all-contributorsrc b/.all-contributorsrc index f7e9353d..431ed13e 100644 --- a/.all-contributorsrc +++ b/.all-contributorsrc @@ -615,6 +615,18 @@ "contributions": [ "code" ] + }, + { + "login": "donavon", + "name": "Donavon West", + "avatar_url": "https://avatars3.githubusercontent.com/u/887639?v=4", + "profile": "http://donavon.com", + "contributions": [ + "code", + "doc", + "ideas", + "test" + ] } ] } diff --git a/README.md b/README.md index 7d47c49e..ade2fa8b 100644 --- a/README.md +++ b/README.md @@ -7,11 +7,11 @@

Simple and complete React DOM testing utilities that encourage good testing practices.

-[**Read The Docs**](https://testing-library.com/react) | [Edit the docs](https://github.com/alexkrolick/testing-library-docs) +[**Read The Docs**](https://testing-library.com/react) | +[Edit the docs](https://github.com/alexkrolick/testing-library-docs) -
@@ -20,7 +20,7 @@ [![version][version-badge]][package] [![downloads][downloads-badge]][npmtrends] [![MIT License][license-badge]][license] -[![All Contributors](https://img.shields.io/badge/all_contributors-63-orange.svg?style=flat-square)](#contributors) +[![All Contributors](https://img.shields.io/badge/all_contributors-64-orange.svg?style=flat-square)](#contributors) [![PRs Welcome][prs-badge]][prs] [![Code of Conduct][coc-badge]][coc] [![Join the community on Spectrum][spectrum-badge]][spectrum] @@ -40,8 +40,8 @@ -- [The Problem](#the-problem) -- [This Solution](#this-solution) +- [The problem](#the-problem) +- [This solution](#this-solution) - [Example](#example) - [Installation](#installation) - [Examples](#examples) @@ -76,7 +76,6 @@ primary guiding principle is: > [The more your tests resemble the way your software is used, the more > confidence they can give you.][guiding-principle] - ## Example ```javascript @@ -134,14 +133,13 @@ should be installed as one of your project's `devDependencies`: npm install --save-dev react-testing-library ``` -This library has a `peerDependencies` listing for `react-dom`. +This library has `peerDependencies` listings for `react` and `react-dom`. You may also be interested in installing `jest-dom` so you can use [the custom jest matchers](https://github.com/gnapse/jest-dom#readme). > [**Docs**](https://testing-library.com/docs/react-testing-library/intro) - ## Examples > We're in the process of moving examples to the @@ -154,6 +152,8 @@ Some included are: - [`react-redux`](https://github.com/kentcdodds/react-testing-library/blob/master/examples/__tests__/react-redux.js) - [`react-router`](https://github.com/kentcdodds/react-testing-library/blob/master/examples/__tests__/react-router.js) - [`react-context`](https://github.com/kentcdodds/react-testing-library/blob/master/examples/__tests__/react-context.js) +- [`react-hooks`](https://github.com/kentcdodds/react-testing-library/blob/master/examples/__tests__/react-hooks.js) - + Use react-testing-library to test a custom React Hook. You can also find react-testing-library examples at [react-testing-examples.com](https://react-testing-examples.com/jest-rtl/). @@ -196,16 +196,17 @@ Thanks goes to these people ([emoji key][emojis]): -| [
Kent C. Dodds](https://kentcdodds.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=kentcdodds "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=kentcdodds "Documentation") [πŸš‡](#infra-kentcdodds "Infrastructure (Hosting, Build-Tools, etc)") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=kentcdodds "Tests") | [
Ryan Castner](http://audiolion.github.io)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=audiolion "Documentation") | [
Daniel Sandiego](https://www.dnlsandiego.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=dnlsandiego "Code") | [
PaweΕ‚ MikoΕ‚ajczyk](https://github.com/Miklet)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=Miklet "Code") | [
Alejandro ÑÑñez Ortiz](http://co.linkedin.com/in/alejandronanez/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=alejandronanez "Documentation") | [
Matt Parrish](https://github.com/pbomb)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Apbomb "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=pbomb "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=pbomb "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=pbomb "Tests") | [
Justin Hall](https://github.com/wKovacs64)
[πŸ“¦](#platform-wKovacs64 "Packaging/porting to new platform") | +| [Kent C. Dodds
Kent C. Dodds](https://kentcdodds.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=kentcdodds "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=kentcdodds "Documentation") [πŸš‡](#infra-kentcdodds "Infrastructure (Hosting, Build-Tools, etc)") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=kentcdodds "Tests") | [Ryan Castner
Ryan Castner](http://audiolion.github.io)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=audiolion "Documentation") | [Daniel Sandiego
Daniel Sandiego](https://www.dnlsandiego.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=dnlsandiego "Code") | [PaweΕ‚ MikoΕ‚ajczyk
PaweΕ‚ MikoΕ‚ajczyk](https://github.com/Miklet)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=Miklet "Code") | [Alejandro ÑÑñez Ortiz
Alejandro ÑÑñez Ortiz](http://co.linkedin.com/in/alejandronanez/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=alejandronanez "Documentation") | [Matt Parrish
Matt Parrish](https://github.com/pbomb)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Apbomb "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=pbomb "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=pbomb "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=pbomb "Tests") | [Justin Hall
Justin Hall](https://github.com/wKovacs64)
[πŸ“¦](#platform-wKovacs64 "Packaging/porting to new platform") | | :---: | :---: | :---: | :---: | :---: | :---: | :---: | -| [
Anto Aravinth](https://github.com/antoaravinth)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=antoaravinth "Code") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=antoaravinth "Tests") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=antoaravinth "Documentation") | [
Jonah Moses](https://github.com/JonahMoses)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=JonahMoses "Documentation") | [
Łukasz Gandecki](http://team.thebrain.pro)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=lgandecki "Code") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=lgandecki "Tests") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=lgandecki "Documentation") | [
Ivan Babak](https://sompylasar.github.io)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Asompylasar "Bug reports") [πŸ€”](#ideas-sompylasar "Ideas, Planning, & Feedback") | [
Jesse Day](https://github.com/jday3)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jday3 "Code") | [
Ernesto GarcΓ­a](http://gnapse.github.io)
[πŸ’¬](#question-gnapse "Answering Questions") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=gnapse "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=gnapse "Documentation") | [
Josef Maxx Blake](http://jomaxx.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jomaxx "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=jomaxx "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=jomaxx "Tests") | -| [
Michal Baranowski](https://twitter.com/baranovskim)
[πŸ“](#blog-mbaranovski "Blogposts") [βœ…](#tutorial-mbaranovski "Tutorials") | [
Arthur Puthin](https://github.com/aputhin)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=aputhin "Documentation") | [
Thomas Chia](https://github.com/thchia)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=thchia "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=thchia "Documentation") | [
Thiago Galvani](http://ilegra.com/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=thiagopaiva99 "Documentation") | [
Christian](http://Chriswcs.github.io)
[⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=ChrisWcs "Tests") | [
Alex Krolick](https://alexkrolick.com)
[πŸ’¬](#question-alexkrolick "Answering Questions") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=alexkrolick "Documentation") [πŸ’‘](#example-alexkrolick "Examples") [πŸ€”](#ideas-alexkrolick "Ideas, Planning, & Feedback") | [
Johann Hubert Sonntagbauer](https://github.com/johann-sonntagbauer)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=johann-sonntagbauer "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=johann-sonntagbauer "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=johann-sonntagbauer "Tests") | -| [
Maddi Joyce](http://www.maddijoyce.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=maddijoyce "Code") | [
Ryan Vice](http://www.vicesoftware.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=RyanAtViceSoftware "Documentation") | [
Ian Wilson](https://ianwilson.io)
[πŸ“](#blog-iwilsonq "Blogposts") [βœ…](#tutorial-iwilsonq "Tutorials") | [
Daniel](https://github.com/InExtremaRes)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3AInExtremaRes "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=InExtremaRes "Code") | [
Giorgio Polvara](https://twitter.com/Gpx)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3AGpx "Bug reports") [πŸ€”](#ideas-Gpx "Ideas, Planning, & Feedback") | [
John Gozde](https://github.com/jgoz)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jgoz "Code") | [
Sam Horton](https://twitter.com/SavePointSam)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=SavePointSam "Documentation") [πŸ’‘](#example-SavePointSam "Examples") [πŸ€”](#ideas-SavePointSam "Ideas, Planning, & Feedback") | -| [
Richard Kotze (mobile)](http://www.richardkotze.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=rkotze "Documentation") | [
Brahian E. Soto Mercedes](https://github.com/sotobuild)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=sotobuild "Documentation") | [
Benoit de La Forest](https://github.com/bdelaforest)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=bdelaforest "Documentation") | [
Salah](https://github.com/thesalah)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=thesalah "Code") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=thesalah "Tests") | [
Adam Gordon](http://gordonizer.com)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Aicfantv "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=icfantv "Code") | [
Matija Marohnić](https://silvenon.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=silvenon "Documentation") | [
Justice Mba](https://github.com/Dajust)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=Dajust "Documentation") | -| [
Mark Pollmann](https://markpollmann.com/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=MarkPollmann "Documentation") | [
Ehtesham Kafeel](https://github.com/ehteshamkafeel)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=ehteshamkafeel "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=ehteshamkafeel "Documentation") | [
Julio PavΓ³n](http://jpavon.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jpavon "Code") | [
Duncan L](http://www.duncanleung.com/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=duncanleung "Documentation") [πŸ’‘](#example-duncanleung "Examples") | [
Tiago Almeida](https://www.linkedin.com/in/tyagow/?locale=en_US)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=tyagow "Documentation") | [
Robert Smith](http://rbrtsmith.com/)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Arbrtsmith "Bug reports") | [
Zach Green](https://offbyone.tech)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=zgreen "Documentation") | -| [
dadamssg](https://github.com/dadamssg)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=dadamssg "Documentation") | [
Yazan Aabed](https://www.yaabed.com/)
[πŸ“](#blog-YazanAabeed "Blogposts") | [
Tim](https://github.com/timbonicus)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Atimbonicus "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=timbonicus "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=timbonicus "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=timbonicus "Tests") | [
Divyanshu Maithani](http://divyanshu.xyz)
[βœ…](#tutorial-divyanshu013 "Tutorials") [πŸ“Ή](#video-divyanshu013 "Videos") | [
Deepak Grover](https://www.linkedin.com/in/metagrover)
[βœ…](#tutorial-metagrover "Tutorials") [πŸ“Ή](#video-metagrover "Videos") | [
Eyal Cohen](https://github.com/eyalcohen4)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=eyalcohen4 "Documentation") | [
Peter Makowski](https://github.com/petermakowski)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=petermakowski "Documentation") | -| [
Michiel Nuyts](https://github.com/Michielnuyts)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=Michielnuyts "Documentation") | [
Joe Ng'ethe](https://github.com/joeynimu)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=joeynimu "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=joeynimu "Documentation") | [
Kate](https://github.com/Enikol)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=Enikol "Documentation") | [
Sean](http://www.seanrparker.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=SeanRParker "Documentation") | [
James Long](http://jlongster.com)
[πŸ€”](#ideas-jlongster "Ideas, Planning, & Feedback") [πŸ“¦](#platform-jlongster "Packaging/porting to new platform") | [
Herb Hagely](https://github.com/hhagely)
[πŸ’‘](#example-hhagely "Examples") | [
Alex Wendte](http://www.wendtedesigns.com/)
[πŸ’‘](#example-themostcolm "Examples") | -| [
Monica Powell](http://www.aboutmonica.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=M0nica "Documentation") | [
Vitaly Sivkov](http://sivkoff.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=sivkoff "Code") | [
Weyert de Boer](https://github.com/weyert)
[πŸ€”](#ideas-weyert "Ideas, Planning, & Feedback") [πŸ‘€](#review-weyert "Reviewed Pull Requests") | [
EstebanMarin](https://github.com/EstebanMarin)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=EstebanMarin "Documentation") | [
Victor Martins](https://github.com/vctormb)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=vctormb "Documentation") | [
Royston Shufflebotham](https://github.com/RoystonS)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3ARoystonS "Bug reports") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=RoystonS "Documentation") [πŸ’‘](#example-RoystonS "Examples") | [
chrbala](https://github.com/chrbala)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=chrbala "Code") | +| [Anto Aravinth
Anto Aravinth](https://github.com/antoaravinth)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=antoaravinth "Code") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=antoaravinth "Tests") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=antoaravinth "Documentation") | [Jonah Moses
Jonah Moses](https://github.com/JonahMoses)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=JonahMoses "Documentation") | [Łukasz Gandecki
Łukasz Gandecki](http://team.thebrain.pro)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=lgandecki "Code") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=lgandecki "Tests") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=lgandecki "Documentation") | [Ivan Babak
Ivan Babak](https://sompylasar.github.io)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Asompylasar "Bug reports") [πŸ€”](#ideas-sompylasar "Ideas, Planning, & Feedback") | [Jesse Day
Jesse Day](https://github.com/jday3)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jday3 "Code") | [Ernesto GarcΓ­a
Ernesto GarcΓ­a](http://gnapse.github.io)
[πŸ’¬](#question-gnapse "Answering Questions") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=gnapse "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=gnapse "Documentation") | [Josef Maxx Blake
Josef Maxx Blake](http://jomaxx.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jomaxx "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=jomaxx "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=jomaxx "Tests") | +| [Michal Baranowski
Michal Baranowski](https://twitter.com/baranovskim)
[πŸ“](#blog-mbaranovski "Blogposts") [βœ…](#tutorial-mbaranovski "Tutorials") | [Arthur Puthin
Arthur Puthin](https://github.com/aputhin)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=aputhin "Documentation") | [Thomas Chia
Thomas Chia](https://github.com/thchia)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=thchia "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=thchia "Documentation") | [Thiago Galvani
Thiago Galvani](http://ilegra.com/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=thiagopaiva99 "Documentation") | [Christian
Christian](http://Chriswcs.github.io)
[⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=ChrisWcs "Tests") | [Alex Krolick
Alex Krolick](https://alexkrolick.com)
[πŸ’¬](#question-alexkrolick "Answering Questions") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=alexkrolick "Documentation") [πŸ’‘](#example-alexkrolick "Examples") [πŸ€”](#ideas-alexkrolick "Ideas, Planning, & Feedback") | [Johann Hubert Sonntagbauer
Johann Hubert Sonntagbauer](https://github.com/johann-sonntagbauer)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=johann-sonntagbauer "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=johann-sonntagbauer "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=johann-sonntagbauer "Tests") | +| [Maddi Joyce
Maddi Joyce](http://www.maddijoyce.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=maddijoyce "Code") | [Ryan Vice
Ryan Vice](http://www.vicesoftware.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=RyanAtViceSoftware "Documentation") | [Ian Wilson
Ian Wilson](https://ianwilson.io)
[πŸ“](#blog-iwilsonq "Blogposts") [βœ…](#tutorial-iwilsonq "Tutorials") | [Daniel
Daniel](https://github.com/InExtremaRes)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3AInExtremaRes "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=InExtremaRes "Code") | [Giorgio Polvara
Giorgio Polvara](https://twitter.com/Gpx)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3AGpx "Bug reports") [πŸ€”](#ideas-Gpx "Ideas, Planning, & Feedback") | [John Gozde
John Gozde](https://github.com/jgoz)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jgoz "Code") | [Sam Horton
Sam Horton](https://twitter.com/SavePointSam)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=SavePointSam "Documentation") [πŸ’‘](#example-SavePointSam "Examples") [πŸ€”](#ideas-SavePointSam "Ideas, Planning, & Feedback") | +| [Richard Kotze (mobile)
Richard Kotze (mobile)](http://www.richardkotze.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=rkotze "Documentation") | [Brahian E. Soto Mercedes
Brahian E. Soto Mercedes](https://github.com/sotobuild)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=sotobuild "Documentation") | [Benoit de La Forest
Benoit de La Forest](https://github.com/bdelaforest)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=bdelaforest "Documentation") | [Salah
Salah](https://github.com/thesalah)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=thesalah "Code") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=thesalah "Tests") | [Adam Gordon
Adam Gordon](http://gordonizer.com)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Aicfantv "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=icfantv "Code") | [Matija MarohniΔ‡
Matija Marohnić](https://silvenon.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=silvenon "Documentation") | [Justice Mba
Justice Mba](https://github.com/Dajust)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=Dajust "Documentation") | +| [Mark Pollmann
Mark Pollmann](https://markpollmann.com/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=MarkPollmann "Documentation") | [Ehtesham Kafeel
Ehtesham Kafeel](https://github.com/ehteshamkafeel)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=ehteshamkafeel "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=ehteshamkafeel "Documentation") | [Julio PavΓ³n
Julio PavΓ³n](http://jpavon.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=jpavon "Code") | [Duncan L
Duncan L](http://www.duncanleung.com/)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=duncanleung "Documentation") [πŸ’‘](#example-duncanleung "Examples") | [Tiago Almeida
Tiago Almeida](https://www.linkedin.com/in/tyagow/?locale=en_US)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=tyagow "Documentation") | [Robert Smith
Robert Smith](http://rbrtsmith.com/)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Arbrtsmith "Bug reports") | [Zach Green
Zach Green](https://offbyone.tech)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=zgreen "Documentation") | +| [dadamssg
dadamssg](https://github.com/dadamssg)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=dadamssg "Documentation") | [Yazan Aabed
Yazan Aabed](https://www.yaabed.com/)
[πŸ“](#blog-YazanAabeed "Blogposts") | [Tim
Tim](https://github.com/timbonicus)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3Atimbonicus "Bug reports") [πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=timbonicus "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=timbonicus "Documentation") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=timbonicus "Tests") | [Divyanshu Maithani
Divyanshu Maithani](http://divyanshu.xyz)
[βœ…](#tutorial-divyanshu013 "Tutorials") [πŸ“Ή](#video-divyanshu013 "Videos") | [Deepak Grover
Deepak Grover](https://www.linkedin.com/in/metagrover)
[βœ…](#tutorial-metagrover "Tutorials") [πŸ“Ή](#video-metagrover "Videos") | [Eyal Cohen
Eyal Cohen](https://github.com/eyalcohen4)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=eyalcohen4 "Documentation") | [Peter Makowski
Peter Makowski](https://github.com/petermakowski)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=petermakowski "Documentation") | +| [Michiel Nuyts
Michiel Nuyts](https://github.com/Michielnuyts)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=Michielnuyts "Documentation") | [Joe Ng'ethe
Joe Ng'ethe](https://github.com/joeynimu)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=joeynimu "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=joeynimu "Documentation") | [Kate
Kate](https://github.com/Enikol)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=Enikol "Documentation") | [Sean
Sean](http://www.seanrparker.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=SeanRParker "Documentation") | [James Long
James Long](http://jlongster.com)
[πŸ€”](#ideas-jlongster "Ideas, Planning, & Feedback") [πŸ“¦](#platform-jlongster "Packaging/porting to new platform") | [Herb Hagely
Herb Hagely](https://github.com/hhagely)
[πŸ’‘](#example-hhagely "Examples") | [Alex Wendte
Alex Wendte](http://www.wendtedesigns.com/)
[πŸ’‘](#example-themostcolm "Examples") | +| [Monica Powell
Monica Powell](http://www.aboutmonica.com)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=M0nica "Documentation") | [Vitaly Sivkov
Vitaly Sivkov](http://sivkoff.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=sivkoff "Code") | [Weyert de Boer
Weyert de Boer](https://github.com/weyert)
[πŸ€”](#ideas-weyert "Ideas, Planning, & Feedback") [πŸ‘€](#review-weyert "Reviewed Pull Requests") | [EstebanMarin
EstebanMarin](https://github.com/EstebanMarin)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=EstebanMarin "Documentation") | [Victor Martins
Victor Martins](https://github.com/vctormb)
[πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=vctormb "Documentation") | [Royston Shufflebotham
Royston Shufflebotham](https://github.com/RoystonS)
[πŸ›](https://github.com/kentcdodds/react-testing-library/issues?q=author%3ARoystonS "Bug reports") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=RoystonS "Documentation") [πŸ’‘](#example-RoystonS "Examples") | [chrbala
chrbala](https://github.com/chrbala)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=chrbala "Code") | +| [Donavon West
Donavon West](http://donavon.com)
[πŸ’»](https://github.com/kentcdodds/react-testing-library/commits?author=donavon "Code") [πŸ“–](https://github.com/kentcdodds/react-testing-library/commits?author=donavon "Documentation") [πŸ€”](#ideas-donavon "Ideas, Planning, & Feedback") [⚠️](https://github.com/kentcdodds/react-testing-library/commits?author=donavon "Tests") | diff --git a/examples/__tests__/react-hooks.js b/examples/__tests__/react-hooks.js new file mode 100644 index 00000000..3dd13b48 --- /dev/null +++ b/examples/__tests__/react-hooks.js @@ -0,0 +1,46 @@ +import {testHook, cleanup} from 'react-testing-library' + +import useCounter from '../react-hooks' + +afterEach(cleanup) + +test('accepts default initial values', () => { + let count + testHook(() => ({count} = useCounter())) + + expect(count).toBe(0) +}) + +test('accepts a default initial value for `count`', () => { + let count + testHook(() => ({count} = useCounter({}))) + + expect(count).toBe(0) +}) + +test('provides an `increment` function', () => { + let count, increment + testHook(() => ({count, increment} = useCounter({step: 2}))) + + expect(count).toBe(0) + increment() + expect(count).toBe(2) +}) + +test('provides an `decrement` function', () => { + let count, decrement + testHook(() => ({count, decrement} = useCounter({step: 2}))) + + expect(count).toBe(0) + decrement() + expect(count).toBe(-2) +}) + +test('accepts a default initial value for `step`', () => { + let count, increment + testHook(() => ({count, increment} = useCounter({}))) + + expect(count).toBe(0) + increment() + expect(count).toBe(1) +}) diff --git a/examples/react-hooks.js b/examples/react-hooks.js new file mode 100644 index 00000000..fad0de4c --- /dev/null +++ b/examples/react-hooks.js @@ -0,0 +1,10 @@ +import {useState} from 'react' + +function useCounter({initialCount = 0, step = 1} = {}) { + const [count, setCount] = useState(initialCount) + const increment = () => setCount(c => c + step) + const decrement = () => setCount(c => c - step) + return {count, increment, decrement} +} + +export default useCounter diff --git a/package.json b/package.json index 919f0a36..3bb7c531 100644 --- a/package.json +++ b/package.json @@ -48,8 +48,8 @@ "jest-dom": "^2.0.4", "jest-in-case": "^1.0.2", "kcd-scripts": "^0.44.0", - "react": "^16.5.2", - "react-dom": "^16.5.2", + "react": "16.8.0", + "react-dom": "16.8.0", "react-redux": "^5.0.7", "react-router": "^4.3.1", "react-router-dom": "^4.3.1", @@ -57,6 +57,7 @@ "redux": "^4.0.0" }, "peerDependencies": { + "react": "*", "react-dom": "*" }, "eslintConfig": { diff --git a/src/__tests__/testHook.js b/src/__tests__/testHook.js new file mode 100644 index 00000000..f6bce9bd --- /dev/null +++ b/src/__tests__/testHook.js @@ -0,0 +1,14 @@ +import {useState} from 'react' +import 'jest-dom/extend-expect' +import {testHook, cleanup} from '../' + +afterEach(cleanup) + +test('testHook calls the callback', () => { + const spy = jest.fn() + testHook(spy) + expect(spy).toHaveBeenCalledTimes(1) +}) +test('confirm we can safely call a React Hook from within the callback', () => { + testHook(() => useState()) +}) diff --git a/src/index.js b/src/index.js index 2f48a4e0..24b982ac 100644 --- a/src/index.js +++ b/src/index.js @@ -1,3 +1,4 @@ +import React from 'react' import ReactDOM from 'react-dom' import {getQueriesForElement, prettyDOM, fireEvent} from 'dom-testing-library' @@ -51,6 +52,15 @@ function render( } } +function TestHook({callback}) { + callback() + return null +} + +function testHook(callback) { + render() +} + function cleanup() { mountedContainers.forEach(cleanupAtContainer) } @@ -92,6 +102,6 @@ fireEvent.select = (node, init) => { // just re-export everything from dom-testing-library export * from 'dom-testing-library' -export {render, cleanup, flushEffects} +export {render, testHook, cleanup, flushEffects} /* eslint func-name-matching:0 */ diff --git a/typings/index.d.ts b/typings/index.d.ts index aa01da17..ce6408f3 100644 --- a/typings/index.d.ts +++ b/typings/index.d.ts @@ -40,6 +40,11 @@ export function render( options: RenderOptions, ): RenderResult +/** + * Renders a test component that calls back to the test. + */ +export function testHook(callback: () => void): void + /** * Unmounts React trees that were mounted with render. */ From 373294df67818535ad2d516c3c93cd2b87bbddb0 Mon Sep 17 00:00:00 2001 From: "Kent C. Dodds" Date: Wed, 6 Feb 2019 08:35:36 -0700 Subject: [PATCH 2/4] feat(act): Support ReactDOM.TestUtils.act (#278) This also removes `flushEffects` which is no longer necessary! --- README.md | 22 ++++++++--- package.json | 4 +- src/__tests__/act.js | 42 ++++++++++++++++++++ src/__tests__/no-act.js | 10 +++++ src/__tests__/render.js | 9 +---- src/__tests__/{testHook.js => test-hook.js} | 0 src/act-compat.js | 12 ++++++ src/index.js | 44 +++++++++++++++++---- typings/index.d.ts | 6 ++- 9 files changed, 123 insertions(+), 26 deletions(-) create mode 100644 src/__tests__/act.js create mode 100644 src/__tests__/no-act.js rename src/__tests__/{testHook.js => test-hook.js} (100%) create mode 100644 src/act-compat.js diff --git a/README.md b/README.md index ade2fa8b..4428ad81 100644 --- a/README.md +++ b/README.md @@ -2,10 +2,16 @@

react-testing-library

-goat + goat -

Simple and complete React DOM testing utilities that encourage good testing practices.

+

Simple and complete React DOM testing utilities that encourage good testing +practices.

[**Read The Docs**](https://testing-library.com/react) | [Edit the docs](https://github.com/alexkrolick/testing-library-docs) @@ -30,9 +36,13 @@ ## Table of Contents @@ -102,7 +112,7 @@ test('Fetch makes an API call and displays the greeting when load-greeting is cl ) // Act - fireEvent.click(getByText('Load Greeting')) + fireEvent.click(getByText(/load greeting/i)) // Let's wait until our mocked `get` request promise resolves and // the component calls setState and re-renders. diff --git a/package.json b/package.json index 3bb7c531..78091217 100644 --- a/package.json +++ b/package.json @@ -48,8 +48,8 @@ "jest-dom": "^2.0.4", "jest-in-case": "^1.0.2", "kcd-scripts": "^0.44.0", - "react": "16.8.0", - "react-dom": "16.8.0", + "react": "^16.8.0", + "react-dom": "^16.8.0", "react-redux": "^5.0.7", "react-router": "^4.3.1", "react-router-dom": "^4.3.1", diff --git a/src/__tests__/act.js b/src/__tests__/act.js new file mode 100644 index 00000000..49729f3b --- /dev/null +++ b/src/__tests__/act.js @@ -0,0 +1,42 @@ +import 'jest-dom/extend-expect' +import React from 'react' +import {render, cleanup, fireEvent} from '../' + +afterEach(cleanup) + +test('render calls useEffect immediately', () => { + const effectCb = jest.fn() + function MyUselessComponent() { + React.useEffect(effectCb) + return null + } + render() + expect(effectCb).toHaveBeenCalledTimes(1) +}) + +test('fireEvent triggers useEffect calls', () => { + const effectCb = jest.fn() + function Counter() { + React.useEffect(effectCb) + const [count, setCount] = React.useState(0) + return + } + const { + container: {firstChild: buttonNode}, + } = render() + + effectCb.mockClear() + fireEvent.click(buttonNode) + expect(buttonNode).toHaveTextContent('1') + expect(effectCb).toHaveBeenCalledTimes(1) +}) + +test('calls to hydrate will run useEffects', () => { + const effectCb = jest.fn() + function MyUselessComponent() { + React.useEffect(effectCb) + return null + } + render(, {hydrate: true}) + expect(effectCb).toHaveBeenCalledTimes(1) +}) diff --git a/src/__tests__/no-act.js b/src/__tests__/no-act.js new file mode 100644 index 00000000..07ee091d --- /dev/null +++ b/src/__tests__/no-act.js @@ -0,0 +1,10 @@ +import {act} from '..' + +jest.mock('react-dom/test-utils', () => ({})) + +test('act works even when there is no act from test utils', () => { + const callback = jest.fn() + act(callback) + expect(callback).toHaveBeenCalledTimes(1) + expect(callback).toHaveBeenCalledWith(/* nothing */) +}) diff --git a/src/__tests__/render.js b/src/__tests__/render.js index f2ec2351..5ee0dc6f 100644 --- a/src/__tests__/render.js +++ b/src/__tests__/render.js @@ -1,7 +1,7 @@ import 'jest-dom/extend-expect' import React from 'react' import ReactDOM from 'react-dom' -import {render, cleanup, flushEffects} from '../' +import {render, cleanup} from '../' afterEach(cleanup) @@ -90,10 +90,3 @@ it('supports fragments', () => { cleanup() expect(document.body.innerHTML).toBe('') }) - -test('flushEffects can be called without causing issues', () => { - render(
) - const preHtml = document.documentElement.innerHTML - flushEffects() - expect(document.documentElement.innerHTML).toBe(preHtml) -}) diff --git a/src/__tests__/testHook.js b/src/__tests__/test-hook.js similarity index 100% rename from src/__tests__/testHook.js rename to src/__tests__/test-hook.js diff --git a/src/act-compat.js b/src/act-compat.js new file mode 100644 index 00000000..65f85971 --- /dev/null +++ b/src/act-compat.js @@ -0,0 +1,12 @@ +import {act as reactAct} from 'react-dom/test-utils' + +// act is supported react-dom@16.8.0 +// and is only needed for versions higher than that +// so we do nothing for versions that don't support act. +const act = reactAct || (cb => cb()) + +function rtlAct(...args) { + return act(...args) +} + +export default rtlAct diff --git a/src/index.js b/src/index.js index 24b982ac..0f4c7d47 100644 --- a/src/index.js +++ b/src/index.js @@ -1,6 +1,11 @@ import React from 'react' import ReactDOM from 'react-dom' -import {getQueriesForElement, prettyDOM, fireEvent} from 'dom-testing-library' +import { + getQueriesForElement, + prettyDOM, + fireEvent as dtlFireEvent, +} from 'dom-testing-library' +import act from './act-compat' const mountedContainers = new Set() @@ -21,9 +26,13 @@ function render( mountedContainers.add(container) if (hydrate) { - ReactDOM.hydrate(ui, container) + act(() => { + ReactDOM.hydrate(ui, container) + }) } else { - ReactDOM.render(ui, container) + act(() => { + ReactDOM.render(ui, container) + }) } return { container, @@ -65,10 +74,6 @@ function cleanup() { mountedContainers.forEach(cleanupAtContainer) } -function flushEffects() { - ReactDOM.render(null, document.createElement('div')) -} - // maybe one day we'll expose this (perhaps even as a utility returned by render). // but let's wait until someone asks for it. function cleanupAtContainer(container) { @@ -79,6 +84,29 @@ function cleanupAtContainer(container) { mountedContainers.delete(container) } +// react-testing-library's version of fireEvent will call +// dom-testing-library's version of fireEvent wrapped inside +// an "act" call so that after all event callbacks have been +// been called, the resulting useEffect callbacks will also +// be called. +function fireEvent(...args) { + let returnValue + act(() => { + returnValue = dtlFireEvent(...args) + }) + return returnValue +} + +Object.keys(dtlFireEvent).forEach(key => { + fireEvent[key] = (...args) => { + let returnValue + act(() => { + returnValue = dtlFireEvent[key](...args) + }) + return returnValue + } +}) + // React event system tracks native mouseOver/mouseOut events for // running onMouseEnter/onMouseLeave handlers // @link https://github.com/facebook/react/blob/b87aabdfe1b7461e7331abb3601d9e6bb27544bc/packages/react-dom/src/events/EnterLeaveEventPlugin.js#L24-L31 @@ -102,6 +130,6 @@ fireEvent.select = (node, init) => { // just re-export everything from dom-testing-library export * from 'dom-testing-library' -export {render, testHook, cleanup, flushEffects} +export {render, testHook, cleanup, fireEvent, act} /* eslint func-name-matching:0 */ diff --git a/typings/index.d.ts b/typings/index.d.ts index ce6408f3..c87c817c 100644 --- a/typings/index.d.ts +++ b/typings/index.d.ts @@ -51,6 +51,8 @@ export function testHook(callback: () => void): void export function cleanup(): void /** - * Forces React's `useEffect` hook to run synchronously. + * Simply calls ReactDOMTestUtils.act(cb) + * If that's not available (older version of react) then it + * simply calls the given callback immediately */ -export function flushEffects(): void +export function act(callback: () => void): void From f91faa9db55bf1f528bbe9a1321fa23c763cb44f Mon Sep 17 00:00:00 2001 From: "Kent C. Dodds" Date: Wed, 6 Feb 2019 08:37:46 -0700 Subject: [PATCH 3/4] docs: add comment to react-hooks example --- examples/__tests__/react-hooks.js | 6 ++++++ 1 file changed, 6 insertions(+) diff --git a/examples/__tests__/react-hooks.js b/examples/__tests__/react-hooks.js index 3dd13b48..353c902a 100644 --- a/examples/__tests__/react-hooks.js +++ b/examples/__tests__/react-hooks.js @@ -1,3 +1,9 @@ +/* + * This is the recommended way to test reusable custom react hooks. + * It is not however recommended to use the testHook utility to test + * single-use custom hooks. Typically those are better tested by testing + * the component that is using it. + */ import {testHook, cleanup} from 'react-testing-library' import useCounter from '../react-hooks' From d1edba8d60587dfebda52e3e9e79294edebd4eb5 Mon Sep 17 00:00:00 2001 From: "Kent C. Dodds" Date: Wed, 6 Feb 2019 08:52:58 -0700 Subject: [PATCH 4/4] test: fix test coverage and testHook tests Sorry @donavon, this is the best we can do I think :-( --- examples/__tests__/react-hooks.js | 14 ++++++++++---- src/__tests__/events.js | 15 +++++++++++++++ 2 files changed, 25 insertions(+), 4 deletions(-) diff --git a/examples/__tests__/react-hooks.js b/examples/__tests__/react-hooks.js index 353c902a..5e001a37 100644 --- a/examples/__tests__/react-hooks.js +++ b/examples/__tests__/react-hooks.js @@ -4,7 +4,7 @@ * single-use custom hooks. Typically those are better tested by testing * the component that is using it. */ -import {testHook, cleanup} from 'react-testing-library' +import {testHook, act, cleanup} from 'react-testing-library' import useCounter from '../react-hooks' @@ -29,7 +29,9 @@ test('provides an `increment` function', () => { testHook(() => ({count, increment} = useCounter({step: 2}))) expect(count).toBe(0) - increment() + act(() => { + increment() + }) expect(count).toBe(2) }) @@ -38,7 +40,9 @@ test('provides an `decrement` function', () => { testHook(() => ({count, decrement} = useCounter({step: 2}))) expect(count).toBe(0) - decrement() + act(() => { + decrement() + }) expect(count).toBe(-2) }) @@ -47,6 +51,8 @@ test('accepts a default initial value for `step`', () => { testHook(() => ({count, increment} = useCounter({}))) expect(count).toBe(0) - increment() + act(() => { + increment() + }) expect(count).toBe(1) }) diff --git a/src/__tests__/events.js b/src/__tests__/events.js index b8dd487b..c091a366 100644 --- a/src/__tests__/events.js +++ b/src/__tests__/events.js @@ -163,3 +163,18 @@ test('onChange works', () => { fireEvent.change(input, {target: {value: 'a'}}) expect(handleChange).toHaveBeenCalledTimes(1) }) + +test('calling `fireEvent` directly works too', () => { + const handleEvent = jest.fn() + const { + container: {firstChild: button}, + } = render(