Movatterモバイル変換


[0]ホーム

URL:


Skip to content

Navigation Menu

Sign in
Appearance settings

Search code, repositories, users, issues, pull requests...

Provide feedback

We read every piece of feedback, and take your input very seriously.

Saved searches

Use saved searches to filter your results more quickly

Sign up
Appearance settings

Simple wrapper queries for @testing-library/react

License

NotificationsYou must be signed in to change notification settings

balavishnuvj/rtl-simple-queries

Repository files navigation

Simple wrapper queries for @testing-library/react


Build StatusCode CoverageversiondownloadsMIT License

All Contributors

PRs WelcomeCode of Conduct

The problem

To get an element from while testing with -@testing-library/react,we have 6 variants viz.getBy,getAllBy,queryBy,queryAllBy,findBy,andfindAllBy.

We have to remember which one to use when. The name of methods is entirely afamiliarity thing. But just by the name of the method it bit difficult to knowwhich one would throw error if an element is not found or which takes into account async updates.

This solution

This library wraps those methods with easier to remember APIs

Table of Contents

Installation

This module is distributed vianpm which is bundled withnode andshould be installed as one of your project'sdevDependencies:

npm install --save-dev rtl-simple-queries

Usage

screen can be exported from'rtl-simple-queries'

Addional parameters from sync queryallowEmpty andallowMultiple and forasync we only have one optionallowMultiple

import{screen}from'rtl-simple-queries'screen.fetchByText(/text/,{allowEmpty:true,allowMultiple:false})screen.fetchByText(/text/,{allowMultiple:false})screen.fetchByText(/text/)// asyncawaitscreen.fetchByTextAsync(/text/,{allowMultiple:true})

To use queies for scoped container we could do

// test-utils. jsfunctionrender(component,options){constutils=rtlRender(component,options)constqueries=getSimpleQueries(utils)return{...utils, ...renderSyncQueries}}// use this render instead of importing from@testing-library/reactconst{fetchByText}=render(<p>text</p>)

Other Solutions

You can refer tocheatsheetas a quick reference.

Issues

Looking to contribute? Look for theGood First Issuelabel.

🐛 Bugs

Please file an issue for bugs, missing documentation, or unexpected behavior.

See Bugs

💡 Feature Requests

Please file an issue to suggest new features. Vote on feature requests by addinga 👍. This helps maintainers prioritize what to work on.

See Feature Requests

Contributors ✨

Thanks goes to these people (emoji key):


Balavishnu V J

💻📖🚇⚠️

Kent C. Dodds

🤔📖

Paul Coroneos

📖

Adam Ochayon

📖

This project follows theall-contributors specification.Contributions of any kind welcome!

LICENSE

MIT

About

Simple wrapper queries for @testing-library/react

Topics

Resources

License

Contributing

Stars

Watchers

Forks

Packages

No packages published

Contributors4

  •  
  •  
  •  
  •  

[8]ページ先頭

©2009-2025 Movatter.jp