slight improvements

Author: Kent C. Dodds

src/__tests__/tdd-07-error-state.js

@@ -72,7 +72,7 @@ test('renders an error message from the server', async () => {
  const testError = 'test error'
  mockSavePost.mockRejectedValueOnce({data: {error: testError}})
  const fakeUser = userBuilder()
- const {getByLabelText, getByTestId, getByText} = render(
+ const {getByLabelText, getByText, getByTestId} = render(
  <Editor user={fakeUser} />,
  )
  const fakePost = postBuilder()
@@ -86,4 +86,5 @@ test('renders an error message from the server', async () => {
 
  const postError = await waitForElement(() => getByTestId('post-error'))
  expect(postError).toHaveTextContent(testError)
+ expect(submitButton).not.toBeDisabled()
 })

src/__tests__/tdd-08-custom-render.js

@@ -85,4 +85,5 @@ test('renders an error message from the server', async () => {
 
  const postError = await waitForElement(() => getByTestId('post-error'))
  expect(postError).toHaveTextContent(testError)
+ expect(submitButton).not.toBeDisabled()
 })

src/post-editor-07-error-state.js

@@ -3,7 +3,7 @@ import {Redirect} from 'react-router'
 import {savePost} from './api'
 
 class Editor extends React.Component {
- state = {isSaving: false, redirect: false}
+ state = {isSaving: false, redirect: false, error: null}
  handleSubmit = e => {
  e.preventDefault()
  const {title, content, tags} = e.target.elements
@@ -24,9 +24,6 @@ class Editor extends React.Component {
  if (this.state.redirect) {
  return <Redirect to="/" />
  }
- if (this.state.error) {
- return <div data-testid="post-error">{this.state.error}</div>
- }
  return (
  <form onSubmit={this.handleSubmit}>
  <label htmlFor="title-input">Title</label>
@@ -41,6 +38,9 @@ class Editor extends React.Component {
  <button type="submit" disabled={this.state.isSaving}>
  Submit
  </button>
+ {this.state.error ? (
+ <div data-testid="post-error">{this.state.error}</div>
+ ) : null}
  </form>
  )
  }

src/post-editor-08-custom-render.js

@@ -24,9 +24,6 @@ class Editor extends React.Component {
  if (this.state.redirect) {
  return <Redirect to="/" />
  }
- if (this.state.error) {
- return <div data-testid="post-error">{this.state.error}</div>
- }
  return (
  <form onSubmit={this.handleSubmit}>
  <label htmlFor="title-input">Title</label>
@@ -41,6 +38,9 @@ class Editor extends React.Component {
  <button type="submit" disabled={this.state.isSaving}>
  Submit
  </button>
+ {this.state.error ? (
+ <div data-testid="post-error">{this.state.error}</div>
+ ) : null}
  </form>
  )
  }