Remove lines about using fireEvent to gain focus or blur

[jzarzeckis]

Close #186

What:

Removing lines in documentation that state you can use fireEvent.focus(element)

Why:

To avoid confusion. More details & example provided in #186

Checklist:

• Documentation
• Tests N/A
• Updated Type Definitions N/A
• Ready to be merged

[codecov]

Codecov Report

Merging #187 into master will not change coverage.
The diff coverage is n/a.

@@          Coverage Diff          @@
##           master   #187   +/-   ##
=====================================
  Coverage     100%   100%           
=====================================
  Files          19     19           
  Lines         234    234           
  Branches       57     57           
=====================================
  Hits          234    234

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 760409a...cc74c04. Read the comment docs.

[eps1lon]

Thank you for fixing the documentation! I would rather apply the suggestions from #186 (comment) though i.e. input.blur() instead of fireEvent.blur(input)

[weyert]

Yes, or people would just use user-event instead ;)

[gnapse]

Thanks for this contribution, and for noticing this in the first place.

Indeed, using user-event can fix this. But for the context of our documentation, I'd say I second @eps1lon's suggestion: instead of removing the entire example, we can change it so it calls element.focus() instead of fireEvent.focus().

[jzarzeckis]

@eps1lon if you look at the diff, you will see that the example with element.focus() hasn't been removed:

This allows you to assert whether an element has focus or not.
#### Examples
```html
<div><input type="text" data-testid="element-to-focus" /></div>
```
##### Using document.querySelector
```javascript
const input = document.querySelector(['data-testid="element-to-focus"'])
input.focus()
expect(input).toHaveFocus()
input.blur()
expect(input).not.toHaveFocus()
```

- ##### Using DOM Testing Library
-
- ```javascript
- const input = queryByTestId(container, 'element-to-focus')
-
- fireEvent.focus(input)
- expect(input).toHaveFocus()
-
- fireEvent.blur(input)
- expect(input).not.toHaveFocus()
- ```

[eps1lon]

@eps1lon if you look at the diff,

I did. The diff does not tell me that we already had a working example above.

This change is good as-is. The extra documentation wasn't needed in the first place.

[gnapse]

@jzarzeckis indeed. But the existence of two examples was not because one used element.focus() and the other fireEvent.focus(). Both examples exist so that one shows an example that uses @testing-library/dom and the other shows how an example looks like when using native DOM APIs.

So your fix should be about making the example that was incorrectly using fireEvent to now use element.focus().

If you wonder why we show duplicate examples like this, indeed, I share the pain, and I've been meaning to remove that duplication. I'll accept your PR as is, because I'll remove that duplication in our documentation soon.

[gnapse]

Follow up: created #188 to solve that documentation duplication for good. In case anyone wants to take a look or chime in.

[gnapse]

🎉 This PR is included in version 5.0.1 🎉

The release is available on:

• npm package (@latest dist-tag)
• GitHub release

Your semantic-release bot 📦🚀

[gnapse]

@all-contributors please add @jzarzeckis for doc

[allcontributors]

@gnapse

I've put up a pull request to add @jzarzeckis! 🎉