Recommended unit test for default Typescript Navigation project not working

[stewartarmbrecht]

Please provide the following:

1. SDK Version: 4.4.7
2. Platforms(Android/iOS/web/all): default
3. Add the appropriate “Tag” based on what Expo library you have a question on.

I initialized the standard Typescript Tabs project.

Then I followed the directions here: Testing with Jest - Expo Documentation

and added this test:

import React from 'react';
import renderer from 'react-test-renderer';

import App from '../../App';

describe('<App />', () => {
  it('has 1 child', () => {
    const tree = renderer.create(<App />).toJSON();
    expect(tree.children.length).toBe(1);
  });
});

When I run it I get this error:
ReferenceError: You are trying to import a file after the Jest environment has been torn down.

and this…

 ●  Cannot log after tests are done. Did you forget to wait for something async in your test?
    Attempted to log "Warning: An update to App inside a test was not wrapped in act(...).

    When testing, code that causes React state updates should be wrapped into act(...):

    act(() => {
      /* fire events that update state */
    });
    /* assert on the output */

    This ensures that you're testing the behavior the user would see in the browser. Learn more at https://fb.me/react-wrap-tests-with-act
        in App".

I can’t figure out how to make these changes. Please help by showing me the changes I would need to run a simple test against one of the default (un touched) project templates.

[stewartarmbrecht]

I was able to get a test to run but I am not getting the snapshot I was expecting:

import React from 'react';
import { render, waitFor, waitForElementToBeRemoved } from '@testing-library/react-native';

import App from '../../App.tsx';

describe('<App />', () => {
  it('has 1 child', async () => {
    const app = await waitFor(() => render(<App />));
    expect(app).toMatchSnapshot();
  }, 30000);
});

This is the snapshot of the default typescript tabs template:

// Jest Snapshot v1, https://goo.gl/fbAQLP

exports[`<App /> has 1 child 1`] = `
<RNCSafeAreaProvider
  onInsetsChange={[Function]}
  style={
    Array [
      Object {
        "flex": 1,
      },
      undefined,
    ]
  }
/>
`;

Is this the splash screen? How do you wait until the splash screen is no longer displaying?