chore: cleanup

Author: Kent C. Dodds

.github/ISSUE_TEMPLATE.md

@@ -11,9 +11,9 @@ never done that before, that's great! Check this free short video tutorial to
 learn how: http://kcd.im/pull-request
 -->
 
-* `dom-testing-library` version:
-* `node` version:
-* `npm` (or `yarn`) version:
+- `dom-testing-library` version:
+- `node` version:
+- `npm` (or `yarn`) version:
 
 Relevant code or config
 

.github/ISSUE_TEMPLATE/Bug_Report.md

@@ -18,10 +18,10 @@ tutorial to learn how: http://kcd.im/pull-request
 
 -->
 
-* `dom-testing-library` version:
-* `react` version:
-* `node` version:
-* `npm` (or `yarn`) version:
+- `dom-testing-library` version:
+- `react` version:
+- `node` version:
+- `npm` (or `yarn`) version:
 
 ### Relevant code or config:
 

.github/ISSUE_TEMPLATE/Question.md

@@ -12,11 +12,11 @@ and feature requests so we recommend not using this medium to ask them here 😁
 
 ## ❓ Support Forums
 
-* React Spectrum
+- React Spectrum
   https://spectrum.chat/react-testing-library
-* Reactiflux on Discord
+- Reactiflux on Discord
   https://www.reactiflux.com
-* Stack Overflow
+- Stack Overflow
   https://stackoverflow.com/questions/tagged/react-testing-library
 
 **ISSUES WHICH ARE QUESTIONS WILL BE CLOSED**

.github/PULL_REQUEST_TEMPLATE.md

@@ -34,9 +34,9 @@ merge of your pull request!
 
 <!-- to check an item, place an "x" in the box like so: "- [x] Documentation" -->
 
-* [ ] Documentation
-* [ ] Tests
-* [ ] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->
-* [ ] Added myself to contributors table <!-- this is optional, see the contributing guidelines for instructions -->
+- [ ] Documentation
+- [ ] Tests
+- [ ] Ready to be merged <!-- In your opinion, is this ready to be merged as soon as it's reviewed? -->
+- [ ] Added myself to contributors table <!-- this is optional, see the contributing guidelines for instructions -->
 
 <!-- feel free to add additional comments -->

.size-snapshot.json

@@ -0,0 +1,7 @@
+{
+  "dist/dom-testing-library.umd.js": {
+    "bundled": 108659,
+    "minified": 48227,
+    "gzipped": 14779
+  }
+}

README.md

@@ -129,7 +129,7 @@ import {
   // called "queries" which you could import here as well
   wait,
 } from 'dom-testing-library'
-// adds special assertions like toHaveTextContent and toBeInTheDOM
+// adds special assertions like toHaveTextContent
 import 'jest-dom/extend-expect'
 
 function getExampleDOM() {
@@ -171,7 +171,7 @@ test('examples of some things', async () => {
   getByText(container, 'Print Username').click()
 
   await wait(() =>
-    expect(queryByTestId(container, 'printed-username')).toBeInTheDOM(),
+    expect(queryByTestId(container, 'printed-username')).toBeTruthy(),
   )
 
   // getByTestId and queryByTestId are an escape hatch to get elements
@@ -543,13 +543,13 @@ exmaple, you can use the ones provided by
 import 'jest-dom/extend-expect'
 
 // <span data-testid="greetings">Hello World</span>
-expect(queryByTestId(container, 'greetings')).toBeInTheDOM()
 expect(queryByTestId(container, 'greetings')).not.toHaveTextContent('Bye bye')
 // ...
 
-> Note: when using `toBeInTheDOM`, make sure you use a query function
-> (like `queryByTestId`) rather than a get function (like `getByTestId`).
-> Otherwise the `get*` function could throw an error before your assertion.
+> Note: when using some of these matchers, you may need to make sure
+> you use a query function (like `queryByTestId`) rather than a get
+> function (like `getByTestId`). Otherwise the `get*` function could
+> throw an error before your assertion.
 ```
 
 Check out [jest-dom's documentation](https://github.com/gnapse/jest-dom#readme)
@@ -629,7 +629,7 @@ the `query` API instead:
 const submitButton = queryByText(container, 'submit')
 expect(submitButton).toBeNull() // it doesn't exist
 // or if you're using the custom matchers:
-expect(submitButton).not.toBeInTheDOM()
+expect(submitButton).not.toBeTruthy()
 ```
 
 ## `queryAll` and `getAll` APIs
@@ -639,7 +639,7 @@ Each of the `query` APIs have a corresponsing `queryAll` version that always ret
 ```javascript
 const submitButtons = queryAllByText(container, 'submit')
 expect(submitButtons).toHaveLength(3) // expect 3 elements
-expect(submitButtons[0]).toBeInTheDOM()
+expect(submitButtons[0]).toBeTruthy()
 ```
 
 ## `within` and `getQueriesForElement` APIs

other/CODE_OF_CONDUCT.md

@@ -14,21 +14,21 @@ orientation.
 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
+- 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
+- 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
+- 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
+- Other conduct which could reasonably be considered inappropriate in a
   professional setting
 
 ## Our Responsibilities

src/__tests__/element-queries.js

@@ -52,16 +52,16 @@ test('can get elements by matching their text content', () => {
       </span>
     </div>
   `)
-  expect(queryByText('Currently showing')).toBeInTheDOM()
-  expect(queryByText('Step 1 of 4')).toBeInTheDOM()
+  expect(queryByText('Currently showing')).toBeTruthy()
+  expect(queryByText('Step 1 of 4')).toBeTruthy()
 })
 
 test('matches case with RegExp matcher', () => {
   const {queryByText} = render(`
     <span>STEP 1 of 4</span>
   `)
-  expect(queryByText(/STEP 1 of 4/)).toBeInTheDOM()
-  expect(queryByText(/Step 1 of 4/)).not.toBeInTheDOM()
+  expect(queryByText(/STEP 1 of 4/)).toBeTruthy()
+  expect(queryByText(/Step 1 of 4/)).not.toBeTruthy()
 })
 
 test('get can get form controls by label text', () => {
@@ -120,7 +120,7 @@ test('totally empty label', () => {
 test('getByLabelText with aria-label', () => {
   // not recommended normally, but supported for completeness
   const {queryByLabelText} = render(`<input aria-label="batman" />`)
-  expect(queryByLabelText(/bat/)).toBeInTheDOM()
+  expect(queryByLabelText(/bat/)).toBeTruthy()
 })
 
 test('get element by its alt text', () => {
@@ -130,7 +130,9 @@ test('get element by its alt text', () => {
       <img alt="finding nemo poster" src="/finding-nemo.png" />
     </div>,
   `)
-  expect(getByAltText(/fin.*nem.*poster$/i).src).toBe('http://localhost/finding-nemo.png')
+  expect(getByAltText(/fin.*nem.*poster$/i).src).toBe(
+    'http://localhost/finding-nemo.png',
+  )
 })
 
 test('query/get element by its title', () => {
@@ -161,14 +163,14 @@ test('query/get element by its value', () => {
 
 test('can get elements by data-testid attribute', () => {
   const {queryByTestId} = render(`<div data-testid="firstName"></div>`)
-  expect(queryByTestId('firstName')).toBeInTheDOM()
-  expect(queryByTestId(/first/)).toBeInTheDOM()
-  expect(queryByTestId(testid => testid === 'firstName')).toBeInTheDOM()
+  expect(queryByTestId('firstName')).toBeTruthy()
+  expect(queryByTestId(/first/)).toBeTruthy()
+  expect(queryByTestId(testid => testid === 'firstName')).toBeTruthy()
   // match should be exact, case-sensitive
-  expect(queryByTestId('firstname')).not.toBeInTheDOM()
-  expect(queryByTestId('first')).not.toBeInTheDOM()
-  expect(queryByTestId('firstNamePlusMore')).not.toBeInTheDOM()
-  expect(queryByTestId('first-name')).not.toBeInTheDOM()
+  expect(queryByTestId('firstname')).not.toBeTruthy()
+  expect(queryByTestId('first')).not.toBeTruthy()
+  expect(queryByTestId('firstNamePlusMore')).not.toBeTruthy()
+  expect(queryByTestId('first-name')).not.toBeTruthy()
 })
 
 test('getAll* matchers return an array', () => {
@@ -248,8 +250,8 @@ test('using jest helpers to assert element states', () => {
   const {queryByTestId} = render(`<span data-testid="count-value">2</span>`)
 
   // other ways to assert your test cases, but you don't need all of them.
-  expect(queryByTestId('count-value')).toBeInTheDOM()
-  expect(queryByTestId('count-value1')).not.toBeInTheDOM()
+  expect(queryByTestId('count-value')).toBeTruthy()
+  expect(queryByTestId('count-value1')).not.toBeTruthy()
   expect(queryByTestId('count-value')).toHaveTextContent('2')
   expect(queryByTestId('count-value')).not.toHaveTextContent('21')
   expect(() =>
@@ -258,21 +260,17 @@ test('using jest helpers to assert element states', () => {
 
   // negative test cases wrapped in throwError assertions for coverage.
   expect(() =>
-    expect(queryByTestId('count-value')).not.toBeInTheDOM(),
+    expect(queryByTestId('count-value')).not.toBeTruthy(),
   ).toThrowError()
   expect(() =>
-    expect(queryByTestId('count-value1')).toBeInTheDOM(),
+    expect(queryByTestId('count-value1')).toBeTruthy(),
   ).toThrowError()
   expect(() =>
     expect(queryByTestId('count-value')).toHaveTextContent('3'),
   ).toThrowError()
   expect(() =>
     expect(queryByTestId('count-value')).not.toHaveTextContent('2'),
   ).toThrowError()
-
-  expect(() =>
-    expect({thisIsNot: 'an html element'}).toBeInTheDOM(),
-  ).toThrowError()
 })
 
 test('using jest helpers to check element attributes', () => {
@@ -359,21 +357,21 @@ test('test the debug helper prints the dom state here', () => {
     </div>`
 
   const {getByText} = render(Large) // render large DOM which exceeds 7000 limit
-  expect(() => expect(getByText('not present')).toBeInTheDOM()).toThrowError()
+  expect(() => expect(getByText('not present')).toBeTruthy()).toThrowError()
 
   const Hello = `<div data-testid="debugging" data-otherid="debugging">
         Hello World!
     </div>`
   const {getByTestId} = render(Hello)
   process.env.DEBUG_PRINT_LIMIT = 5 // user should see `...`
-  expect(() => expect(getByTestId('not present')).toBeInTheDOM()).toThrowError(
+  expect(() => expect(getByTestId('not present')).toBeTruthy()).toThrowError(
     /\.\.\./,
   )
 
   const {getByLabelText} = render(Hello)
   process.env.DEBUG_PRINT_LIMIT = 10000 // user shouldn't see `...`
   expect(() =>
-    expect(getByLabelText('not present')).toBeInTheDOM(/^((?!\.\.\.).)*$/),
+    expect(getByLabelText('not present')).toBeTruthy(/^((?!\.\.\.).)*$/),
   ).toThrowError()
 
   //all good replacing it with old value

src/__tests__/example.js

@@ -42,7 +42,7 @@ test('examples of some things', async () => {
   getByText(container, 'Print Username').click()
 
   await wait(() =>
-    expect(queryByTestId(container, 'printed-username')).toBeInTheDOM(),
+    expect(queryByTestId(container, 'printed-username')).toBeTruthy(),
   )
 
   // getByTestId and queryByTestId are an escape hatch to get elements

src/__tests__/wait-for-element.js

@@ -1,5 +1,5 @@
 import {waitForElement, wait} from '../'
-// adds special assertions like toBeInTheDOM
+// adds special assertions like toBeTruthy
 import 'jest-dom/extend-expect'
 import {render} from './helpers/test-utils'