https://github.com/balavishnuvj/rtl-simple-queries
Simple wrapper queries for @testing-library/react
https://github.com/balavishnuvj/rtl-simple-queries
react react-testing testing-library-react testing-tools
Last synced: 4 months ago
JSON representation
Simple wrapper queries for @testing-library/react
- Host: GitHub
- URL: https://github.com/balavishnuvj/rtl-simple-queries
- Owner: balavishnuvj
- License: mit
- Created: 2020-09-22T18:14:49.000Z (almost 6 years ago)
- Default Branch: master
- Last Pushed: 2021-07-20T03:43:23.000Z (about 5 years ago)
- Last Synced: 2025-09-15T13:59:00.564Z (11 months ago)
- Topics: react, react-testing, testing-library-react, testing-tools
- Language: JavaScript
- Homepage:
- Size: 55.7 KB
- Stars: 20
- Watchers: 2
- Forks: 2
- Open Issues: 2
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- Contributing: CONTRIBUTING.md
- License: LICENSE
Awesome Lists containing this project
README
rtl-simple-queries
Simple wrapper queries for @testing-library/react
---
[![Build Status][build-badge]][build]
[![Code Coverage][coverage-badge]][coverage]
[![version][version-badge]][package]
[![downloads][downloads-badge]][npmtrends]
[![MIT License][license-badge]][license]
[](#contributors-)
[![PRs Welcome][prs-badge]][prs]
[![Code of Conduct][coc-badge]][coc]
## The problem
To get an element from while testing with -
[@testing-library/react](https://github.com/testing-library/react-testing-library),
we have 6 variants viz. `getBy`, `getAllBy`, `queryBy`, `queryAllBy`, `findBy`,
and `findAllBy`.
We have to remember which one to use when. The name of methods is entirely a
familiarity thing. But just by the name of the method it bit difficult to know
which 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](#installation)
- [Usage](#usage)
- [Other Solutions](#other-solutions)
- [Issues](#issues)
- [🐛 Bugs](#-bugs)
- [💡 Feature Requests](#-feature-requests)
- [Contributors ✨](#contributors-)
- [LICENSE](#license)
## 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 rtl-simple-queries
```
## Usage
`screen` can be exported from `'rtl-simple-queries'`
Addional parameters from sync query `allowEmpty` and `allowMultiple` and for
async we only have one option `allowMultiple`
```javascript
import {screen} from 'rtl-simple-queries'
screen.fetchByText(/text/, {allowEmpty: true, allowMultiple: false})
screen.fetchByText(/text/, {allowMultiple: false})
screen.fetchByText(/text/)
// async
await screen.fetchByTextAsync(/text/, {allowMultiple: true})
```
To use queies for scoped container we could do
```javascript
// test-utils. js
function render(component, options) {
const utils = rtlRender(component, options)
const queries = getSimpleQueries(utils)
return {...utils, ...renderSyncQueries}
}
// use this render instead of importing from @testing-library/react
const {fetchByText} = render(
text
)
```
## Other Solutions
You can refer to
[cheatsheet](https://testing-library.com/docs/react-testing-library/cheatsheet#queries)
as a quick reference.
## 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]
## Contributors ✨
Thanks goes to these people ([emoji key][emojis]):
Balavishnu V J
💻 📖 🚇 ⚠️
Kent C. Dodds
🤔 📖
Paul Coroneos
📖
Adam Ochayon
📖
This project follows the [all-contributors][all-contributors] specification.
Contributions of any kind welcome!
## LICENSE
MIT
[npm]: https://www.npmjs.com
[node]: https://nodejs.org
[build-badge]: https://img.shields.io/travis/com/balavishnuvj/rtl-simple-queries.svg?style=flat-square
[build]: https://travis-ci.com/balavishnuvj/rtl-simple-queries
[coverage-badge]: https://img.shields.io/codecov/c/github/balavishnuvj/rtl-simple-queries.svg?style=flat-square
[coverage]: https://codecov.io/github/balavishnuvj/rtl-simple-queries
[version-badge]: https://img.shields.io/npm/v/rtl-simple-queries.svg?style=flat-square
[package]: https://www.npmjs.com/package/rtl-simple-queries
[downloads-badge]: https://img.shields.io/npm/dm/rtl-simple-queries.svg?style=flat-square
[npmtrends]: http://www.npmtrends.com/rtl-simple-queries
[license-badge]: https://img.shields.io/npm/l/rtl-simple-queries.svg?style=flat-square
[license]: https://github.com/balavishnuvj/rtl-simple-queries/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/balavishnuvj/rtl-simple-queries/blob/master/other/CODE_OF_CONDUCT.md
[emojis]: https://github.com/all-contributors/all-contributors#emoji-key
[all-contributors]: https://github.com/all-contributors/all-contributors
[bugs]: https://github.com/balavishnuvj/rtl-simple-queries/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+sort%3Acreated-desc+label%3Abug
[requests]: https://github.com/balavishnuvj/rtl-simple-queries/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc+label%3Aenhancement
[good-first-issue]: https://github.com/balavishnuvj/rtl-simple-queries/issues?utf8=%E2%9C%93&q=is%3Aissue+is%3Aopen+sort%3Areactions-%2B1-desc+label%3Aenhancement+label%3A%22good+first+issue%22