r
/
angularjs-testing-library
mirror of https://git.sr.ht/~statianzo/angularjs-testing-library
1
0
Fork 0
Code Issues Projects Releases Wiki Activity

feat: initial release

Browse Source 
fork testing-library/react
ts
Kent C. Dodds 6 years ago committed by Jason Staten
commit 35ff36dcd7
48 changed files with 3504 additions and 0 deletions
Show Stats Download Patch File Download Diff File

995
.all-contributorsrc
Unescape View File

@ -0,0 +1,995 @@
{
"projectName": "react-testing-library",
"projectOwner": "testing-library",
"repoType": "github",
"files": [
"README.md"
],
"imageSize": 100,
"commit": false,
"contributors": [
{
"login": "kentcdodds",
"name": "Kent C. Dodds",
"avatar_url": "https://avatars.githubusercontent.com/u/1500684?v=3",
"profile": "https://kentcdodds.com",
"contributions": [
"code",
"doc",
"infra",
"test"
]
},
{
"login": "audiolion",
"name": "Ryan Castner",
"avatar_url": "https://avatars1.githubusercontent.com/u/2430381?v=4",
"profile": "http://audiolion.github.io",
"contributions": [
"doc"
]
},
{
"login": "dnlsandiego",
"name": "Daniel Sandiego",
"avatar_url": "https://avatars0.githubusercontent.com/u/8008023?v=4",
"profile": "https://www.dnlsandiego.com",
"contributions": [
"code"
]
},
{
"login": "Miklet",
"name": "Paweł Mikołajczyk",
"avatar_url": "https://avatars2.githubusercontent.com/u/12592677?v=4",
"profile": "https://github.com/Miklet",
"contributions": [
"code"
]
},
{
"login": "alejandronanez",
"name": "Alejandro Ñáñez Ortiz",
"avatar_url": "https://avatars3.githubusercontent.com/u/464978?v=4",
"profile": "http://co.linkedin.com/in/alejandronanez/",
"contributions": [
"doc"
]
},
{
"login": "pbomb",
"name": "Matt Parrish",
"avatar_url": "https://avatars0.githubusercontent.com/u/1402095?v=4",
"profile": "https://github.com/pbomb",
"contributions": [
"bug",
"code",
"doc",
"test"
]
},
{
"login": "wKovacs64",
"name": "Justin Hall",
"avatar_url": "https://avatars1.githubusercontent.com/u/1288694?v=4",
"profile": "https://github.com/wKovacs64",
"contributions": [
"platform"
]
},
{
"login": "antoaravinth",
"name": "Anto Aravinth",
"avatar_url": "https://avatars1.githubusercontent.com/u/1241511?s=460&v=4",
"profile": "https://github.com/antoaravinth",
"contributions": [
"code",
"test",
"doc"
]
},
{
"login": "JonahMoses",
"name": "Jonah Moses",
"avatar_url": "https://avatars2.githubusercontent.com/u/3462296?v=4",
"profile": "https://github.com/JonahMoses",
"contributions": [
"doc"
]
},
{
"login": "lgandecki",
"name": "Łukasz Gandecki",
"avatar_url": "https://avatars1.githubusercontent.com/u/4002543?v=4",
"profile": "http://team.thebrain.pro",
"contributions": [
"code",
"test",
"doc"
]
},
{
"login": "sompylasar",
"name": "Ivan Babak",
"avatar_url": "https://avatars2.githubusercontent.com/u/498274?v=4",
"profile": "https://sompylasar.github.io",
"contributions": [
"bug",
"ideas"
]
},
{
"login": "jday3",
"name": "Jesse Day",
"avatar_url": "https://avatars3.githubusercontent.com/u/4439618?v=4",
"profile": "https://github.com/jday3",
"contributions": [
"code"
]
},
{
"login": "gnapse",
"name": "Ernesto García",
"avatar_url": "https://avatars0.githubusercontent.com/u/15199?v=4",
"profile": "http://gnapse.github.io",
"contributions": [
"question",
"code",
"doc"
]
},
{
"login": "jomaxx",
"name": "Josef Maxx Blake",
"avatar_url": "https://avatars2.githubusercontent.com/u/2747424?v=4",
"profile": "http://jomaxx.com",
"contributions": [
"code",
"doc",
"test"
]
},
{
"login": "mbaranovski",
"name": "Michal Baranowski",
"avatar_url": "https://avatars1.githubusercontent.com/u/29602306?v=4",
"profile": "https://twitter.com/baranovskim",
"contributions": [
"blog",
"tutorial"
]
},
{
"login": "aputhin",
"name": "Arthur Puthin",
"avatar_url": "https://avatars3.githubusercontent.com/u/13985684?v=4",
"profile": "https://github.com/aputhin",
"contributions": [
"doc"
]
},
{
"login": "thchia",
"name": "Thomas Chia",
"avatar_url": "https://avatars2.githubusercontent.com/u/21194045?v=4",
"profile": "https://github.com/thchia",
"contributions": [
"code",
"doc"
]
},
{
"login": "thiagopaiva99",
"name": "Thiago Galvani",
"avatar_url": "https://avatars3.githubusercontent.com/u/20430611?v=4",
"profile": "http://ilegra.com/",
"contributions": [
"doc"
]
},
{
"login": "ChrisWcs",
"name": "Christian",
"avatar_url": "https://avatars1.githubusercontent.com/u/19828824?v=4",
"profile": "http://Chriswcs.github.io",
"contributions": [
"test"
]
},
{
"login": "alexkrolick",
"name": "Alex Krolick",
"avatar_url": "https://avatars3.githubusercontent.com/u/1571667?v=4",
"profile": "https://alexkrolick.com",
"contributions": [
"question",
"doc",
"example",
"ideas"
]
},
{
"login": "johann-sonntagbauer",
"name": "Johann Hubert Sonntagbauer",
"avatar_url": "https://avatars3.githubusercontent.com/u/1239401?v=4",
"profile": "https://github.com/johann-sonntagbauer",
"contributions": [
"code",
"doc",
"test"
]
},
{
"login": "maddijoyce",
"name": "Maddi Joyce",
"avatar_url": "https://avatars2.githubusercontent.com/u/2224291?v=4",
"profile": "http://www.maddijoyce.com",
"contributions": [
"code"
]
},
{
"login": "RyanAtViceSoftware",
"name": "Ryan Vice",
"avatar_url": "https://avatars2.githubusercontent.com/u/10080111?v=4",
"profile": "http://www.vicesoftware.com",
"contributions": [
"doc"
]
},
{
"login": "iwilsonq",
"name": "Ian Wilson",
"avatar_url": "https://avatars1.githubusercontent.com/u/7942604?v=4",
"profile": "https://ianwilson.io",
"contributions": [
"blog",
"tutorial"
]
},
{
"login": "InExtremaRes",
"name": "Daniel",
"avatar_url": "https://avatars2.githubusercontent.com/u/1635491?v=4",
"profile": "https://github.com/InExtremaRes",
"contributions": [
"bug",
"code"
]
},
{
"login": "Gpx",
"name": "Giorgio Polvara",
"avatar_url": "https://avatars0.githubusercontent.com/u/767959?v=4",
"profile": "https://twitter.com/Gpx",
"contributions": [
"bug",
"ideas"
]
},
{
"login": "jgoz",
"name": "John Gozde",
"avatar_url": "https://avatars2.githubusercontent.com/u/132233?v=4",
"profile": "https://github.com/jgoz",
"contributions": [
"code"
]
},
{
"login": "SavePointSam",
"name": "Sam Horton",
"avatar_url": "https://avatars0.githubusercontent.com/u/8203211?v=4",
"profile": "https://twitter.com/SavePointSam",
"contributions": [
"doc",
"example",
"ideas"
]
},
{
"login": "rkotze",
"name": "Richard Kotze (mobile)",
"avatar_url": "https://avatars2.githubusercontent.com/u/10452163?v=4",
"profile": "http://www.richardkotze.com",
"contributions": [
"doc"
]
},
{
"login": "sotobuild",
"name": "Brahian E. Soto Mercedes",
"avatar_url": "https://avatars2.githubusercontent.com/u/10819833?v=4",
"profile": "https://github.com/sotobuild",
"contributions": [
"doc"
]
},
{
"login": "bdelaforest",
"name": "Benoit de La Forest",
"avatar_url": "https://avatars2.githubusercontent.com/u/7151559?v=4",
"profile": "https://github.com/bdelaforest",
"contributions": [
"doc"
]
},
{
"login": "thesalah",
"name": "Salah",
"avatar_url": "https://avatars3.githubusercontent.com/u/6624197?v=4",
"profile": "https://github.com/thesalah",
"contributions": [
"code",
"test"
]
},
{
"login": "icfantv",
"name": "Adam Gordon",
"avatar_url": "https://avatars2.githubusercontent.com/u/370054?v=4",
"profile": "http://gordonizer.com",
"contributions": [
"bug",
"code"
]
},
{
"login": "silvenon",
"name": "Matija Marohnić",
"avatar_url": "https://avatars2.githubusercontent.com/u/471278?v=4",
"profile": "https://silvenon.com",
"contributions": [
"doc"
]
},
{
"login": "Dajust",
"name": "Justice Mba",
"avatar_url": "https://avatars3.githubusercontent.com/u/8015514?v=4",
"profile": "https://github.com/Dajust",
"contributions": [
"doc"
]
},
{
"login": "MarkPollmann",
"name": "Mark Pollmann",
"avatar_url": "https://avatars2.githubusercontent.com/u/5286559?v=4",
"profile": "https://markpollmann.com/",
"contributions": [
"doc"
]
},
{
"login": "ehteshamkafeel",
"name": "Ehtesham Kafeel",
"avatar_url": "https://avatars1.githubusercontent.com/u/1213123?v=4",
"profile": "https://github.com/ehteshamkafeel",
"contributions": [
"code",
"doc"
]
},
{
"login": "jpavon",
"name": "Julio Pavón",
"avatar_url": "https://avatars2.githubusercontent.com/u/1493505?v=4",
"profile": "http://jpavon.com",
"contributions": [
"code"
]
},
{
"login": "duncanleung",
"name": "Duncan L",
"avatar_url": "https://avatars3.githubusercontent.com/u/1765048?v=4",
"profile": "http://www.duncanleung.com/",
"contributions": [
"doc",
"example"
]
},
{
"login": "tyagow",
"name": "Tiago Almeida",
"avatar_url": "https://avatars1.githubusercontent.com/u/700778?v=4",
"profile": "https://www.linkedin.com/in/tyagow/?locale=en_US",
"contributions": [
"doc"
]
},
{
"login": "rbrtsmith",
"name": "Robert Smith",
"avatar_url": "https://avatars2.githubusercontent.com/u/4982001?v=4",
"profile": "http://rbrtsmith.com/",
"contributions": [
"bug"
]
},
{
"login": "zgreen",
"name": "Zach Green",
"avatar_url": "https://avatars0.githubusercontent.com/u/1700355?v=4",
"profile": "https://offbyone.tech",
"contributions": [
"doc"
]
},
{
"login": "dadamssg",
"name": "dadamssg",
"avatar_url": "https://avatars3.githubusercontent.com/u/881986?v=4",
"profile": "https://github.com/dadamssg",
"contributions": [
"doc"
]
},
{
"login": "YazanAabeed",
"name": "Yazan Aabed",
"avatar_url": "https://avatars0.githubusercontent.com/u/8734097?v=4",
"profile": "https://www.yaabed.com/",
"contributions": [
"blog"
]
},
{
"login": "timbonicus",
"name": "Tim",
"avatar_url": "https://avatars0.githubusercontent.com/u/556258?v=4",
"profile": "https://github.com/timbonicus",
"contributions": [
"bug",
"code",
"doc",
"test"
]
},
{
"login": "divyanshu013",
"name": "Divyanshu Maithani",
"avatar_url": "https://avatars3.githubusercontent.com/u/6682655?v=4",
"profile": "http://divyanshu.xyz",
"contributions": [
"tutorial",
"video"
]
},
{
"login": "metagrover",
"name": "Deepak Grover",
"avatar_url": "https://avatars2.githubusercontent.com/u/9116042?v=4",
"profile": "https://www.linkedin.com/in/metagrover",
"contributions": [
"tutorial",
"video"
]
},
{
"login": "eyalcohen4",
"name": "Eyal Cohen",
"avatar_url": "https://avatars0.githubusercontent.com/u/16276358?v=4",
"profile": "https://github.com/eyalcohen4",
"contributions": [
"doc"
]
},
{
"login": "petermakowski",
"name": "Peter Makowski",
"avatar_url": "https://avatars3.githubusercontent.com/u/7452681?v=4",
"profile": "https://github.com/petermakowski",
"contributions": [
"doc"
]
},
{
"login": "Michielnuyts",
"name": "Michiel Nuyts",
"avatar_url": "https://avatars2.githubusercontent.com/u/20361668?v=4",
"profile": "https://github.com/Michielnuyts",
"contributions": [
"doc"
]
},
{
"login": "joeynimu",
"name": "Joe Ng'ethe",
"avatar_url": "https://avatars0.githubusercontent.com/u/1195863?v=4",
"profile": "https://github.com/joeynimu",
"contributions": [
"code",
"doc"
]
},
{
"login": "Enikol",
"name": "Kate",
"avatar_url": "https://avatars3.githubusercontent.com/u/19998290?v=4",
"profile": "https://github.com/Enikol",
"contributions": [
"doc"
]
},
{
"login": "SeanRParker",
"name": "Sean",
"avatar_url": "https://avatars1.githubusercontent.com/u/11980217?v=4",
"profile": "http://www.seanrparker.com",
"contributions": [
"doc"
]
},
{
"login": "jlongster",
"name": "James Long",
"avatar_url": "https://avatars2.githubusercontent.com/u/17031?v=4",
"profile": "http://jlongster.com",
"contributions": [
"ideas",
"platform"
]
},
{
"login": "hhagely",
"name": "Herb Hagely",
"avatar_url": "https://avatars1.githubusercontent.com/u/10118777?v=4",
"profile": "https://github.com/hhagely",
"contributions": [
"example"
]
},
{
"login": "themostcolm",
"name": "Alex Wendte",
"avatar_url": "https://avatars2.githubusercontent.com/u/5779538?v=4",
"profile": "http://www.wendtedesigns.com/",
"contributions": [
"example"
]
},
{
"login": "M0nica",
"name": "Monica Powell",
"avatar_url": "https://avatars0.githubusercontent.com/u/6998954?v=4",
"profile": "http://www.aboutmonica.com",
"contributions": [
"doc"
]
},
{
"login": "sivkoff",
"name": "Vitaly Sivkov",
"avatar_url": "https://avatars1.githubusercontent.com/u/2699953?v=4",
"profile": "http://sivkoff.com",
"contributions": [
"code"
]
},
{
"login": "weyert",
"name": "Weyert de Boer",
"avatar_url": "https://avatars3.githubusercontent.com/u/7049?v=4",
"profile": "https://github.com/weyert",
"contributions": [
"ideas",
"review"
]
},
{
"login": "EstebanMarin",
"name": "EstebanMarin",
"avatar_url": "https://avatars3.githubusercontent.com/u/13613037?v=4",
"profile": "https://github.com/EstebanMarin",
"contributions": [
"doc"
]
},
{
"login": "vctormb",
"name": "Victor Martins",
"avatar_url": "https://avatars2.githubusercontent.com/u/13953703?v=4",
"profile": "https://github.com/vctormb",
"contributions": [
"doc"
]
},
{
"login": "RoystonS",
"name": "Royston Shufflebotham",
"avatar_url": "https://avatars0.githubusercontent.com/u/19773?v=4",
"profile": "https://github.com/RoystonS",
"contributions": [
"bug",
"doc",
"example"
]
},
{
"login": "chrbala",
"name": "chrbala",
"avatar_url": "https://avatars0.githubusercontent.com/u/6834804?v=4",
"profile": "https://github.com/chrbala",
"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"
]
},
{
"login": "maisano",
"name": "Richard Maisano",
"avatar_url": "https://avatars2.githubusercontent.com/u/689081?v=4",
"profile": "https://github.com/maisano",
"contributions": [
"code"
]
},
{
"login": "marcobiedermann",
"name": "Marco Biedermann",
"avatar_url": "https://avatars0.githubusercontent.com/u/5244986?v=4",
"profile": "https://www.marcobiedermann.com",
"contributions": [
"code",
"maintenance",
"test"
]
},
{
"login": "alexzherdev",
"name": "Alex Zherdev",
"avatar_url": "https://avatars3.githubusercontent.com/u/93752?v=4",
"profile": "https://github.com/alexzherdev",
"contributions": [
"bug",
"code"
]
},
{
"login": "Andrewmat",
"name": "André Matulionis dos Santos",
"avatar_url": "https://avatars0.githubusercontent.com/u/5133846?v=4",
"profile": "https://twitter.com/Andrewmat",
"contributions": [
"code",
"example",
"test"
]
},
{
"login": "FredyC",
"name": "Daniel K.",
"avatar_url": "https://avatars0.githubusercontent.com/u/1096340?v=4",
"profile": "https://github.com/FredyC",
"contributions": [
"bug",
"code",
"ideas",
"test",
"review"
]
},
{
"login": "mohamedmagdy17593",
"name": "mohamedmagdy17593",
"avatar_url": "https://avatars0.githubusercontent.com/u/40938625?v=4",
"profile": "https://github.com/mohamedmagdy17593",
"contributions": [
"code"
]
},
{
"login": "lorensr",
"name": "Loren ☺️",
"avatar_url": "https://avatars2.githubusercontent.com/u/251288?v=4",
"profile": "http://lorensr.me",
"contributions": [
"doc"
]
},
{
"login": "MarkFalconbridge",
"name": "MarkFalconbridge",
"avatar_url": "https://avatars1.githubusercontent.com/u/20678943?v=4",
"profile": "https://github.com/MarkFalconbridge",
"contributions": [
"bug",
"code"
]
},
{
"login": "viniciusavieira",
"name": "Vinicius",
"avatar_url": "https://avatars0.githubusercontent.com/u/2073019?v=4",
"profile": "https://github.com/viniciusavieira",
"contributions": [
"doc",
"example"
]
},
{
"login": "pschyma",
"name": "Peter Schyma",
"avatar_url": "https://avatars2.githubusercontent.com/u/2489928?v=4",
"profile": "https://github.com/pschyma",
"contributions": [
"code"
]
},
{
"login": "ianschmitz",
"name": "Ian Schmitz",
"avatar_url": "https://avatars1.githubusercontent.com/u/6355370?v=4",
"profile": "https://github.com/ianschmitz",
"contributions": [
"doc"
]
},
{
"login": "joual",
"name": "Joel Marcotte",
"avatar_url": "https://avatars0.githubusercontent.com/u/157877?v=4",
"profile": "https://github.com/joual",
"contributions": [
"bug",
"test",
"code"
]
},
{
"login": "aledustet",
"name": "Alejandro Dustet",
"avatar_url": "https://avatars3.githubusercontent.com/u/2413802?v=4",
"profile": "http://aledustet.com",
"contributions": [
"bug"
]
},
{
"login": "bcarroll22",
"name": "Brandon Carroll",
"avatar_url": "https://avatars2.githubusercontent.com/u/11020406?v=4",
"profile": "https://github.com/bcarroll22",
"contributions": [
"doc"
]
},
{
"login": "lucas0707",
"name": "Lucas Machado",
"avatar_url": "https://avatars1.githubusercontent.com/u/26284338?v=4",
"profile": "https://github.com/lucas0707",
"contributions": [
"doc"
]
},
{
"login": "pascalduez",
"name": "Pascal Duez",
"avatar_url": "https://avatars3.githubusercontent.com/u/335467?v=4",
"profile": "http://pascalduez.me",
"contributions": [
"platform"
]
},
{
"login": "NMinhNguyen",
"name": "Minh Nguyen",
"avatar_url": "https://avatars3.githubusercontent.com/u/2852660?v=4",
"profile": "https://twitter.com/minh_ngvyen",
"contributions": [
"code"
]
},
{
"login": "LiaoJimmy",
"name": "LiaoJimmy",
"avatar_url": "https://avatars0.githubusercontent.com/u/11155585?v=4",
"profile": "http://iababy46.blogspot.tw/",
"contributions": [
"doc"
]
},
{
"login": "threepointone",
"name": "Sunil Pai",
"avatar_url": "https://avatars2.githubusercontent.com/u/18808?v=4",
"profile": "https://github.com/threepointone",
"contributions": [
"code",
"test"
]
},
{
"login": "gaearon",
"name": "Dan Abramov",
"avatar_url": "https://avatars0.githubusercontent.com/u/810438?v=4",
"profile": "http://twitter.com/dan_abramov",
"contributions": [
"review"
]
},
{
"login": "ChristianMurphy",
"name": "Christian Murphy",
"avatar_url": "https://avatars3.githubusercontent.com/u/3107513?v=4",
"profile": "https://github.com/ChristianMurphy",
"contributions": [
"infra"
]
},
{
"login": "jeetiss",
"name": "Ivakhnenko Dmitry",
"avatar_url": "https://avatars1.githubusercontent.com/u/6726016?v=4",
"profile": "https://jeetiss.github.io/",
"contributions": [
"code"
]
},
{
"login": "jamesgeorge007",
"name": "James George",
"avatar_url": "https://avatars2.githubusercontent.com/u/25279263?v=4",
"profile": "https://ghuser.io/jamesgeorge007",
"contributions": [
"doc"
]
},
{
"login": "JSFernandes",
"name": "João Fernandes",
"avatar_url": "https://avatars1.githubusercontent.com/u/1075053?v=4",
"profile": "https://joaofernandes.me/",
"contributions": [
"doc"
]
},
{
"login": "alejandroperea",
"name": "Alejandro Perea",
"avatar_url": "https://avatars3.githubusercontent.com/u/6084749?v=4",
"profile": "https://github.com/alejandroperea",
"contributions": [
"review"
]
},
{
"login": "nickmccurdy",
"name": "Nick McCurdy",
"avatar_url": "https://avatars0.githubusercontent.com/u/927220?v=4",
"profile": "https://nickmccurdy.com/",
"contributions": [
"review",
"question"
]
},
{
"login": "eps1lon",
"name": "Sebastian Silbermann",
"avatar_url": "https://avatars3.githubusercontent.com/u/12292047?v=4",
"profile": "https://twitter.com/sebsilbermann",
"contributions": [
"review"
]
},
{
"login": "afontcu",
"name": "Adrià Fontcuberta",
"avatar_url": "https://avatars0.githubusercontent.com/u/9197791?v=4",
"profile": "https://afontcu.dev",
"contributions": [
"review",
"doc"
]
},
{
"login": "johnnyreilly",
"name": "John Reilly",
"avatar_url": "https://avatars0.githubusercontent.com/u/1010525?v=4",
"profile": "https://blog.johnnyreilly.com/",
"contributions": [
"review"
]
},
{
"login": "MichaelDeBoey",
"name": "Michaël De Boey",
"avatar_url": "https://avatars3.githubusercontent.com/u/6643991?v=4",
"profile": "https://michaeldeboey.be",
"contributions": [
"review"
]
},
{
"login": "cimbul",
"name": "Tim Yates",
"avatar_url": "https://avatars2.githubusercontent.com/u/927923?v=4",
"profile": "https://cimbul.com",
"contributions": [
"review"
]
},
{
"login": "eventualbuddha",
"name": "Brian Donovan",
"avatar_url": "https://avatars3.githubusercontent.com/u/1938?v=4",
"profile": "https://github.com/eventualbuddha",
"contributions": [
"code"
]
},
{
"login": "JaysQubeXon",
"name": "Noam Gabriel Jacobson",
"avatar_url": "https://avatars1.githubusercontent.com/u/18309230?v=4",
"profile": "https://github.com/JaysQubeXon",
"contributions": [
"doc"
]
},
{
"login": "rvdkooy",
"name": "Ronald van der Kooij",
"avatar_url": "https://avatars1.githubusercontent.com/u/4119960?v=4",
"profile": "https://github.com/rvdkooy",
"contributions": [
"test",
"code"
]
},
{
"login": "aayushrajvanshi",
"name": "Aayush Rajvanshi",
"avatar_url": "https://avatars0.githubusercontent.com/u/14968551?v=4",
"profile": "https://github.com/aayushrajvanshi",
"contributions": [
"doc"
]
},
{
"login": "ely-alamillo",
"name": "Ely Alamillo",
"avatar_url": "https://avatars2.githubusercontent.com/u/24350492?v=4",
"profile": "https://elyalamillo.com",
"contributions": [
"code",
"test"
]
},
{
"login": "danieljcafonso",
"name": "Daniel Afonso",
"avatar_url": "https://avatars3.githubusercontent.com/u/35337607?v=4",
"profile": "https://github.com/danieljcafonso",
"contributions": [
"code",
"test"
]
},
{
"login": "LaurensBosscher",
"name": "Laurens Bosscher",
"avatar_url": "https://avatars0.githubusercontent.com/u/13363196?v=4",
"profile": "http://www.laurensbosscher.nl",
"contributions": [
"code"
]
}
],
"contributorsPerLine": 7,
"repoHost": "https://github.com"
}

2
.gitattributes vendored
Unescape View File

@ -0,0 +1,2 @@
* text=auto
*.js text eol=lf

82
.github/ISSUE_TEMPLATE.md vendored
Unescape View File

@ -0,0 +1,82 @@
<!--
HI! PLEASE STOP TO READ THIS!! IF YOU DO NOT FOLLOW THE INSTRUCTIONS, YOUR ISSUE
WILL LIKELY BE CLOSED.
Thanks for your interest in the project. We appreciate bugs filed and PRs submitted!
- Please make sure that you are familiar with and follow the Code of Conduct for
this project (found in the CODE_OF_CONDUCT.md file).
- Please review the Issues policies before filing an issue:
🐛 Bugs:
File an issue for bugs, missing documentation, or unexpected behavior.
💡 Feature Requests:
File an issue to suggest new features.
Vote on feature requests by adding a 👍. This helps maintainers prioritize
what to work on.
❓ Questions:
For questions related to using the library, please visit a support community
instead of filing an issue on GitHub.
* React Spectrum
https://spectrum.chat/react-testing-library
* Reactiflux on Discord
https://www.reactiflux.com
* Stack Overflow
https://stackoverflow.com/questions/tagged/react-testing-library
**ISSUES WHICH ARE QUESTIONS WILL BE CLOSED**
- Please fill out this template with all the relevant information so we can
understand what's going on and fix the issue.
- If you're issue is regarding one of the query APIs (`getByText`,
`getByLabelText`, etc), then please file it on the `dom-testing-library`
repository instead. If you file it here it will be closed. Thanks :)
We'll probably ask you to submit the fix (after giving some direction). If
you've never done that before, that's great! Check this free short video
tutorial to learn how: http://kcd.im/pull-request
-->
- `react-testing-library` version:
- `react` version:
- `node` version:
- `npm` (or `yarn`) version:
Relevant code or config
```javascript
```
What you did:
What happened:
<!-- Please provide the full error message/screenshots/anything -->
Reproduction repository:
<!--
If possible, please create a repository that reproduces the issue with the
minimal amount of code possible. You may fork the template here:
https://github.com/alexkrolick/dom-testing-library-template
Or if you can, try to reproduce the issue in a codesandbox. You can fork the
one here: https://codesandbox.io/s/5z6x4r7n0p
-->
Problem description:
<!-- Please describe why the current behavior is a problem -->
Suggested solution:
<!--
It's ok if you don't have a suggested solution, but it really helps if you could
do a little digging to come up with some suggestion of how to improve things.
-->

70
.github/ISSUE_TEMPLATE/Bug_Report.md vendored
Unescape View File

@ -0,0 +1,70 @@
---
name: 🐛 Bug Report
about: Bugs, missing documentation, or unexpected behavior 🤔.
---
<!--
* Please fill out this template with all the relevant information so we can
understand what's going on and fix the issue. We appreciate bugs filed and PRs
submitted!
* If your issue is regarding one of the query APIs (`getByText`,
`getByLabelText`, etc), then please file it on the `dom-testing-library`
repository instead. If you file it here it will be closed. Thanks :)
* Please make sure that you are familiar with and follow the Code of Conduct for
this project (found in the CODE_OF_CONDUCT.md file).
We'll probably ask you to submit the fix (after giving some direction). If
you've never done that before, that's great! Check this free short video
tutorial to learn how: http://kcd.im/pull-request
-->
- `react-testing-library` version:
- `react` version:
- `node` version:
- `npm` (or `yarn`) version:
### Relevant code or config:
```js
var your => (code) => here;
```
<!--
If this is an issue with documentation, please file an issue on the docs repo:
https://github.com/alexkrolick/testing-library-docs
-->
### What you did:
<!-- What you were doing -->
### What happened:
<!-- Please provide the full error message/screenshots/anything -->
### Reproduction:
<!--
If possible, please create a repository that reproduces the issue with the
minimal amount of code possible.
Template repo: https://github.com/alexkrolick/dom-testing-library-template
Or if you can, try to reproduce the issue in a Codesandbox. You can fork the one
here: https://codesandbox.io/s/5z6x4r7n0p
-->
### Problem description:
<!-- Please describe why the current behavior is a problem -->
### Suggested solution:
<!--
It's ok if you don't have a suggested solution, but it really helps if you could
do a little digging to come up with some suggestion of how to improve things.
-->

51
.github/ISSUE_TEMPLATE/Feature_Request.md vendored
Unescape View File

@ -0,0 +1,51 @@
---
name: 💡 Feature Request
about: I have a suggestion (and might want to implement myself 🙂)!
---
<!--
Vote on feature requests by adding a 👍. This helps maintainers prioritize what
to work on.
* Please fill out this template with all the relevant information so we can
understand what's going on and fix the issue. We appreciate bugs filed and PRs
submitted!
* If you're issue is regarding one of the query APIs (`getByText`
`getByLabelText`, etc), then please file it on the `dom-testing-library`
repository instead. If you file it here it will be closed. Thanks :)
* Please make sure that you are familiar with and follow the Code of Conduct for
this project (found in the CODE_OF_CONDUCT.md file).
It'd be great if after the discussion you're the one who submits the PR that
implements this feature. If you've never done that before, that's great! Check
this free short video tutorial to learn how: http://kcd.im/pull-request
-->
### Describe the feature you'd like:
<!--
A clear and concise description of what you want to happen. Add any considered
drawbacks.
-->
### Suggested implementation:
<!-- Helpful but optional 😀 -->
### Describe alternatives you've considered:
<!--
A clear and concise description of any alternative solutions or features you've
considered.
-->
### Teachability, Documentation, Adoption, Migration Strategy:
<!--
If you can, explain how users will be able to use this and possibly write out a
version of the docs.
-->

21
.github/ISSUE_TEMPLATE/Question.md vendored
Unescape View File

@ -0,0 +1,21 @@
---
name: ❓ Support Question
about: 🛑 If you have a question 💬, please check out our support channels!
---
-------------- 👆 Click "Preview"!
Issues on GitHub are intended to be related to problems with the library itself
and feature requests so we recommend not using this medium to ask them here 😁.
---
## ❓ Support Forums
- React Spectrum https://spectrum.chat/react-testing-library
- Reactiflux on Discord https://www.reactiflux.com
- Stack Overflow
https://stackoverflow.com/questions/tagged/react-testing-library
- Documentation: https://github.com/alexkrolick/testing-library-docs
**ISSUES WHICH ARE QUESTIONS WILL BE CLOSED**

44
.github/PULL_REQUEST_TEMPLATE.md vendored
Unescape View File

@ -0,0 +1,44 @@
<!--
Thanks for your interest in the project. Bugs filed and PRs submitted are appreciated!
Please make sure that you are familiar with and follow the Code of Conduct for
this project (found in the CODE_OF_CONDUCT.md file).
Also, please make sure you're familiar with and follow the instructions in the
contributing guidelines (found in the CONTRIBUTING.md file).
If you're new to contributing to open source projects, you might find this free
video course helpful: http://kcd.im/pull-request
Please fill out the information below to expedite the review and (hopefully)
merge of your pull request!
-->
<!-- What changes are being made? (What feature/bug is being fixed here?) -->
**What**:
<!-- Why are these changes necessary? -->
**Why**:
<!-- How were these changes implemented? -->
**How**:
<!-- Have you done all of these things? -->
**Checklist**:
<!-- add "N/A" to the end of each line that's irrelevant to your changes -->
<!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->
- [ ] Documentation added to the
[docs site](https://github.com/alexkrolick/testing-library-docs)
- [ ] Tests
- [ ] Typescript definitions updated
- [ ] Ready to be merged
<!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->
<!-- feel free to add additional comments -->

15
.gitignore vendored
Unescape View File

@ -0,0 +1,15 @@
node_modules
coverage
dist
.opt-in
.opt-out
.DS_Store
.eslintcache
yarn-error.log
# these cause more harm than good
# when working with contributors
package-lock.json
yarn.lock

2
.npmrc
Unescape View File

@ -0,0 +1,2 @@
registry=http://registry.npmjs.org/
package-lock=false

4
.prettierignore
Unescape View File

@ -0,0 +1,4 @@
package.json
node_modules
dist
coverage

11
.prettierrc
Unescape View File

@ -0,0 +1,11 @@
{
"printWidth": 80,
"tabWidth": 2,
"useTabs": false,
"semi": false,
"singleQuote": true,
"trailingComma": "all",
"bracketSpacing": false,
"jsxBracketSameLine": false,
"proseWrap": "always"
}

20
.travis.yml
Unescape View File

@ -0,0 +1,20 @@
sudo: false
language: node_js
cache:
directories:
- ~/.npm
notifications:
email: false
node_js:
- '8'
- '10'
- '12'
install:
- npm install
# as requested by the React team :)
# https://reactjs.org/blog/2019/10/22/react-release-channels.html#using-the-next-channel-for-integration-testing
- if [ "$TRAVIS_EVENT_TYPE" = "cron" ]; then npm install react@next react-dom@next; fi
script: npm run validate
after_success: kcd-scripts travis-after-success
branches:
only: master

5
CHANGELOG.md
Unescape View File

@ -0,0 +1,5 @@
# CHANGELOG
The changelog is automatically updated using
[semantic-release](https://github.com/semantic-release/semantic-release). You
can see it on the [releases page](../../releases).

75
CODE_OF_CONDUCT.md
Unescape View File

@ -0,0 +1,75 @@
# Contributor Covenant Code of Conduct
## Our Pledge
In the interest of fostering an open and welcoming environment, we as
contributors and maintainers pledge to making participation in our project and
our community a harassment-free experience for everyone, regardless of age, body
size, disability, ethnicity, gender identity and expression, level of
experience, nationality, personal appearance, race, religion, or sexual identity
and orientation.
## Our Standards
Examples of behavior that contributes to creating a positive environment
include:
- Using welcoming and inclusive language
- Being respectful of differing viewpoints and experiences
- Gracefully accepting constructive criticism
- Focusing on what is best for the community
- Showing empathy towards other community members
Examples of unacceptable behavior by participants include:
- The use of sexualized language or imagery and unwelcome sexual attention or
advances
- Trolling, insulting/derogatory comments, and personal or political attacks
- Public or private harassment
- Publishing others' private information, such as a physical or electronic
address, without explicit permission
- Other conduct which could reasonably be considered inappropriate in a
professional setting
## Our Responsibilities
Project maintainers are responsible for clarifying the standards of acceptable
behavior and are expected to take appropriate and fair corrective action in
response to any instances of unacceptable behavior.
Project maintainers have the right and responsibility to remove, edit, or reject
comments, commits, code, wiki edits, issues, and other contributions that are
not aligned to this Code of Conduct, or to ban temporarily or permanently any
contributor for other behaviors that they deem inappropriate, threatening,
offensive, or harmful.
## Scope
This Code of Conduct applies both within project spaces and in public spaces
when an individual is representing the project or its community. Examples of
representing a project or community include using an official project e-mail
address, posting via an official social media account, or acting as an appointed
representative at an online or offline event. Representation of a project may be
further defined and clarified by project maintainers.
## Enforcement
Instances of abusive, harassing, or otherwise unacceptable behavior may be
reported by contacting the project team at kent+coc@doddsfamily.us. All
complaints will be reviewed and investigated and will result in a response that
is deemed necessary and appropriate to the circumstances. The project team is
obligated to maintain confidentiality with regard to the reporter of an
incident. Further details of specific enforcement policies may be posted
separately.
Project maintainers who do not follow or enforce the Code of Conduct in good
faith may face temporary or permanent repercussions as determined by other
members of the project's leadership.
## Attribution
This Code of Conduct is adapted from the [Contributor Covenant][homepage],
version 1.4, available at [http://contributor-covenant.org/version/1/4][version]
[homepage]: http://contributor-covenant.org
[version]: http://contributor-covenant.org/version/1/4/

50
CONTRIBUTING.md
Unescape View File

@ -0,0 +1,50 @@
# Contributing
Thanks for being willing to contribute!
**Working on your first Pull Request?** You can learn how from this _free_
series [How to Contribute to an Open Source Project on GitHub][egghead]
## Project setup
1. Fork and clone the repo
2. Run `npm run setup -s` to install dependencies and run validation
3. Create a branch for your PR with `git checkout -b pr/your-branch-name`
> Tip: Keep your `master` branch pointing at the original repository and make
> pull requests from branches on your fork. To do this, run:
>
> ```
> git remote add upstream https://github.com/testing-library/react-testing-library.git
> git fetch upstream
> git branch --set-upstream-to=upstream/master master
> ```
>
> This will add the original repository as a "remote" called "upstream," Then
> fetch the git information from that remote, then set your local `master`
> branch to use the upstream master branch whenever you run `git pull`. Then you
> can make all of your pull request branches based on this `master` branch.
> Whenever you want to update your version of `master`, do a regular `git pull`.
## Committing and Pushing changes
Please make sure to run the tests before you commit your changes. You can run
`npm run test:update` which will update any snapshots that need updating. Make
sure to include those changes (if they exist) in your commit.
### Update Typings
The TypeScript type definitions are in the
[DefinitelyTyped repo](https://github.com/DefinitelyTyped/DefinitelyTyped/tree/master/types/testing-library__react)
## Help needed
Please checkout the [the open issues][issues]
Also, please watch the repo and respond to questions/bug reports/feature
requests! Thanks!
[egghead]:
https://egghead.io/series/how-to-contribute-to-an-open-source-project-on-github
[all-contributors]: https://github.com/all-contributors/all-contributors
[issues]: https://github.com/testing-library/react-testing-library/issues

20
LICENSE
Unescape View File

@ -0,0 +1,20 @@
The MIT License (MIT)
Copyright (c) 2017 Kent C. Dodds
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.

567
README.md
Unescape View File

@ -0,0 +1,567 @@
<div align="center">
<h1>React Testing Library</h1>
<a href="https://www.emojione.com/emoji/1f410">
<img
height="80"
width="80"
alt="goat"
src="https://raw.githubusercontent.com/testing-library/react-testing-library/master/other/goat.png"
/>
</a>
<p>Simple and complete React DOM testing utilities that encourage good testing
practices.</p>
<br />
[**Read The Docs**](https://testing-library.com/react) |
[Edit the docs](https://github.com/testing-library/testing-library-docs)
<br />
</div>
<hr />
<!-- prettier-ignore-start -->
[![Build Status][build-badge]][build]
[![Code Coverage][coverage-badge]][coverage]
[![version][version-badge]][package] [![downloads][downloads-badge]][npmtrends]
[![MIT License][license-badge]][license]
[![All Contributors](https://img.shields.io/badge/all_contributors-102-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]
[![Watch on GitHub][github-watch-badge]][github-watch]
[![Star on GitHub][github-star-badge]][github-star]
[![Tweet][twitter-badge]][twitter]
<!-- prettier-ignore-end -->
<div align="center">
<a href="https://testingjavascript.com">
<img
width="500"
alt="TestingJavaScript.com Learn the smart, efficient way to test any JavaScript application."
src="https://raw.githubusercontent.com/testing-library/react-testing-library/master/other/testingjavascript.jpg"
/>
</a>
</div>
## Table of Contents
<!-- START doctoc generated TOC please keep comment here to allow auto update -->
<!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
- [The problem](#the-problem)
- [This solution](#this-solution)
- [Installation](#installation)
- [Suppressing unnecessary warnings on React DOM 16.8](#suppressing-unnecessary-warnings-on-react-dom-168)
- [Examples](#examples)
- [Basic Example](#basic-example)
- [Complex Example](#complex-example)
- [More Examples](#more-examples)
- [Hooks](#hooks)
- [Guiding Principles](#guiding-principles)
- [Docs](#docs)
- [Issues](#issues)
- [🐛 Bugs](#-bugs)
- [💡 Feature Requests](#-feature-requests)
- [❓ Questions](#-questions)
- [Contributors](#contributors)
- [LICENSE](#license)
<!-- END doctoc generated TOC please keep comment here to allow auto update -->
## The problem
You want to write maintainable tests for your React components. As a part of
this goal, you want your tests to avoid including implementation details of your
components and rather focus on making your tests give you the confidence for
which they are intended. As part of this, you want your testbase to be
maintainable in the long run so refactors of your components (changes to
implementation but not functionality) don't break your tests and slow you and
your team down.
## This solution
The `React Testing Library` is a very lightweight solution for testing React
components. It provides light utility functions on top of `react-dom` and
`react-dom/test-utils`, in a way that encourages better testing practices. Its
primary guiding principle is:
> [The more your tests resemble the way your software is used, the more
> confidence they can give you.][guiding-principle]
## Installation
This module is distributed via [npm][npm] which is bundled with [node][node] and
should be installed as one of your project's `devDependencies`:
```
npm install --save-dev @testing-library/react
```
This library has `peerDependencies` listings for `react` and `react-dom`.
You may also be interested in installing `@testing-library/jest-dom` so you can
use [the custom jest matchers](https://github.com/testing-library/jest-dom).
> [**Docs**](https://testing-library.com/react)
### Suppressing unnecessary warnings on React DOM 16.8
There is a known compatibility issue with React DOM 16.8 where you will see the
following warning:
```
Warning: An update to ComponentName inside a test was not wrapped in act(...).
```
If you cannot upgrade to React DOM 16.9, you may suppress the warnings by adding
the following snippet to your test configuration
([learn more](https://github.com/testing-library/react-testing-library/issues/281)):
```js
// this is just a little hack to silence a warning that we'll get until we
// upgrade to 16.9: https://github.com/facebook/react/pull/14853
const originalError = console.error
beforeAll(() => {
console.error = (...args) => {
if (/Warning.*not wrapped in act/.test(args[0])) {
return
}
originalError.call(console, ...args)
}
})
afterAll(() => {
console.error = originalError
})
```
## Examples
### Basic Example
```jsx
// hidden-message.js
import React from 'react'
// NOTE: React Testing Library works with React Hooks _and_ classes just as well
// and your tests will be the same however you write your components.
function HiddenMessage({children}) {
const [showMessage, setShowMessage] = React.useState(false)
return (
<div>
<label htmlFor="toggle">Show Message</label>
<input
id="toggle"
type="checkbox"
onChange={e => setShowMessage(e.target.checked)}
checked={showMessage}
/>
{showMessage ? children : null}
</div>
)
}
export default HiddenMessage
// __tests__/hidden-message.js
// these imports are something you'd normally configure Jest to import for you
// automatically. Learn more in the setup docs: https://testing-library.com/docs/react-testing-library/setup#cleanup
import '@testing-library/jest-dom/extend-expect'
// NOTE: jest-dom adds handy assertions to Jest and is recommended, but not required
import React from 'react'
import {render, fireEvent} from '@testing-library/react'
import HiddenMessage from '../hidden-message'
test('shows the children when the checkbox is checked', () => {
const testMessage = 'Test Message'
const {queryByText, getByLabelText, getByText} = render(
<HiddenMessage>{testMessage}</HiddenMessage>,
)
// query* functions will return the element or null if it cannot be found
// get* functions will return the element or throw an error if it cannot be found
expect(queryByText(testMessage)).toBeNull()
// the queries can accept a regex to make your selectors more resilient to content tweaks and changes.
fireEvent.click(getByLabelText(/show/i))
// .toBeInTheDocument() is an assertion that comes from jest-dom
// otherwise you could use .toBeDefined()
expect(getByText(testMessage)).toBeInTheDocument()
})
```
### Complex Example
```jsx
// login.js
import React from 'react'
function Login() {
const [state, setState] = React.useReducer((s, a) => ({...s, ...a}), {
resolved: false,
loading: false,
error: null,
})
function handleSubmit(event) {
event.preventDefault()
const {usernameInput, passwordInput} = event.target.elements
setState({loading: true, resolved: false, error: null})
window
.fetch('/api/login', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify({
username: usernameInput.value,
password: passwordInput.value,
}),
})
.then(r => r.json())
.then(
user => {
setState({loading: false, resolved: true, error: null})
window.localStorage.setItem('token', user.token)
},
error => {
setState({loading: false, resolved: false, error: error.message})
},
)
}
return (
<div>
<form onSubmit={handleSubmit}>
<div>
<label htmlFor="usernameInput">Username</label>
<input id="usernameInput" />
</div>
<div>
<label htmlFor="passwordInput">Password</label>
<input id="passwordInput" type="password" />
</div>
<button type="submit">Submit{state.loading ? '...' : null}</button>
</form>
{state.error ? <div role="alert">{state.error.message}</div> : null}
{state.resolved ? (
<div role="alert">Congrats! You're signed in!</div>
) : null}
</div>
)
}
export default Login
// __tests__/login.js
// again, these first two imports are something you'd normally handle in
// your testing framework configuration rather than importing them in every file.
import '@testing-library/jest-dom/extend-expect'
import React from 'react'
import {render, fireEvent} from '@testing-library/react'
import Login from '../login'
test('allows the user to login successfully', async () => {
// mock out window.fetch for the test
const fakeUserResponse = {token: 'fake_user_token'}
jest.spyOn(window, 'fetch').mockImplementationOnce(() => {
return Promise.resolve({
json: () => Promise.resolve(fakeUserResponse),
})
})
const {getByLabelText, getByText, findByRole} = render(<Login />)
// fill out the form
fireEvent.change(getByLabelText(/username/i), {target: {value: 'chuck'}})
fireEvent.change(getByLabelText(/password/i), {target: {value: 'norris'}})
fireEvent.click(getByText(/submit/i))
// just like a manual tester, we'll instruct our test to wait for the alert
// to show up before continuing with our assertions.
const alert = await findByRole('alert')
// .toHaveTextContent() comes from jest-dom's assertions
// otherwise you could use expect(alert.textContent).toMatch(/congrats/i)
// but jest-dom will give you better error messages which is why it's recommended
expect(alert).toHaveTextContent(/congrats/i)
expect(window.localStorage.getItem('token')).toEqual(fakeUserResponse.token)
})
```
### More Examples
> We're in the process of moving examples to the
> [docs site](https://testing-library.com/docs/example-codesandbox)
You'll find runnable examples of testing with different libraries in
[the `react-testing-library-examples` codesandbox](https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples).
Some included are:
- [`react-redux`](https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples/tree/master/?fontsize=14&module=%2Fsrc%2F__tests__%2Freact-redux.js&previewwindow=tests)
- [`react-router`](https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples/tree/master/?fontsize=14&module=%2Fsrc%2F__tests__%2Freact-router.js&previewwindow=tests)
- [`react-context`](https://codesandbox.io/s/github/kentcdodds/react-testing-library-examples/tree/master/?fontsize=14&module=%2Fsrc%2F__tests__%2Freact-context.js&previewwindow=tests)
You can also find React Testing Library examples at
[react-testing-examples.com](https://react-testing-examples.com/jest-rtl/).
## Hooks
If you are interested in testing a custom hook, check out [React Hooks Testing
Library][react-hooks-testing-library].
> NOTE it is not recommended to test single-use custom hooks in isolation from
> the components where it's being used. It's better to test the component that's
> using the hook rather than the hook itself. The `React Hooks Testing Library`
> is intended to be used for reusable hooks/libraries.
## Guiding Principles
> [The more your tests resemble the way your software is used, the more
> confidence they can give you.][guiding-principle]
We try to only expose methods and utilities that encourage you to write tests
that closely resemble how your react components are used.
Utilities are included in this project based on the following guiding
principles:
1. If it relates to rendering components, it deals with DOM nodes rather than
component instances, nor should it encourage dealing with component
instances.
2. It should be generally useful for testing individual React components or
full React applications. While this library is focused on `react-dom`,
utilities could be included even if they don't directly relate to
`react-dom`.
3. Utility implementations and APIs should be simple and flexible.
At the end of the day, what we want is for this library to be pretty
light-weight, simple, and understandable.
## Docs
[**Read The Docs**](https://testing-library.com/react) |
[Edit the docs](https://github.com/testing-library/testing-library-docs)
## Issues
_Looking to contribute? Look for the [Good First Issue][good-first-issue]
label._
### 🐛 Bugs
Please file an issue for bugs, missing documentation, or unexpected behavior.
[**See Bugs**][bugs]
### 💡 Feature Requests
Please file an issue to suggest new features. Vote on feature requests by adding
a 👍. This helps maintainers prioritize what to work on.
[**See Feature Requests**][requests]
### ❓ Questions
For questions related to using the library, please visit a support community
instead of filing an issue on GitHub.
- [Spectrum][spectrum]
- [Reactiflux on Discord][reactiflux]
- [Stack Overflow][stackoverflow]
## Contributors
Thanks goes to these people ([emoji key][emojis]):
<!-- ALL-CONTRIBUTORS-LIST:START - Do not remove or modify this section -->
<!-- prettier-ignore -->
<table>
<tr>
<td align="center"><a href="https://kentcdodds.com"><img src="https://avatars.githubusercontent.com/u/1500684?v=3" width="100px;" alt="Kent C. Dodds"/><br /><sub><b>Kent C. Dodds</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=kentcdodds" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=kentcdodds" title="Documentation">📖</a> <a href="#infra-kentcdodds" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=kentcdodds" title="Tests">⚠️</a></td>
<td align="center"><a href="http://audiolion.github.io"><img src="https://avatars1.githubusercontent.com/u/2430381?v=4" width="100px;" alt="Ryan Castner"/><br /><sub><b>Ryan Castner</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=audiolion" title="Documentation">📖</a></td>
<td align="center"><a href="https://www.dnlsandiego.com"><img src="https://avatars0.githubusercontent.com/u/8008023?v=4" width="100px;" alt="Daniel Sandiego"/><br /><sub><b>Daniel Sandiego</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=dnlsandiego" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/Miklet"><img src="https://avatars2.githubusercontent.com/u/12592677?v=4" width="100px;" alt="Paweł Mikołajczyk"/><br /><sub><b>Paweł Mikołajczyk</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=Miklet" title="Code">💻</a></td>
<td align="center"><a href="http://co.linkedin.com/in/alejandronanez/"><img src="https://avatars3.githubusercontent.com/u/464978?v=4" width="100px;" alt="Alejandro Ñáñez Ortiz"/><br /><sub><b>Alejandro Ñáñez Ortiz</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=alejandronanez" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/pbomb"><img src="https://avatars0.githubusercontent.com/u/1402095?v=4" width="100px;" alt="Matt Parrish"/><br /><sub><b>Matt Parrish</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Apbomb" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=pbomb" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=pbomb" title="Documentation">📖</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=pbomb" title="Tests">⚠️</a></td>
<td align="center"><a href="https://github.com/wKovacs64"><img src="https://avatars1.githubusercontent.com/u/1288694?v=4" width="100px;" alt="Justin Hall"/><br /><sub><b>Justin Hall</b></sub></a><br /><a href="#platform-wKovacs64" title="Packaging/porting to new platform">📦</a></td>
</tr>
<tr>
<td align="center"><a href="https://github.com/antoaravinth"><img src="https://avatars1.githubusercontent.com/u/1241511?s=460&v=4" width="100px;" alt="Anto Aravinth"/><br /><sub><b>Anto Aravinth</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=antoaravinth" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=antoaravinth" title="Tests">⚠️</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=antoaravinth" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/JonahMoses"><img src="https://avatars2.githubusercontent.com/u/3462296?v=4" width="100px;" alt="Jonah Moses"/><br /><sub><b>Jonah Moses</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=JonahMoses" title="Documentation">📖</a></td>
<td align="center"><a href="http://team.thebrain.pro"><img src="https://avatars1.githubusercontent.com/u/4002543?v=4" width="100px;" alt="Łukasz Gandecki"/><br /><sub><b>Łukasz Gandecki</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=lgandecki" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=lgandecki" title="Tests">⚠️</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=lgandecki" title="Documentation">📖</a></td>
<td align="center"><a href="https://sompylasar.github.io"><img src="https://avatars2.githubusercontent.com/u/498274?v=4" width="100px;" alt="Ivan Babak"/><br /><sub><b>Ivan Babak</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Asompylasar" title="Bug reports">🐛</a> <a href="#ideas-sompylasar" title="Ideas, Planning, & Feedback">🤔</a></td>
<td align="center"><a href="https://github.com/jday3"><img src="https://avatars3.githubusercontent.com/u/4439618?v=4" width="100px;" alt="Jesse Day"/><br /><sub><b>Jesse Day</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jday3" title="Code">💻</a></td>
<td align="center"><a href="http://gnapse.github.io"><img src="https://avatars0.githubusercontent.com/u/15199?v=4" width="100px;" alt="Ernesto García"/><br /><sub><b>Ernesto García</b></sub></a><br /><a href="#question-gnapse" title="Answering Questions">💬</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=gnapse" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=gnapse" title="Documentation">📖</a></td>
<td align="center"><a href="http://jomaxx.com"><img src="https://avatars2.githubusercontent.com/u/2747424?v=4" width="100px;" alt="Josef Maxx Blake"/><br /><sub><b>Josef Maxx Blake</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jomaxx" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=jomaxx" title="Documentation">📖</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=jomaxx" title="Tests">⚠️</a></td>
</tr>
<tr>
<td align="center"><a href="https://twitter.com/baranovskim"><img src="https://avatars1.githubusercontent.com/u/29602306?v=4" width="100px;" alt="Michal Baranowski"/><br /><sub><b>Michal Baranowski</b></sub></a><br /><a href="#blog-mbaranovski" title="Blogposts">📝</a> <a href="#tutorial-mbaranovski" title="Tutorials">✅</a></td>
<td align="center"><a href="https://github.com/aputhin"><img src="https://avatars3.githubusercontent.com/u/13985684?v=4" width="100px;" alt="Arthur Puthin"/><br /><sub><b>Arthur Puthin</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=aputhin" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/thchia"><img src="https://avatars2.githubusercontent.com/u/21194045?v=4" width="100px;" alt="Thomas Chia"/><br /><sub><b>Thomas Chia</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=thchia" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=thchia" title="Documentation">📖</a></td>
<td align="center"><a href="http://ilegra.com/"><img src="https://avatars3.githubusercontent.com/u/20430611?v=4" width="100px;" alt="Thiago Galvani"/><br /><sub><b>Thiago Galvani</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=thiagopaiva99" title="Documentation">📖</a></td>
<td align="center"><a href="http://Chriswcs.github.io"><img src="https://avatars1.githubusercontent.com/u/19828824?v=4" width="100px;" alt="Christian"/><br /><sub><b>Christian</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=ChrisWcs" title="Tests">⚠️</a></td>
<td align="center"><a href="https://alexkrolick.com"><img src="https://avatars3.githubusercontent.com/u/1571667?v=4" width="100px;" alt="Alex Krolick"/><br /><sub><b>Alex Krolick</b></sub></a><br /><a href="#question-alexkrolick" title="Answering Questions">💬</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=alexkrolick" title="Documentation">📖</a> <a href="#example-alexkrolick" title="Examples">💡</a> <a href="#ideas-alexkrolick" title="Ideas, Planning, & Feedback">🤔</a></td>
<td align="center"><a href="https://github.com/johann-sonntagbauer"><img src="https://avatars3.githubusercontent.com/u/1239401?v=4" width="100px;" alt="Johann Hubert Sonntagbauer"/><br /><sub><b>Johann Hubert Sonntagbauer</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=johann-sonntagbauer" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=johann-sonntagbauer" title="Documentation">📖</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=johann-sonntagbauer" title="Tests">⚠️</a></td>
</tr>
<tr>
<td align="center"><a href="http://www.maddijoyce.com"><img src="https://avatars2.githubusercontent.com/u/2224291?v=4" width="100px;" alt="Maddi Joyce"/><br /><sub><b>Maddi Joyce</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=maddijoyce" title="Code">💻</a></td>
<td align="center"><a href="http://www.vicesoftware.com"><img src="https://avatars2.githubusercontent.com/u/10080111?v=4" width="100px;" alt="Ryan Vice"/><br /><sub><b>Ryan Vice</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=RyanAtViceSoftware" title="Documentation">📖</a></td>
<td align="center"><a href="https://ianwilson.io"><img src="https://avatars1.githubusercontent.com/u/7942604?v=4" width="100px;" alt="Ian Wilson"/><br /><sub><b>Ian Wilson</b></sub></a><br /><a href="#blog-iwilsonq" title="Blogposts">📝</a> <a href="#tutorial-iwilsonq" title="Tutorials">✅</a></td>
<td align="center"><a href="https://github.com/InExtremaRes"><img src="https://avatars2.githubusercontent.com/u/1635491?v=4" width="100px;" alt="Daniel"/><br /><sub><b>Daniel</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3AInExtremaRes" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=InExtremaRes" title="Code">💻</a></td>
<td align="center"><a href="https://twitter.com/Gpx"><img src="https://avatars0.githubusercontent.com/u/767959?v=4" width="100px;" alt="Giorgio Polvara"/><br /><sub><b>Giorgio Polvara</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3AGpx" title="Bug reports">🐛</a> <a href="#ideas-Gpx" title="Ideas, Planning, & Feedback">🤔</a></td>
<td align="center"><a href="https://github.com/jgoz"><img src="https://avatars2.githubusercontent.com/u/132233?v=4" width="100px;" alt="John Gozde"/><br /><sub><b>John Gozde</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jgoz" title="Code">💻</a></td>
<td align="center"><a href="https://twitter.com/SavePointSam"><img src="https://avatars0.githubusercontent.com/u/8203211?v=4" width="100px;" alt="Sam Horton"/><br /><sub><b>Sam Horton</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=SavePointSam" title="Documentation">📖</a> <a href="#example-SavePointSam" title="Examples">💡</a> <a href="#ideas-SavePointSam" title="Ideas, Planning, & Feedback">🤔</a></td>
</tr>
<tr>
<td align="center"><a href="http://www.richardkotze.com"><img src="https://avatars2.githubusercontent.com/u/10452163?v=4" width="100px;" alt="Richard Kotze (mobile)"/><br /><sub><b>Richard Kotze (mobile)</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=rkotze" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/sotobuild"><img src="https://avatars2.githubusercontent.com/u/10819833?v=4" width="100px;" alt="Brahian E. Soto Mercedes"/><br /><sub><b>Brahian E. Soto Mercedes</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=sotobuild" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/bdelaforest"><img src="https://avatars2.githubusercontent.com/u/7151559?v=4" width="100px;" alt="Benoit de La Forest"/><br /><sub><b>Benoit de La Forest</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=bdelaforest" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/thesalah"><img src="https://avatars3.githubusercontent.com/u/6624197?v=4" width="100px;" alt="Salah"/><br /><sub><b>Salah</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=thesalah" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=thesalah" title="Tests">⚠️</a></td>
<td align="center"><a href="http://gordonizer.com"><img src="https://avatars2.githubusercontent.com/u/370054?v=4" width="100px;" alt="Adam Gordon"/><br /><sub><b>Adam Gordon</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Aicfantv" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=icfantv" title="Code">💻</a></td>
<td align="center"><a href="https://silvenon.com"><img src="https://avatars2.githubusercontent.com/u/471278?v=4" width="100px;" alt="Matija Marohnić"/><br /><sub><b>Matija Marohnić</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=silvenon" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/Dajust"><img src="https://avatars3.githubusercontent.com/u/8015514?v=4" width="100px;" alt="Justice Mba"/><br /><sub><b>Justice Mba</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=Dajust" title="Documentation">📖</a></td>
</tr>
<tr>
<td align="center"><a href="https://markpollmann.com/"><img src="https://avatars2.githubusercontent.com/u/5286559?v=4" width="100px;" alt="Mark Pollmann"/><br /><sub><b>Mark Pollmann</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=MarkPollmann" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/ehteshamkafeel"><img src="https://avatars1.githubusercontent.com/u/1213123?v=4" width="100px;" alt="Ehtesham Kafeel"/><br /><sub><b>Ehtesham Kafeel</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=ehteshamkafeel" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=ehteshamkafeel" title="Documentation">📖</a></td>
<td align="center"><a href="http://jpavon.com"><img src="https://avatars2.githubusercontent.com/u/1493505?v=4" width="100px;" alt="Julio Pavón"/><br /><sub><b>Julio Pavón</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jpavon" title="Code">💻</a></td>
<td align="center"><a href="http://www.duncanleung.com/"><img src="https://avatars3.githubusercontent.com/u/1765048?v=4" width="100px;" alt="Duncan L"/><br /><sub><b>Duncan L</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=duncanleung" title="Documentation">📖</a> <a href="#example-duncanleung" title="Examples">💡</a></td>
<td align="center"><a href="https://www.linkedin.com/in/tyagow/?locale=en_US"><img src="https://avatars1.githubusercontent.com/u/700778?v=4" width="100px;" alt="Tiago Almeida"/><br /><sub><b>Tiago Almeida</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=tyagow" title="Documentation">📖</a></td>
<td align="center"><a href="http://rbrtsmith.com/"><img src="https://avatars2.githubusercontent.com/u/4982001?v=4" width="100px;" alt="Robert Smith"/><br /><sub><b>Robert Smith</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Arbrtsmith" title="Bug reports">🐛</a></td>
<td align="center"><a href="https://offbyone.tech"><img src="https://avatars0.githubusercontent.com/u/1700355?v=4" width="100px;" alt="Zach Green"/><br /><sub><b>Zach Green</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=zgreen" title="Documentation">📖</a></td>
</tr>
<tr>
<td align="center"><a href="https://github.com/dadamssg"><img src="https://avatars3.githubusercontent.com/u/881986?v=4" width="100px;" alt="dadamssg"/><br /><sub><b>dadamssg</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=dadamssg" title="Documentation">📖</a></td>
<td align="center"><a href="https://www.yaabed.com/"><img src="https://avatars0.githubusercontent.com/u/8734097?v=4" width="100px;" alt="Yazan Aabed"/><br /><sub><b>Yazan Aabed</b></sub></a><br /><a href="#blog-YazanAabeed" title="Blogposts">📝</a></td>
<td align="center"><a href="https://github.com/timbonicus"><img src="https://avatars0.githubusercontent.com/u/556258?v=4" width="100px;" alt="Tim"/><br /><sub><b>Tim</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Atimbonicus" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=timbonicus" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=timbonicus" title="Documentation">📖</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=timbonicus" title="Tests">⚠️</a></td>
<td align="center"><a href="http://divyanshu.xyz"><img src="https://avatars3.githubusercontent.com/u/6682655?v=4" width="100px;" alt="Divyanshu Maithani"/><br /><sub><b>Divyanshu Maithani</b></sub></a><br /><a href="#tutorial-divyanshu013" title="Tutorials">✅</a> <a href="#video-divyanshu013" title="Videos">📹</a></td>
<td align="center"><a href="https://www.linkedin.com/in/metagrover"><img src="https://avatars2.githubusercontent.com/u/9116042?v=4" width="100px;" alt="Deepak Grover"/><br /><sub><b>Deepak Grover</b></sub></a><br /><a href="#tutorial-metagrover" title="Tutorials">✅</a> <a href="#video-metagrover" title="Videos">📹</a></td>
<td align="center"><a href="https://github.com/eyalcohen4"><img src="https://avatars0.githubusercontent.com/u/16276358?v=4" width="100px;" alt="Eyal Cohen"/><br /><sub><b>Eyal Cohen</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=eyalcohen4" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/petermakowski"><img src="https://avatars3.githubusercontent.com/u/7452681?v=4" width="100px;" alt="Peter Makowski"/><br /><sub><b>Peter Makowski</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=petermakowski" title="Documentation">📖</a></td>
</tr>
<tr>
<td align="center"><a href="https://github.com/Michielnuyts"><img src="https://avatars2.githubusercontent.com/u/20361668?v=4" width="100px;" alt="Michiel Nuyts"/><br /><sub><b>Michiel Nuyts</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=Michielnuyts" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/joeynimu"><img src="https://avatars0.githubusercontent.com/u/1195863?v=4" width="100px;" alt="Joe Ng'ethe"/><br /><sub><b>Joe Ng'ethe</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=joeynimu" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=joeynimu" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/Enikol"><img src="https://avatars3.githubusercontent.com/u/19998290?v=4" width="100px;" alt="Kate"/><br /><sub><b>Kate</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=Enikol" title="Documentation">📖</a></td>
<td align="center"><a href="http://www.seanrparker.com"><img src="https://avatars1.githubusercontent.com/u/11980217?v=4" width="100px;" alt="Sean"/><br /><sub><b>Sean</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=SeanRParker" title="Documentation">📖</a></td>
<td align="center"><a href="http://jlongster.com"><img src="https://avatars2.githubusercontent.com/u/17031?v=4" width="100px;" alt="James Long"/><br /><sub><b>James Long</b></sub></a><br /><a href="#ideas-jlongster" title="Ideas, Planning, & Feedback">🤔</a> <a href="#platform-jlongster" title="Packaging/porting to new platform">📦</a></td>
<td align="center"><a href="https://github.com/hhagely"><img src="https://avatars1.githubusercontent.com/u/10118777?v=4" width="100px;" alt="Herb Hagely"/><br /><sub><b>Herb Hagely</b></sub></a><br /><a href="#example-hhagely" title="Examples">💡</a></td>
<td align="center"><a href="http://www.wendtedesigns.com/"><img src="https://avatars2.githubusercontent.com/u/5779538?v=4" width="100px;" alt="Alex Wendte"/><br /><sub><b>Alex Wendte</b></sub></a><br /><a href="#example-themostcolm" title="Examples">💡</a></td>
</tr>
<tr>
<td align="center"><a href="http://www.aboutmonica.com"><img src="https://avatars0.githubusercontent.com/u/6998954?v=4" width="100px;" alt="Monica Powell"/><br /><sub><b>Monica Powell</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=M0nica" title="Documentation">📖</a></td>
<td align="center"><a href="http://sivkoff.com"><img src="https://avatars1.githubusercontent.com/u/2699953?v=4" width="100px;" alt="Vitaly Sivkov"/><br /><sub><b>Vitaly Sivkov</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=sivkoff" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/weyert"><img src="https://avatars3.githubusercontent.com/u/7049?v=4" width="100px;" alt="Weyert de Boer"/><br /><sub><b>Weyert de Boer</b></sub></a><br /><a href="#ideas-weyert" title="Ideas, Planning, & Feedback">🤔</a> <a href="#review-weyert" title="Reviewed Pull Requests">👀</a></td>
<td align="center"><a href="https://github.com/EstebanMarin"><img src="https://avatars3.githubusercontent.com/u/13613037?v=4" width="100px;" alt="EstebanMarin"/><br /><sub><b>EstebanMarin</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=EstebanMarin" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/vctormb"><img src="https://avatars2.githubusercontent.com/u/13953703?v=4" width="100px;" alt="Victor Martins"/><br /><sub><b>Victor Martins</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=vctormb" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/RoystonS"><img src="https://avatars0.githubusercontent.com/u/19773?v=4" width="100px;" alt="Royston Shufflebotham"/><br /><sub><b>Royston Shufflebotham</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3ARoystonS" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=RoystonS" title="Documentation">📖</a> <a href="#example-RoystonS" title="Examples">💡</a></td>
<td align="center"><a href="https://github.com/chrbala"><img src="https://avatars0.githubusercontent.com/u/6834804?v=4" width="100px;" alt="chrbala"/><br /><sub><b>chrbala</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=chrbala" title="Code">💻</a></td>
</tr>
<tr>
<td align="center"><a href="http://donavon.com"><img src="https://avatars3.githubusercontent.com/u/887639?v=4" width="100px;" alt="Donavon West"/><br /><sub><b>Donavon West</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=donavon" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=donavon" title="Documentation">📖</a> <a href="#ideas-donavon" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=donavon" title="Tests">⚠️</a></td>
<td align="center"><a href="https://github.com/maisano"><img src="https://avatars2.githubusercontent.com/u/689081?v=4" width="100px;" alt="Richard Maisano"/><br /><sub><b>Richard Maisano</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=maisano" title="Code">💻</a></td>
<td align="center"><a href="https://www.marcobiedermann.com"><img src="https://avatars0.githubusercontent.com/u/5244986?v=4" width="100px;" alt="Marco Biedermann"/><br /><sub><b>Marco Biedermann</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=marcobiedermann" title="Code">💻</a> <a href="#maintenance-marcobiedermann" title="Maintenance">🚧</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=marcobiedermann" title="Tests">⚠️</a></td>
<td align="center"><a href="https://github.com/alexzherdev"><img src="https://avatars3.githubusercontent.com/u/93752?v=4" width="100px;" alt="Alex Zherdev"/><br /><sub><b>Alex Zherdev</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Aalexzherdev" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=alexzherdev" title="Code">💻</a></td>
<td align="center"><a href="https://twitter.com/Andrewmat"><img src="https://avatars0.githubusercontent.com/u/5133846?v=4" width="100px;" alt="André Matulionis dos Santos"/><br /><sub><b>André Matulionis dos Santos</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=Andrewmat" title="Code">💻</a> <a href="#example-Andrewmat" title="Examples">💡</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=Andrewmat" title="Tests">⚠️</a></td>
<td align="center"><a href="https://github.com/FredyC"><img src="https://avatars0.githubusercontent.com/u/1096340?v=4" width="100px;" alt="Daniel K."/><br /><sub><b>Daniel K.</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3AFredyC" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=FredyC" title="Code">💻</a> <a href="#ideas-FredyC" title="Ideas, Planning, & Feedback">🤔</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=FredyC" title="Tests">⚠️</a> <a href="#review-FredyC" title="Reviewed Pull Requests">👀</a></td>
<td align="center"><a href="https://github.com/mohamedmagdy17593"><img src="https://avatars0.githubusercontent.com/u/40938625?v=4" width="100px;" alt="mohamedmagdy17593"/><br /><sub><b>mohamedmagdy17593</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=mohamedmagdy17593" title="Code">💻</a></td>
</tr>
<tr>
<td align="center"><a href="http://lorensr.me"><img src="https://avatars2.githubusercontent.com/u/251288?v=4" width="100px;" alt="Loren ☺️"/><br /><sub><b>Loren ☺️</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=lorensr" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/MarkFalconbridge"><img src="https://avatars1.githubusercontent.com/u/20678943?v=4" width="100px;" alt="MarkFalconbridge"/><br /><sub><b>MarkFalconbridge</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3AMarkFalconbridge" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=MarkFalconbridge" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/viniciusavieira"><img src="https://avatars0.githubusercontent.com/u/2073019?v=4" width="100px;" alt="Vinicius"/><br /><sub><b>Vinicius</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=viniciusavieira" title="Documentation">📖</a> <a href="#example-viniciusavieira" title="Examples">💡</a></td>
<td align="center"><a href="https://github.com/pschyma"><img src="https://avatars2.githubusercontent.com/u/2489928?v=4" width="100px;" alt="Peter Schyma"/><br /><sub><b>Peter Schyma</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=pschyma" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/ianschmitz"><img src="https://avatars1.githubusercontent.com/u/6355370?v=4" width="100px;" alt="Ian Schmitz"/><br /><sub><b>Ian Schmitz</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=ianschmitz" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/joual"><img src="https://avatars0.githubusercontent.com/u/157877?v=4" width="100px;" alt="Joel Marcotte"/><br /><sub><b>Joel Marcotte</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Ajoual" title="Bug reports">🐛</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=joual" title="Tests">⚠️</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=joual" title="Code">💻</a></td>
<td align="center"><a href="http://aledustet.com"><img src="https://avatars3.githubusercontent.com/u/2413802?v=4" width="100px;" alt="Alejandro Dustet"/><br /><sub><b>Alejandro Dustet</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/issues?q=author%3Aaledustet" title="Bug reports">🐛</a></td>
</tr>
<tr>
<td align="center"><a href="https://github.com/bcarroll22"><img src="https://avatars2.githubusercontent.com/u/11020406?v=4" width="100px;" alt="Brandon Carroll"/><br /><sub><b>Brandon Carroll</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=bcarroll22" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/lucas0707"><img src="https://avatars1.githubusercontent.com/u/26284338?v=4" width="100px;" alt="Lucas Machado"/><br /><sub><b>Lucas Machado</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=lucas0707" title="Documentation">📖</a></td>
<td align="center"><a href="http://pascalduez.me"><img src="https://avatars3.githubusercontent.com/u/335467?v=4" width="100px;" alt="Pascal Duez"/><br /><sub><b>Pascal Duez</b></sub></a><br /><a href="#platform-pascalduez" title="Packaging/porting to new platform">📦</a></td>
<td align="center"><a href="https://twitter.com/minh_ngvyen"><img src="https://avatars3.githubusercontent.com/u/2852660?v=4" width="100px;" alt="Minh Nguyen"/><br /><sub><b>Minh Nguyen</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=NMinhNguyen" title="Code">💻</a></td>
<td align="center"><a href="http://iababy46.blogspot.tw/"><img src="https://avatars0.githubusercontent.com/u/11155585?v=4" width="100px;" alt="LiaoJimmy"/><br /><sub><b>LiaoJimmy</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=LiaoJimmy" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/threepointone"><img src="https://avatars2.githubusercontent.com/u/18808?v=4" width="100px;" alt="Sunil Pai"/><br /><sub><b>Sunil Pai</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=threepointone" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=threepointone" title="Tests">⚠️</a></td>
<td align="center"><a href="http://twitter.com/dan_abramov"><img src="https://avatars0.githubusercontent.com/u/810438?v=4" width="100px;" alt="Dan Abramov"/><br /><sub><b>Dan Abramov</b></sub></a><br /><a href="#review-gaearon" title="Reviewed Pull Requests">👀</a></td>
</tr>
<tr>
<td align="center"><a href="https://github.com/ChristianMurphy"><img src="https://avatars3.githubusercontent.com/u/3107513?v=4" width="100px;" alt="Christian Murphy"/><br /><sub><b>Christian Murphy</b></sub></a><br /><a href="#infra-ChristianMurphy" title="Infrastructure (Hosting, Build-Tools, etc)">🚇</a></td>
<td align="center"><a href="https://jeetiss.github.io/"><img src="https://avatars1.githubusercontent.com/u/6726016?v=4" width="100px;" alt="Ivakhnenko Dmitry"/><br /><sub><b>Ivakhnenko Dmitry</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jeetiss" title="Code">💻</a></td>
<td align="center"><a href="https://ghuser.io/jamesgeorge007"><img src="https://avatars2.githubusercontent.com/u/25279263?v=4" width="100px;" alt="James George"/><br /><sub><b>James George</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=jamesgeorge007" title="Documentation">📖</a></td>
<td align="center"><a href="https://joaofernandes.me/"><img src="https://avatars1.githubusercontent.com/u/1075053?v=4" width="100px;" alt="João Fernandes"/><br /><sub><b>João Fernandes</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=JSFernandes" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/alejandroperea"><img src="https://avatars3.githubusercontent.com/u/6084749?v=4" width="100px;" alt="Alejandro Perea"/><br /><sub><b>Alejandro Perea</b></sub></a><br /><a href="#review-alejandroperea" title="Reviewed Pull Requests">👀</a></td>
<td align="center"><a href="https://nickmccurdy.com/"><img src="https://avatars0.githubusercontent.com/u/927220?v=4" width="100px;" alt="Nick McCurdy"/><br /><sub><b>Nick McCurdy</b></sub></a><br /><a href="#review-nickmccurdy" title="Reviewed Pull Requests">👀</a> <a href="#question-nickmccurdy" title="Answering Questions">💬</a></td>
<td align="center"><a href="https://twitter.com/sebsilbermann"><img src="https://avatars3.githubusercontent.com/u/12292047?v=4" width="100px;" alt="Sebastian Silbermann"/><br /><sub><b>Sebastian Silbermann</b></sub></a><br /><a href="#review-eps1lon" title="Reviewed Pull Requests">👀</a></td>
</tr>
<tr>
<td align="center"><a href="https://afontcu.dev"><img src="https://avatars0.githubusercontent.com/u/9197791?v=4" width="100px;" alt="Adrià Fontcuberta"/><br /><sub><b>Adrià Fontcuberta</b></sub></a><br /><a href="#review-afontcu" title="Reviewed Pull Requests">👀</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=afontcu" title="Documentation">📖</a></td>
<td align="center"><a href="https://blog.johnnyreilly.com/"><img src="https://avatars0.githubusercontent.com/u/1010525?v=4" width="100px;" alt="John Reilly"/><br /><sub><b>John Reilly</b></sub></a><br /><a href="#review-johnnyreilly" title="Reviewed Pull Requests">👀</a></td>
<td align="center"><a href="https://michaeldeboey.be"><img src="https://avatars3.githubusercontent.com/u/6643991?v=4" width="100px;" alt="Michaël De Boey"/><br /><sub><b>Michaël De Boey</b></sub></a><br /><a href="#review-MichaelDeBoey" title="Reviewed Pull Requests">👀</a></td>
<td align="center"><a href="https://cimbul.com"><img src="https://avatars2.githubusercontent.com/u/927923?v=4" width="100px;" alt="Tim Yates"/><br /><sub><b>Tim Yates</b></sub></a><br /><a href="#review-cimbul" title="Reviewed Pull Requests">👀</a></td>
<td align="center"><a href="https://github.com/eventualbuddha"><img src="https://avatars3.githubusercontent.com/u/1938?v=4" width="100px;" alt="Brian Donovan"/><br /><sub><b>Brian Donovan</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=eventualbuddha" title="Code">💻</a></td>
<td align="center"><a href="https://github.com/JaysQubeXon"><img src="https://avatars1.githubusercontent.com/u/18309230?v=4" width="100px;" alt="Noam Gabriel Jacobson"/><br /><sub><b>Noam Gabriel Jacobson</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=JaysQubeXon" title="Documentation">📖</a></td>
<td align="center"><a href="https://github.com/rvdkooy"><img src="https://avatars1.githubusercontent.com/u/4119960?v=4" width="100px;" alt="Ronald van der Kooij"/><br /><sub><b>Ronald van der Kooij</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=rvdkooy" title="Tests">⚠️</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=rvdkooy" title="Code">💻</a></td>
</tr>
<tr>
<td align="center"><a href="https://github.com/aayushrajvanshi"><img src="https://avatars0.githubusercontent.com/u/14968551?v=4" width="100px;" alt="Aayush Rajvanshi"/><br /><sub><b>Aayush Rajvanshi</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=aayushrajvanshi" title="Documentation">📖</a></td>
<td align="center"><a href="https://elyalamillo.com"><img src="https://avatars2.githubusercontent.com/u/24350492?v=4" width="100px;" alt="Ely Alamillo"/><br /><sub><b>Ely Alamillo</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=ely-alamillo" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=ely-alamillo" title="Tests">⚠️</a></td>
<td align="center"><a href="https://github.com/danieljcafonso"><img src="https://avatars3.githubusercontent.com/u/35337607?v=4" width="100px;" alt="Daniel Afonso"/><br /><sub><b>Daniel Afonso</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=danieljcafonso" title="Code">💻</a> <a href="https://github.com/testing-library/react-testing-library/commits?author=danieljcafonso" title="Tests">⚠️</a></td>
<td align="center"><a href="http://www.laurensbosscher.nl"><img src="https://avatars0.githubusercontent.com/u/13363196?v=4" width="100px;" alt="Laurens Bosscher"/><br /><sub><b>Laurens Bosscher</b></sub></a><br /><a href="https://github.com/testing-library/react-testing-library/commits?author=LaurensBosscher" title="Code">💻</a></td>
</tr>
</table>
<!-- ALL-CONTRIBUTORS-LIST:END -->
This project follows the [all-contributors][all-contributors] specification.
Contributions of any kind welcome!
## LICENSE
[MIT](LICENSE)
<!-- prettier-ignore-start -->
[npm]: https://www.npmjs.com/
[node]: https://nodejs.org
[build-badge]: https://img.shields.io/travis/testing-library/react-testing-library.svg?style=flat-square
[build]: https://travis-ci.org/testing-library/react-testing-library
[coverage-badge]: https://img.shields.io/codecov/c/github/testing-library/react-testing-library.svg?style=flat-square
[coverage]: https://codecov.io/github/testing-library/react-testing-library
[version-badge]: https://img.shields.io/npm/v/@testing-library/react.svg?style=flat-square
[package]: https://www.npmjs.com/package/@testing-library/react
[downloads-badge]: https://img.shields.io/npm/dm/@testing-library/react.svg?style=flat-square
[npmtrends]: http://www.npmtrends.com/@testing-library/react
[spectrum-badge]: https://withspectrum.github.io/badge/badge.svg
[spectrum]: https://spectrum.chat/testing-library
[license-badge]: https://img.shields.io/npm/l/@testing-library/react.svg?style=flat-square
[license]: https://github.com/testing-library/react-testing-library/blob/master/LICENSE
[prs-badge]: https://img.shields.io/badge/PRs-welcome-brightgreen.svg?style=flat-square
[prs]: http://makeapullrequest.com
[coc-badge]: https://img.shields.io/badge/code%20of-conduct-ff69b4.svg?style=flat-square
[coc]: https://github.com/testing-library/react-testing-library/blob/master/CODE_OF_CONDUCT.md
[github-watch-badge]: https://img.shields.io/github/watchers/testing-library/react-testing-library.svg?style=social
[github-watch]: https://github.com/testing-library/react-testing-library/watchers
[github-star-badge]: https://img.shields.io/github/stars/testing-library/react-testing-library.svg?style=social
[github-star]: https://github.com/testing-library/react-testing-library/stargazers
[twitter]: https://twitter.com/intent/tweet?text=Check%20out%20react-testing-library%20by%20%40@TestingLib%20https%3A%2F%2Fgithub.com%2Ftesting-library%2Freact-testing-library%20%F0%9F%91%8D
[twitter-badge]: https://img.shields.io/twitter/url/https/github.com/testing-library/react-testing-library.svg?style=social
[emojis]: https://github.com/all-contributors/all-contributors#emoji-key
[all-contributors]: https://github.com/all-contributors/all-contributors
[guiding-principle]: https://twitter.com/kentcdodds/status/977018512689455106
[bugs]: https://github.com/testing-library/react-testing-library/issues?q=is%3Aissue+is%3Aopen+label%3Abug+sort%3Acreated-desc
[requests]: https://github.com/testing-library/react-testing-library/issues?q=is%3Aissue+sort%3Areactions-%2B1-desc+label%3Aenhancement+is%3Aopen
[good-first-issue]: https://github.com/testing-library/react-testing-library/issues?utf8=✓&q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc+label%3A"good+first+issue"+
[reactiflux]: https://www.reactiflux.com/
[stackoverflow]: https://stackoverflow.com/questions/tagged/react-testing-library
[react-hooks-testing-library]: https://github.com/testing-library/react-hooks-testing-library
<!-- prettier-ignore-end -->

4
cleanup-after-each.js
Unescape View File

@ -0,0 +1,4 @@
console.warn(
'The module `@testing-library/react/cleanup-after-each` has been deprecated and no longer does anything (it is not needed). You no longer need to import this module and can safely remove any import or configuration which imports this module',
)
/* eslint no-console:0 */

1
dont-cleanup-after-each.js
Unescape View File

@ -0,0 +1 @@
process.env.RTL_SKIP_AUTO_CLEANUP = true

70
other/MAINTAINING.md
Unescape View File

@ -0,0 +1,70 @@
# Maintaining
This is documentation for maintainers of this project.
## Code of Conduct
Please review, understand, and be an example of it. Violations of the code of
conduct are taken seriously, even (especially) for maintainers.
## Issues
We want to support and build the community. We do that best by helping people
learn to solve their own problems. We have an issue template and hopefully most
folks follow it. If it's not clear what the issue is, invite them to create a
minimal reproduction of what they're trying to accomplish or the bug they think
they've found.
Once it's determined that a code change is necessary, point people to
[makeapullrequest.com](http://makeapullrequest.com) and invite them to make a
pull request. If they're the one who needs the feature, they're the one who can
build it. If they need some hand holding and you have time to lend a hand,
please do so. It's an investment into another human being, and an investment
into a potential maintainer.
Remember that this is open source, so the code is not yours, it's ours. If
someone needs a change in the codebase, you don't have to make it happen
yourself. Commit as much time to the project as you want/need to. Nobody can ask
any more of you than that.
## Pull Requests
As a maintainer, you're fine to make your branches on the main repo or on your
own fork. Either way is fine.
When we receive a pull request, a travis build is kicked off automatically (see
the `.travis.yml` for what runs in the travis build). We avoid merging anything
that breaks the travis build.
Please review PRs and focus on the code rather than the individual. You never
know when this is someone's first ever PR and we want their experience to be as
positive as possible, so be uplifting and constructive.
When you merge the pull request, 99% of the time you should use the
[Squash and merge](https://help.github.com/articles/merging-a-pull-request/)
feature. This keeps our git history clean, but more importantly, this allows us
to make any necessary changes to the commit message so we release what we want
to release. See the next section on Releases for more about that.
## Release
Our releases are automatic. They happen whenever code lands into `master`. A
travis build gets kicked off and if it's successful, a tool called
[`semantic-release`](https://github.com/semantic-release/semantic-release) is
used to automatically publish a new release to npm as well as a changelog to
GitHub. It is only able to determine the version and whether a release is
necessary by the git commit messages. With this in mind, **please brush up on
[the commit message convention][commit] which drives our releases.**
> One important note about this: Please make sure that commit messages do NOT
> contain the words "BREAKING CHANGE" in them unless we want to push a major
> version. I've been burned by this more than once where someone will include
> "BREAKING CHANGE: None" and it will end up releasing a new major version. Not
> a huge deal honestly, but kind of annoying...
## Thanks!
Thank you so much for helping to maintain this project!
[commit]:
https://github.com/conventional-changelog-archived-repos/conventional-changelog-angular/blob/ed32559941719a130bb0327f886d6a32a8cbc2ba/convention.md

12
other/USERS.md
Unescape View File

@ -0,0 +1,12 @@
# Users
If you or your company uses this project, add your name to this list! Eventually
we may have a website to showcase these (wanna build it!?)
> No users have been added yet!
<!--
This file should just be a bulleted list like this:
- [Company/Project/Person](https://example.com) uses it in [some app](https://example.com)
-->

BIN
other/cheat-sheet.pdf
View File

Binary file not shown.

BIN
other/goat.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.6 KiB

44
other/manual-releases.md
Unescape View File

@ -0,0 +1,44 @@
# manual-releases
This project has an automated release set up. So things are only released when
there are useful changes in the code that justify a release. But sometimes
things get messed up one way or another and we need to trigger the release
ourselves. When this happens, simply bump the number below and commit that with
the following commit message based on your needs:
**Major**
```
fix(release): manually release a major version
There was an issue with a major release, so this manual-releases.md
change is to release a new major version.
Reference: #<the number of a relevant pull request, issue, or commit>
BREAKING CHANGE: <mention any relevant breaking changes (this is what triggers the major version change so don't skip this!)>
```
**Minor**
```
feat(release): manually release a minor version
There was an issue with a minor release, so this manual-releases.md
change is to release a new minor version.
Reference: #<the number of a relevant pull request, issue, or commit>
```
**Patch**
```
fix(release): manually release a patch version
There was an issue with a patch release, so this manual-releases.md
change is to release a new patch version.
Reference: #<the number of a relevant pull request, issue, or commit>
```
The number of times we've had to do a manual release is: 4

BIN
other/testingjavascript.jpg
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 196 KiB

88
package.json
Unescape View File

@ -0,0 +1,88 @@
{
"name": "@testing-library/react",
"version": "0.0.0-semantically-released",
"description": "Simple and complete React DOM testing utilities that encourage good testing practices.",
"main": "dist/index.js",
"module": "dist/@testing-library/react.esm.js",
"engines": {
"node": ">=8"
},
"scripts": {
"prebuild": "rimraf dist",
"build": "npm-run-all --parallel build:main build:bundle:main build:bundle:pure",
"build:main": "kcd-scripts build --no-clean",
"build:bundle:main": "kcd-scripts build --bundle --no-clean",
"build:bundle:pure": "cross-env BUILD_FILENAME_SUFFIX=.pure BUILD_INPUT=src/pure.js kcd-scripts build --bundle --no-clean",
"lint": "kcd-scripts lint",
"test": "kcd-scripts test",
"test:update": "npm test -- --updateSnapshot --coverage",
"validate": "kcd-scripts validate",
"setup": "npm install && npm run validate -s"
},
"husky": {
"hooks": {
"pre-commit": "kcd-scripts pre-commit"
}
},
"files": [
"dist",
"cleanup-after-each.js",
"dont-cleanup-after-each.js",
"pure.js"
],
"keywords": [
"testing",
"react",
"ui",
"dom",
"jsdom",
"unit",
"integration",
"functional",
"end-to-end",
"e2e"
],
"author": "Kent C. Dodds <kent@doddsfamily.us> (http://kentcdodds.com/)",
"license": "MIT",
"dependencies": {
"@babel/runtime": "^7.6.0",
"@testing-library/dom": "^6.3.0",
"@types/testing-library__react": "^9.1.0"
},
"devDependencies": {
"@reach/router": "^1.2.1",
"@testing-library/jest-dom": "^4.1.0",
"cross-env": "^6.0.0",
"kcd-scripts": "^1.7.0",
"npm-run-all": "^4.1.5",
"react": "^16.9.0",
"react-dom": "^16.9.0",
"rimraf": "^3.0.0"
},
"peerDependencies": {
"react": "*",
"react-dom": "*"
},
"eslintConfig": {
"extends": "./node_modules/kcd-scripts/eslint.js",
"rules": {
"react/prop-types": "off",
"import/no-unassigned-import": "off",
"import/named": "off"
}
},
"eslintIgnore": [
"node_modules",
"coverage",
"dist",
"*.d.ts"
],
"repository": {
"type": "git",
"url": "https://github.com/testing-library/react-testing-library.git"
},
"bugs": {
"url": "https://github.com/testing-library/react-testing-library/issues"
},
"homepage": "https://github.com/testing-library/react-testing-library#readme"
}

2
pure.js
Unescape View File

@ -0,0 +1,2 @@
// makes it so people can import from '@testing-library/react/pure'
module.exports = require('./dist/pure')

8
src/__mocks__/axios.js
Unescape View File

@ -0,0 +1,8 @@
module.exports = {
get: jest.fn(() => Promise.resolve({data: {}})),
}
// Note:
// For now we don't need any other method (POST/PUT/PATCH), what we have already works fine.
// We will add more methods only if we need to.
// For reference please read: https://github.com/testing-library/react-testing-library/issues/2

12
src/__tests__/__snapshots__/render.js.snap
Unescape View File

@ -0,0 +1,12 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`supports fragments 1`] = `
<DocumentFragment>
<div>
<code>
DocumentFragment
</code>
is pretty cool!
</div>
</DocumentFragment>
`;

45
src/__tests__/act.js
Unescape View File

@ -0,0 +1,45 @@
import React from 'react'
import {render, fireEvent} from '../'
test('render calls useEffect immediately', () => {
const effectCb = jest.fn()
function MyUselessComponent() {
React.useEffect(effectCb)
return null
}
render(<MyUselessComponent />)
expect(effectCb).toHaveBeenCalledTimes(1)
})
test('findByTestId returns the element', async () => {
const ref = React.createRef()
const {findByTestId} = render(<div ref={ref} data-testid="foo" />)
expect(await findByTestId('foo')).toBe(ref.current)
})
test('fireEvent triggers useEffect calls', () => {
const effectCb = jest.fn()
function Counter() {
React.useEffect(effectCb)
const [count, setCount] = React.useState(0)
return <button onClick={() => setCount(count + 1)}>{count}</button>
}
const {
container: {firstChild: buttonNode},
} = render(<Counter />)
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(<MyUselessComponent />, {hydrate: true})
expect(effectCb).toHaveBeenCalledTimes(1)
})

18
src/__tests__/auto-cleanup-skip.js
Unescape View File

@ -0,0 +1,18 @@
import React from 'react'
let render
beforeAll(() => {
process.env.RTL_SKIP_AUTO_CLEANUP = 'true'
const rtl = require('../')
render = rtl.render
})
// This one verifies that if RTL_SKIP_AUTO_CLEANUP is set
// then we DON'T auto-wire up the afterEach for folks
test('first', () => {
render(<div>hi</div>)
})
test('second', () => {
expect(document.body.innerHTML).toEqual('<div><div>hi</div></div>')
})

13
src/__tests__/auto-cleanup.js
Unescape View File

@ -0,0 +1,13 @@
import React from 'react'
import {render} from '../'
// This just verifies that by importing RTL in an
// environment which supports afterEach (like jest)
// we'll get automatic cleanup between tests.
test('first', () => {
render(<div>hi</div>)
})
test('second', () => {
expect(document.body.innerHTML).toEqual('')
})

28
src/__tests__/cleanup.js
Unescape View File

@ -0,0 +1,28 @@
import React from 'react'
import {render, cleanup} from '../'
test('cleans up the document', () => {
const spy = jest.fn()
const divId = 'my-div'
class Test extends React.Component {
componentWillUnmount() {
expect(document.getElementById(divId)).toBeInTheDocument()
spy()
}
render() {
return <div id={divId} />
}
}
render(<Test />)
cleanup()
expect(document.body.innerHTML).toBe('')
expect(spy).toHaveBeenCalledTimes(1)
})
test('cleanup does not error when an element is not a child', () => {
render(<div />, {container: document.createElement('div')})
cleanup()
})

39
src/__tests__/debug.js
Unescape View File

@ -0,0 +1,39 @@
import React from 'react'
import {render} from '../'
beforeEach(() => {
jest.spyOn(console, 'log').mockImplementation(() => {})
})
afterEach(() => {
console.log.mockRestore()
})
test('debug pretty prints the container', () => {
const HelloWorld = () => <h1>Hello World</h1>
const {debug} = render(<HelloWorld />)
debug()
expect(console.log).toHaveBeenCalledTimes(1)
expect(console.log).toHaveBeenCalledWith(
expect.stringContaining('Hello World'),
)
})
test('debug pretty prints multiple containers', () => {
const HelloWorld = () => (
<>
<h1 data-testid="testId">Hello World</h1>
<h1 data-testid="testId">Hello World</h1>
</>
)
const {getAllByTestId, debug} = render(<HelloWorld />)
const multipleElements = getAllByTestId('testId')
debug(multipleElements)
expect(console.log).toHaveBeenCalledTimes(2)
expect(console.log).toHaveBeenCalledWith(
expect.stringContaining('Hello World'),
)
})
/* eslint no-console:0 */

39
src/__tests__/end-to-end.js
Unescape View File

@ -0,0 +1,39 @@
import React from 'react'
import {render, wait} from '../'
const fetchAMessage = () =>
new Promise(resolve => {
// we are using random timeout here to simulate a real-time example
// of an async operation calling a callback at a non-deterministic time
const randomTimeout = Math.floor(Math.random() * 100)
setTimeout(() => {
resolve({returnedMessage: 'Hello World'})
}, randomTimeout)
})
class ComponentWithLoader extends React.Component {
state = {loading: true}
async componentDidMount() {
const data = await fetchAMessage()
this.setState({data, loading: false}) // eslint-disable-line
}
render() {
if (this.state.loading) {
return <div>Loading...</div>
}
return (
<div data-testid="message">
Loaded this message: {this.state.data.returnedMessage}!
</div>
)
}
}
test('it waits for the data to be loaded', async () => {
const {queryByText, queryByTestId} = render(<ComponentWithLoader />)
expect(queryByText('Loading...')).toBeTruthy()
await wait(() => expect(queryByText('Loading...')).toBeNull())
expect(queryByTestId('message').textContent).toMatch(/Hello World/)
})

178
src/__tests__/events.js
Unescape View File

@ -0,0 +1,178 @@
import React from 'react'
import {render, fireEvent} from '../'
const eventTypes = [
{
type: 'Clipboard',
events: ['copy', 'paste'],
elementType: 'input',
},
{
type: 'Composition',
events: ['compositionEnd', 'compositionStart', 'compositionUpdate'],
elementType: 'input',
},
{
type: 'Keyboard',
events: ['keyDown', 'keyPress', 'keyUp'],
elementType: 'input',
init: {keyCode: 13},
},
{
type: 'Focus',
events: ['focus', 'blur'],
elementType: 'input',
},
{
type: 'Form',
events: ['focus', 'blur'],
elementType: 'input',
},
{
type: 'Focus',
events: ['input', 'invalid'],
elementType: 'input',
},
{
type: 'Focus',
events: ['submit'],
elementType: 'form',
},
{
type: 'Mouse',
events: [
'click',
'contextMenu',
'doubleClick',
'drag',
'dragEnd',
'dragEnter',
'dragExit',
'dragLeave',
'dragOver',
'dragStart',
'drop',
'mouseDown',
'mouseEnter',
'mouseLeave',
'mouseMove',
'mouseOut',
'mouseOver',
'mouseUp',
],
elementType: 'button',
},
{
type: 'Selection',
events: ['select'],
elementType: 'input',
},
{
type: 'Touch',
events: ['touchCancel', 'touchEnd', 'touchMove', 'touchStart'],
elementType: 'button',
},
{
type: 'UI',
events: ['scroll'],
elementType: 'div',
},
{
type: 'Wheel',
events: ['wheel'],
elementType: 'div',
},
{
type: 'Media',
events: [
'abort',
'canPlay',
'canPlayThrough',
'durationChange',
'emptied',
'encrypted',
'ended',
'error',
'loadedData',
'loadedMetadata',
'loadStart',
'pause',
'play',
'playing',
'progress',
'rateChange',
'seeked',
'seeking',
'stalled',
'suspend',
'timeUpdate',
'volumeChange',
'waiting',
],
elementType: 'video',
},
{
type: 'Image',
events: ['load', 'error'],
elementType: 'img',
},
{
type: 'Animation',
events: ['animationStart', 'animationEnd', 'animationIteration'],
elementType: 'div',
},
{
type: 'Transition',
events: ['transitionEnd'],
elementType: 'div',
},
]
eventTypes.forEach(({type, events, elementType, init}) => {
describe(`${type} Events`, () => {
events.forEach(eventName => {
const propName = `on${eventName.charAt(0).toUpperCase()}${eventName.slice(
1,
)}`
it(`triggers ${propName}`, () => {
const ref = React.createRef()
const spy = jest.fn()
render(
React.createElement(elementType, {
[propName]: spy,
ref,
}),
)
fireEvent[eventName](ref.current, init)
expect(spy).toHaveBeenCalledTimes(1)
})
})
})
})
test('onChange works', () => {
const handleChange = jest.fn()
const {
container: {firstChild: input},
} = render(<input onChange={handleChange} />)
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(<button onClick={handleEvent} />)
fireEvent(
button,
new Event('MouseEvent', {
bubbles: true,
cancelable: true,
button: 0,
}),
)
})

39
src/__tests__/multi-base.js
Unescape View File

@ -0,0 +1,39 @@
import React from 'react'
import {render} from '../'
// these are created once per test suite and reused for each case
let treeA, treeB
beforeAll(() => {
treeA = document.createElement('div')
treeB = document.createElement('div')
document.body.appendChild(treeA)
document.body.appendChild(treeB)
})
afterAll(() => {
treeA.parentNode.removeChild(treeA)
treeB.parentNode.removeChild(treeB)
})
test('baseElement isolates trees from one another', () => {
const {getByText: getByTextInA} = render(<div>Jekyll</div>, {
baseElement: treeA,
})
const {getByText: getByTextInB} = render(<div>Hyde</div>, {
baseElement: treeB,
})
expect(() => getByTextInA('Jekyll')).not.toThrow(
'Unable to find an element with the text: Jekyll.',
)
expect(() => getByTextInB('Jekyll')).toThrow(
'Unable to find an element with the text: Jekyll.',
)
expect(() => getByTextInA('Hyde')).toThrow(
'Unable to find an element with the text: Hyde.',
)
expect(() => getByTextInB('Hyde')).not.toThrow(
'Unable to find an element with the text: Hyde.',
)
})

76
src/__tests__/new-act.js
Unescape View File

@ -0,0 +1,76 @@
let asyncAct
jest.mock('react-dom/test-utils', () => ({
act: cb => {
return cb()
},
}))
beforeEach(() => {
jest.resetModules()
asyncAct = require('../act-compat').asyncAct
jest.spyOn(console, 'error').mockImplementation(() => {})
})
afterEach(() => {
console.error.mockRestore()
})
test('async act works when it does not exist (older versions of react)', async () => {
const callback = jest.fn()
await asyncAct(async () => {
await Promise.resolve()
await callback()
})
expect(console.error).toHaveBeenCalledTimes(0)
expect(callback).toHaveBeenCalledTimes(1)
callback.mockClear()
console.error.mockClear()
await asyncAct(async () => {
await Promise.resolve()
await callback()
})
expect(console.error).toHaveBeenCalledTimes(0)
expect(callback).toHaveBeenCalledTimes(1)
})
test('async act recovers from errors', async () => {
try {
await asyncAct(async () => {
await null
throw new Error('test error')
})
} catch (err) {
console.error('call console.error')
}
expect(console.error).toHaveBeenCalledTimes(1)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"call console.error",
],
]
`)
})
test('async act recovers from sync errors', async () => {
try {
await asyncAct(() => {
throw new Error('test error')
})
} catch (err) {
console.error('call console.error')
}
expect(console.error).toHaveBeenCalledTimes(1)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"call console.error",
],
]
`)
})
/* eslint no-console:0 */

80
src/__tests__/no-act.js
Unescape View File

@ -0,0 +1,80 @@
let act, asyncAct
beforeEach(() => {
jest.resetModules()
act = require('..').act
asyncAct = require('../act-compat').asyncAct
jest.spyOn(console, 'error').mockImplementation(() => {})
})
afterEach(() => {
console.error.mockRestore()
})
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(console.error).toHaveBeenCalledTimes(0)
})
test('async act works when it does not exist (older versions of react)', async () => {
const callback = jest.fn()
await asyncAct(async () => {
await Promise.resolve()
await callback()
})
expect(console.error).toHaveBeenCalledTimes(0)
expect(callback).toHaveBeenCalledTimes(1)
callback.mockClear()
console.error.mockClear()
await asyncAct(async () => {
await Promise.resolve()
await callback()
})
expect(console.error).toHaveBeenCalledTimes(0)
expect(callback).toHaveBeenCalledTimes(1)
})
test('async act recovers from errors', async () => {
try {
await asyncAct(async () => {
await null
throw new Error('test error')
})
} catch (err) {
console.error('call console.error')
}
expect(console.error).toHaveBeenCalledTimes(1)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"call console.error",
],
]
`)
})
test('async act recovers from sync errors', async () => {
try {
await asyncAct(() => {
throw new Error('test error')
})
} catch (err) {
console.error('call console.error')
}
expect(console.error).toHaveBeenCalledTimes(1)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"call console.error",
],
]
`)
})
/* eslint no-console:0 */

142
src/__tests__/old-act.js
Unescape View File

@ -0,0 +1,142 @@
let asyncAct
beforeEach(() => {
jest.resetModules()
asyncAct = require('../act-compat').asyncAct
jest.spyOn(console, 'error').mockImplementation(() => {})
})
afterEach(() => {
console.error.mockRestore()
})
jest.mock('react-dom/test-utils', () => ({
act: cb => {
cb()
return {
then() {
console.error(
'Warning: Do not await the result of calling ReactTestUtils.act(...), it is not a Promise.',
)
},
}
},
}))
test('async act works even when the act is an old one', async () => {
const callback = jest.fn()
await asyncAct(async () => {
console.error('sigil')
await Promise.resolve()
await callback()
console.error('sigil')
})
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"sigil",
],
Array [
"It looks like you're using a version of react-dom that supports the \\"act\\" function, but not an awaitable version of \\"act\\" which you will need. Please upgrade to at least react-dom@16.9.0 to remove this warning.",
],
Array [
"sigil",
],
]
`)
expect(callback).toHaveBeenCalledTimes(1)
// and it doesn't warn you twice
callback.mockClear()
console.error.mockClear()
await asyncAct(async () => {
await Promise.resolve()
await callback()
})
expect(console.error).toHaveBeenCalledTimes(0)
expect(callback).toHaveBeenCalledTimes(1)
})
test('async act recovers from async errors', async () => {
try {
await asyncAct(async () => {
await null
throw new Error('test error')
})
} catch (err) {
console.error('call console.error')
}
expect(console.error).toHaveBeenCalledTimes(2)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"It looks like you're using a version of react-dom that supports the \\"act\\" function, but not an awaitable version of \\"act\\" which you will need. Please upgrade to at least react-dom@16.9.0 to remove this warning.",
],
Array [
"call console.error",
],
]
`)
})
test('async act recovers from sync errors', async () => {
try {
await asyncAct(() => {
throw new Error('test error')
})
} catch (err) {
console.error('call console.error')
}
expect(console.error).toHaveBeenCalledTimes(1)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
"call console.error",
],
]
`)
})
test('async act can handle any sort of console.error', async () => {
await asyncAct(async () => {
console.error({error: 'some error'})
await null
})
expect(console.error).toHaveBeenCalledTimes(2)
expect(console.error.mock.calls).toMatchInlineSnapshot(`
Array [
Array [
Object {
"error": "some error",
},
],
Array [
"It looks like you're using a version of react-dom that supports the \\"act\\" function, but not an awaitable version of \\"act\\" which you will need. Please upgrade to at least react-dom@16.9.0 to remove this warning.",
],
]
`)
})
test('async act should not show an error when ReactTestUtils.act returns something', async () => {
jest.resetModules()
jest.mock('react-dom/test-utils', () => ({
act: () => {
return new Promise(resolve => {
console.error(
'Warning: The callback passed to ReactTestUtils.act(...) function must not return anything',
)
resolve()
})
},
}))
asyncAct = require('../act-compat').asyncAct
await asyncAct(async () => {
await null
})
expect(console.error).toHaveBeenCalledTimes(0)
})
/* eslint no-console:0 */

89
src/__tests__/render.js
Unescape View File

@ -0,0 +1,89 @@
import React from 'react'
import ReactDOM from 'react-dom'
import {render} from '../'
test('renders div into document', () => {
const ref = React.createRef()
const {container} = render(<div ref={ref} />)
expect(container.firstChild).toBe(ref.current)
})
test('works great with react portals', () => {
class MyPortal extends React.Component {
constructor(...args) {
super(...args)
this.portalNode = document.createElement('div')
this.portalNode.dataset.testid = 'my-portal'
}
componentDidMount() {
document.body.appendChild(this.portalNode)
}
componentWillUnmount() {
this.portalNode.parentNode.removeChild(this.portalNode)
}
render() {
return ReactDOM.createPortal(
<Greet greeting="Hello" subject="World" />,
this.portalNode,
)
}
}
function Greet({greeting, subject}) {
return (
<div>
<strong>
{greeting} {subject}
</strong>
</div>
)
}
const {unmount, getByTestId, getByText} = render(<MyPortal />)
expect(getByText('Hello World')).toBeInTheDocument()
const portalNode = getByTestId('my-portal')
expect(portalNode).toBeInTheDocument()
unmount()
expect(portalNode).not.toBeInTheDocument()
})
test('returns baseElement which defaults to document.body', () => {
const {baseElement} = render(<div />)
expect(baseElement).toBe(document.body)
})
test('supports fragments', () => {
class Test extends React.Component {
render() {
return (
<div>
<code>DocumentFragment</code> is pretty cool!
</div>
)
}
}
const {asFragment} = render(<Test />)
expect(asFragment()).toMatchSnapshot()
})
test('renders options.wrapper around node', () => {
const WrapperComponent = ({children}) => (
<div data-testid="wrapper">{children}</div>
)
const {container, getByTestId} = render(<div data-testid="inner" />, {
wrapper: WrapperComponent,
})
expect(getByTestId('wrapper')).toBeInTheDocument()
expect(container.firstChild).toMatchInlineSnapshot(`
<div
data-testid="wrapper"
>
<div
data-testid="inner"
/>
</div>
`)
})

31
src/__tests__/rerender.js
Unescape View File

@ -0,0 +1,31 @@
import React from 'react'
import {render} from '../'
test('rerender will re-render the element', () => {
const Greeting = props => <div>{props.message}</div>
const {container, rerender} = render(<Greeting message="hi" />)
expect(container.firstChild).toHaveTextContent('hi')
rerender(<Greeting message="hey" />)
expect(container.firstChild).toHaveTextContent('hey')
})
test('hydrate will not update props until next render', () => {
const initialInputElement = document.createElement('input')
const container = document.createElement('div')
container.appendChild(initialInputElement)
document.body.appendChild(container)
const firstValue = 'hello'
initialInputElement.value = firstValue
const {rerender} = render(<input value="" onChange={() => null} />, {
container,
hydrate: true,
})
expect(initialInputElement.value).toBe(firstValue)
const secondValue = 'goodbye'
rerender(<input value={secondValue} onChange={() => null} />)
expect(initialInputElement.value).toBe(secondValue)
})

56
src/__tests__/stopwatch.js
Unescape View File

@ -0,0 +1,56 @@
import React from 'react'
import {render, fireEvent} from '../'
class StopWatch extends React.Component {
state = {lapse: 0, running: false}
handleRunClick = () => {
this.setState(state => {
if (state.running) {
clearInterval(this.timer)
} else {
const startTime = Date.now() - this.state.lapse
this.timer = setInterval(() => {
this.setState({lapse: Date.now() - startTime})
})
}
return {running: !state.running}
})
}
handleClearClick = () => {
clearInterval(this.timer)
this.setState({lapse: 0, running: false})
}
componentWillUnmount() {
clearInterval(this.timer)
}
render() {
const {lapse, running} = this.state
return (
<div>
<span>{lapse}ms</span>
<button onClick={this.handleRunClick}>
{running ? 'Stop' : 'Start'}
</button>
<button onClick={this.handleClearClick}>Clear</button>
</div>
)
}
}
const wait = time => new Promise(resolve => setTimeout(resolve, time))
test('unmounts a component', async () => {
jest.spyOn(console, 'error').mockImplementation(() => {})
const {unmount, getByText, container} = render(<StopWatch />)
fireEvent.click(getByText('Start'))
unmount()
// hey there reader! You don't need to have an assertion like this one
// this is just me making sure that the unmount function works.
// You don't need to do this in your apps. Just rely on the fact that this works.
expect(container.innerHTML).toBe('')
// just wait to see if the interval is cleared or not
// if it's not, then we'll call setState on an unmounted component
// and get an error.
// eslint-disable-next-line no-console
await wait(() => expect(console.error).not.toHaveBeenCalled())
})

135
src/act-compat.js
Unescape View File

@ -0,0 +1,135 @@
import React from 'react'
import ReactDOM from 'react-dom'
import * as testUtils from 'react-dom/test-utils'
const reactAct = testUtils.act
const actSupported = reactAct !== undefined
// act is supported react-dom@16.8.0
// so for versions that don't have act from test utils
// we do this little polyfill. No warnings, but it's
// better than nothing.
function actPolyfill(cb) {
ReactDOM.unstable_batchedUpdates(cb)
ReactDOM.render(<div />, document.createElement('div'))
}
const act = reactAct || actPolyfill
let youHaveBeenWarned = false
let isAsyncActSupported = null
function asyncAct(cb) {
if (actSupported === true) {
if (isAsyncActSupported === null) {
return new Promise((resolve, reject) => {
// patch console.error here
const originalConsoleError = console.error
console.error = function error(...args) {
/* if console.error fired *with that specific message* */
/* istanbul ignore next */
const firstArgIsString = typeof args[0] === 'string'
if (
firstArgIsString &&
args[0].indexOf(
'Warning: Do not await the result of calling ReactTestUtils.act',
) === 0
) {
// v16.8.6
isAsyncActSupported = false
} else if (
firstArgIsString &&
args[0].indexOf(
'Warning: The callback passed to ReactTestUtils.act(...) function must not return anything',
) === 0
) {
// no-op
} else {
originalConsoleError.apply(console, args)
}
}
let cbReturn, result
try {
result = reactAct(() => {
cbReturn = cb()
return cbReturn
})
} catch (err) {
console.error = originalConsoleError
reject(err)
return
}
result.then(
() => {
console.error = originalConsoleError
// if it got here, it means async act is supported
isAsyncActSupported = true
resolve()
},
err => {
console.error = originalConsoleError
isAsyncActSupported = true
reject(err)
},
)
// 16.8.6's act().then() doesn't call a resolve handler, so we need to manually flush here, sigh
if (isAsyncActSupported === false) {
console.error = originalConsoleError
/* istanbul ignore next */
if (!youHaveBeenWarned) {
// if act is supported and async act isn't and they're trying to use async
// act, then they need to upgrade from 16.8 to 16.9.
// This is a seemless upgrade, so we'll add a warning
console.error(
`It looks like you're using a version of react-dom that supports the "act" function, but not an awaitable version of "act" which you will need. Please upgrade to at least react-dom@16.9.0 to remove this warning.`,
)
youHaveBeenWarned = true
}
cbReturn.then(() => {
// a faux-version.
// todo - copy https://github.com/facebook/react/blob/master/packages/shared/enqueueTask.js
Promise.resolve().then(() => {
// use sync act to flush effects
act(() => {})
resolve()
})
}, reject)
}
})
} else if (isAsyncActSupported === false) {
// use the polyfill directly
let result
act(() => {
result = cb()
})
return result.then(() => {
return Promise.resolve().then(() => {
// use sync act to flush effects
act(() => {})
})
})
}
// all good! regular act
return act(cb)
}
// use the polyfill
let result
act(() => {
result = cb()
})
return result.then(() => {
return Promise.resolve().then(() => {
// use sync act to flush effects
act(() => {})
})
})
}
export default act
export {asyncAct}
/* eslint no-console:0 */

47
src/flush-microtasks.js
Unescape View File

@ -0,0 +1,47 @@
/* istanbul ignore file */
// the part of this file that we need tested is definitely being run
// and the part that is not cannot easily have useful tests written
// anyway. So we're just going to ignore coverage for this file
/**
* copied from React's enqueueTask.js
*/
let didWarnAboutMessageChannel = false
let enqueueTask
try {
// read require off the module object to get around the bundlers.
// we don't want them to detect a require and bundle a Node polyfill.
const requireString = `require${Math.random()}`.slice(0, 7)
const nodeRequire = module && module[requireString]
// assuming we're in node, let's try to get node's
// version of setImmediate, bypassing fake timers if any.
enqueueTask = nodeRequire('timers').setImmediate
} catch (_err) {
// we're in a browser
// we can't use regular timers because they may still be faked
// so we try MessageChannel+postMessage instead
enqueueTask = callback => {
if (didWarnAboutMessageChannel === false) {
didWarnAboutMessageChannel = true
// eslint-disable-next-line no-console
console.error(
typeof MessageChannel !== 'undefined',
'This browser does not have a MessageChannel implementation, ' +
'so enqueuing tasks via await act(async () => ...) will fail. ' +
'Please file an issue at https://github.com/facebook/react/issues ' +
'if you encounter this warning.',
)
}
const channel = new MessageChannel()
channel.port1.onmessage = callback
channel.port2.postMessage(undefined)
}
}
export default function flushMicroTasks() {
return {
then(resolve) {
enqueueTask(resolve)
},
}
}

16
src/index.js
Unescape View File

@ -0,0 +1,16 @@
import flush from './flush-microtasks'
import {cleanup} from './pure'
// if we're running in a test runner that supports afterEach
// then we'll automatically run cleanup afterEach test
// this ensures that tests run in isolation from each other
// if you don't like this then either import the `pure` module
// or set the RTL_SKIP_AUTO_CLEANUP env variable to 'true'.
if (typeof afterEach === 'function' && !process.env.RTL_SKIP_AUTO_CLEANUP) {
afterEach(async () => {
await flush()
cleanup()
})
}
export * from './pure'

157
src/pure.js
Unescape View File

@ -0,0 +1,157 @@
import React from 'react'
import ReactDOM from 'react-dom'
import {
getQueriesForElement,
prettyDOM,
fireEvent as dtlFireEvent,
configure as configureDTL,
} from '@testing-library/dom'
import act, {asyncAct} from './act-compat'
configureDTL({
asyncWrapper: async cb => {
let result
await asyncAct(async () => {
result = await cb()
})
return result
},
})
const mountedContainers = new Set()
function render(
ui,
{
container,
baseElement = container,
queries,
hydrate = false,
wrapper: WrapperComponent,
} = {},
) {
if (!baseElement) {
// default to document.body instead of documentElement to avoid output of potentially-large
// head elements (such as JSS style blocks) in debug output
baseElement = document.body
}
if (!container) {
container = baseElement.appendChild(document.createElement('div'))
}
// we'll add it to the mounted containers regardless of whether it's actually
// added to document.body so the cleanup method works regardless of whether
// they're passing us a custom container or not.
mountedContainers.add(container)
const wrapUiIfNeeded = innerElement =>
WrapperComponent
? React.createElement(WrapperComponent, null, innerElement)
: innerElement
act(() => {
if (hydrate) {
ReactDOM.hydrate(wrapUiIfNeeded(ui), container)
} else {
ReactDOM.render(wrapUiIfNeeded(ui), container)
}
})
return {
container,
baseElement,
debug: (el = baseElement) =>
Array.isArray(el)
? // eslint-disable-next-line no-console
el.forEach(e => console.log(prettyDOM(e)))
: // eslint-disable-next-line no-console,
console.log(prettyDOM(el)),
unmount: () => ReactDOM.unmountComponentAtNode(container),
rerender: rerenderUi => {
render(wrapUiIfNeeded(rerenderUi), {container, baseElement})
// Intentionally do not return anything to avoid unnecessarily complicating the API.
// folks can use all the same utilities we return in the first place that are bound to the container
},
asFragment: () => {
/* istanbul ignore if (jsdom limitation) */
if (typeof document.createRange === 'function') {
return document
.createRange()
.createContextualFragment(container.innerHTML)
}
const template = document.createElement('template')
template.innerHTML = container.innerHTML
return template.content
},
...getQueriesForElement(baseElement, queries),
}
}
function cleanup() {
mountedContainers.forEach(cleanupAtContainer)
}
// 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) {
ReactDOM.unmountComponentAtNode(container)
if (container.parentNode === document.body) {
document.body.removeChild(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
fireEvent.mouseEnter = fireEvent.mouseOver
fireEvent.mouseLeave = fireEvent.mouseOut
fireEvent.select = (node, init) => {
// React tracks this event only on focused inputs
node.focus()
// React creates this event when one of the following native events happens
// - contextMenu
// - mouseUp
// - dragEnd
// - keyUp
// - keyDown
// so we can use any here
// @link https://github.com/facebook/react/blob/b87aabdfe1b7461e7331abb3601d9e6bb27544bc/packages/react-dom/src/events/SelectEventPlugin.js#L203-L224
fireEvent.keyUp(node, init)
}
// just re-export everything from dom-testing-library
export * from '@testing-library/dom'
export {render, cleanup, fireEvent, act}
// NOTE: we're not going to export asyncAct because that's our own compatibility
// thing for people using react-dom@16.8.0. Anyone else doesn't need it and
// people should just upgrade anyway.
/* eslint func-name-matching:0 */

1
tests/setup-env.js
Unescape View File

@ -0,0 +1 @@
import '@testing-library/jest-dom/extend-expect'
Write Preview
Loading…
Cancel
Save