Update Testing Library

[kentcdodds]

Is your proposal related to a problem?

I want to ensure people are set up for success when testing

Describe the solution you'd like

The default template should include the latest version of testing library packages.

Also, the ESLint config should include the testing library ESLint plugins:

• eslint-plugin-testing-library
• eslint-plugin-jest-dom

With that in mind, how do people typically run linting for files not bundled by webpack? Should we include a lint script?

Describe alternatives you've considered

Leaving things as-is and letting users do this themselves.

Additional context

I've noticed people making some common mistakes and want to help them avoid those.

[iansu]

We're currently working on upgrading to Jest 26 so we'll definitely be bumping the testing library dependencies before release.

As far as the new ESLint plugins, we should be able to add those pretty easily as well. Someone just needs to make a PR for it. Not sure if we will need to customize any config for them.

[kentcdodds]

For anyone who wants to work on adding the eslint plugins, here's a config that I personally recommend: https://github.com/kentcdodds/eslint-config-kentcdodds/blob/c2b55abe30270b105eb7ce8cf65bfd24dc4125cf/jest.js#L76-L104

(Don't forget the plugins entries https://github.com/kentcdodds/eslint-config-kentcdodds/blob/c2b55abe30270b105eb7ce8cf65bfd24dc4125cf/jest.js#L28-L32).

I'm not sure whether the hasJestDom and hasTestingLibrary are necessary. I'm kinda thinking it would be a good idea though in case someone removes those packages.

[kentcdodds]

And here's where the config would need to be added: https://github.com/facebook/create-react-app/blob/master/packages/eslint-config-react-app/index.js

And the two plugins would need to be installed here: https://github.com/facebook/create-react-app/blob/master/packages/eslint-config-react-app/package.json

[kentcdodds]

Oh, also, any thoughts on this:

With that in mind, how do people typically run linting for files not bundled by webpack? Should we include a lint script?

[ianschmitz]

With that in mind, how do people typically run linting for files not bundled by webpack? Should we include a lint script?

It's been a long standing question (#1217) that we've had. Interested to know if there's significant demand still

I personally generally end up creating my own lint script in my project that might include some other tooling as well in addition to ESLint. The biggest reason for me was the ability to lint test files including running tsc --noEmit to make sure there's no typing issues in my tests.

[ianschmitz]

As far as the testing library packages go, they were updated to latest at the time in #8406.

[iansu]

This is done and will be in the next release so I'm going to close this issue.