title: When is it necessary to use `rerender` with the React Testing Library?
body: <p>In times past, my colleagues and I would typically write React Testing Library (RTL) tests for the main parent components, which often have many nested child components.  That testing made sense and worked well.  Btw the child components in question are very much dedicated to that parent component and not of the reusable variety.</p>
  <p>But now we're trying to write RTL tests for every single component.  Today I was trying to build tests for an <code>Alerts</code> component, which is the parent of an <code>Alert</code> component and about 4 levels down from the top-level component.  Here's some sample code in my test file:</p>
  <pre><code>function renderDom(component, store) {
    return {
      ...render(&lt;Provider store={store}&gt;{component}&lt;/Provider&gt;),
      store,
    };
  }
  
  let store = configureStore(_initialState);
  const spy = jest.spyOn(store, 'dispatch');
  const { queryByTestId, queryByText, debug } = renderDom(
    &lt;Alerts question={store.getState().pageBuilder.userForm.steps[0].tasks[0].questions[1]} /&gt;,
    store
  );
  </code></pre>
  <p>I then started writing the typical RTL code to get the <code>Alerts</code> component to do its thing.  One of these was to click on a button which would trigger an <code>ADD_ALERT</code> action.  I stepped through all of the code and the Redux reducer was apparently working correctly with a new alert, as I intended, yet back in the <code>Alerts</code> component, <code>question.alerts</code> remained <code>null</code> whereas in the production code it was definitely being updated properly with a new alert.</p>
  <p>I spoke with a colleague and he said that for this type of test, I would need to artificially rerender the component like this:</p>
  <pre><code>rerender(&lt;Provider store={store}&gt;&lt;Alerts question={store.getState().pageBuilder.userForm.steps[0].tasks[0].questions[1]} /&gt;&lt;/Provider&gt;);
  </code></pre>
  <p>I tried this and it appears to be a solution.  I don't fully understand why I have to do this and thought I'd reach out to the community to see if there was a way I could avoid using <code>rerender</code>.</p>