other things

Author: Kent C. Dodds

README.md

@@ -7,24 +7,35 @@ _Course material for testing React components using react-testing-library_
 
 <!-- END doctoc generated TOC please keep comment here to allow auto update -->
 
-I'm still working on the README. But here's the order these should be given in:
-
 - `react-dom.js` - Render a React component for testing
 - `jest-dom.js` - Use jest-dom for improved assertions
-- `dom-testing-library.js` - Use dom-testing-library to write more maintainable React tests
-- `react-testing-library.js` - Use react-testing-library to render and test React Components
+- `dom-testing-library.js` - Use dom-testing-library to write more maintainable
+ React tests
+- `react-testing-library.js` - Use react-testing-library to render and test
+ React Components
 - `localized.js` - Testing localized content with react-testing-library
 - `state.js` - Test React Component state changes with react-testing-library
 - `prop-updates.js` - Test prop updates with react-testing-library
 - `a11y.js` - Test accessibility of rendered React Components with jest-axe
-- `dependency-injection.js` - Mock HTTP Requests with Dependency Injection in React Component Tests
-- `http-jest-mock.js` - Mock HTTP Requests with jest.mock in React Component Tests
-- `mock-component.js` - Mock react-transition-group in React Component Tests with jest.mock
-- `error-boundaries.js` - Test componentDidCatch handler error boundaries with react-testing-library
-- `tdd-markup.js` - Test drive the development of a React Form with react-testing-library
-- `tdd-functionality.js` - TDD the functionality of a React Form with react-testing-library
-- `react-router-provider.js` - Test react-router Provider history object in React Component Tests with createMemoryHistory
+- `dependency-injection.js` - Mock HTTP Requests with Dependency Injection in
+ React Component Tests
+- `http-jest-mock.js` - Mock HTTP Requests with jest.mock in React Component
+ Tests
+- `mock-component.js` - Mock react-transition-group in React Component Tests
+ with jest.mock
+- `error-boundaries.js` - Test componentDidCatch handler error boundaries with
+ react-testing-library
+- `tdd-markup.js` - Test drive the development of a React Form with
+ react-testing-library
+- `tdd-functionality.js` - TDD the functionality of a React Form with
+ react-testing-library
+- `react-router-provider.js` - Test react-router Provider history object in
+ React Component Tests with createMemoryHistory
 - `redux.js` - Test a redux connected React Component
 - `render-props.js` - Test a render prop component using a Jest spy function
 - `portals.js` - Test React portals with react-testing-library’s `within` API
 - `unmounting.js` - Test Unmounting a React Component with react-testing-library
+
+> Note: the setup for this project uses kcd-scripts. Don't worry about that. You
+> can learn about how to configure jest properly in the "Configure Jest for
+> Testing JavaScript Applications" module of TestingJavaScript.com

package.json

@@ -5,8 +5,8 @@
  "description": "Course material for testing React components using react-testing-library",
  "main": "index.js",
  "scripts": {
- "test": "jest --coverage",
- "test:watch": "jest --watch",
+ "test": "kcd-scripts test --coverage",
+ "test:watch": "kcd-scripts test --watch",
  "lint": "kcd-scripts lint",
  "validate": "kcd-scripts validate",
  "setup": "npm install --silent && npm run validate --silent"
@@ -50,7 +50,8 @@
  "react/prop-types": "off",
  "import/no-unassigned-import": "off",
  "no-console": "off",
- "jsx-a11y/accessible-emoji": "off"
+ "jsx-a11y/accessible-emoji": "off",
+ "consistent-return": "off"
  }
  },
  "eslintIgnore": [
@@ -65,7 +66,8 @@
  "singleQuote": true,
  "trailingComma": "all",
  "bracketSpacing": false,
- "jsxBracketSameLine": false
+ "jsxBracketSameLine": false,
+ "proseWrap": "always"
  },
  "repository": {
  "type": "git",

src/__tests__/dependency-injection.js

@@ -1,7 +1,3 @@
-// these should normally be in your jest setupFilesAfterEnv
-import '@testing-library/jest-dom/extend-expect'
-import '@testing-library/react/cleanup-after-each'
-
 import React from 'react'
 import {render, fireEvent, wait} from '@testing-library/react'
 import {GreetingLoader} from '../greeting-loader-02-dependency-injection'

src/__tests__/dom-testing-library.js

@@ -1,4 +1,3 @@
-import '@testing-library/jest-dom/extend-expect'
 import React from 'react'
 import ReactDOM from 'react-dom'
 import {getQueriesForElement} from '@testing-library/dom'

src/__tests__/error-boundary.js

@@ -1,6 +1,5 @@
 // these should normally be in your jest setupFilesAfterEnv
 import '@testing-library/react/cleanup-after-each'
-import '@testing-library/jest-dom/extend-expect'
 
 import React from 'react'
 import {render, fireEvent} from '@testing-library/react'

src/__tests__/http-jest-mock.js

@@ -1,7 +1,3 @@
-// these should normally be in your jest setupFilesAfterEnv
-import '@testing-library/jest-dom/extend-expect'
-import '@testing-library/react/cleanup-after-each'
-
 import React from 'react'
 import {render, fireEvent, wait} from '@testing-library/react'
 import {loadGreeting as mockLoadGreeting} from '../api'

src/__tests__/jest-dom.js

@@ -1,4 +1,3 @@
-import '@testing-library/jest-dom/extend-expect'
 import React from 'react'
 import ReactDOM from 'react-dom'
 import {FavoriteNumber} from '../favorite-number'

src/__tests__/mock-component.js

@@ -1,7 +1,3 @@
-// these should normally be in your jest setupFilesAfterEnv
-import '@testing-library/jest-dom/extend-expect'
-import '@testing-library/react/cleanup-after-each'
-
 import React from 'react'
 import {render, fireEvent} from '@testing-library/react'
 import {HiddenMessage} from '../hidden-message'

src/__tests__/portals.js

@@ -1,7 +1,3 @@
-// these should normally be in your jest setupFilesAfterEnv
-import '@testing-library/jest-dom/extend-expect'
-import '@testing-library/react/cleanup-after-each'
-
 import React from 'react'
 import {render} from '@testing-library/react'
 import {Modal} from '../modal'

src/__tests__/prop-updates.js

@@ -1,5 +1,3 @@
-import '@testing-library/jest-dom/extend-expect'
-import '@testing-library/react/cleanup-after-each'
 import React from 'react'
 import {render, fireEvent} from '@testing-library/react'
 import {FavoriteNumber} from '../favorite-number'