title: Mocking Child in React Native using Jest
body: <p>I have the following parent screen/component <code>Employees.tsx</code></p>
  
  <pre><code>import PasswordForm from '../../components/Forms/PasswordForm'
  
  ...
  &lt;View style={ stylesheet.modalWrapper }&gt;
      &lt;PasswordForm
          errorMessage={ auth.error }
          isWorking={ auth.isWorking }
          onCancel={ toggleModal }
          onSubmit={ customSubmitHandler }
      /&gt;
  &lt;/View&gt;
  </code></pre>
  
  <p><code>&lt;PasswordForm /&gt;</code> is a child component that is a decorated form using <code>reduxForm</code> to <code>connect</code>, imported into the parent in the standard way.</p>
  
  <p><code>PasswordForm.tsx</code></p>
  
  <pre><code>const PasswordForm = reduxForm({
      form: 'password-form'
  })(PasswordFormStatic)
  </code></pre>
  
  <p>In my tests, I am not interested in the functionality of this child component <code>&lt;PasswordForm&gt;</code> so I want to mock that component, and just make sure that the mocked component is still present in the snapshot test of the parent component (<code>Employees.tsx</code>).</p>
  
  <p><code>jest.mock()</code> I thought would handle this. This is <code>Employees.spec.tsx</code></p>
  
  <pre><code>describe('Employees Scene', () =&gt; {
      let wrapper
      const requestAuthToken = jest.fn()
  
      jest.mock('../../components/Forms/PasswordForm', () =&gt; {
          const mockedPasswordForm = () =&gt; null
          return mockedPasswordForm
      })
  </code></pre>
  
  <p>However, I still get the error that <code>Invariant Violation: Could not find "store" in either the context or props...</code> which is really a complaint about the child.</p>
  
  <p>So it appears <code>jest.mock()</code> here is not mocking my component? As it is still trying to render and complain about the lack of a store.</p>
  
  <p>How do I properly mock components (specifically children) in Jest with React-Native?</p>