How to use the @testing-library/react.screen.getByText function in @testing-library/react

test('you can mock things with jest.mock', () => {
  render()
  expect(screen.getByText('Hello world')).toBeTruthy() // we just care it exists
  // hide the message
  fireEvent.click(screen.getByText('Toggle'))
  // in the real world, the CSSTransition component would take some time
  // before finishing the animation which would actually hide the message.
  // So we've mocked it out for our tests to make it happen instantly
  expect(screen.queryByText('Hello World')).toBeNull() // we just care it doesn't exist
})

await act(async () =>
      deferred.resolve(
        JSON.stringify({
          ...document,
          is_ready_to_show: false,
          upload_state: uploadState.PROCESSING,
        }),
      ),
    );

    expect(fetchMock.lastCall()![0]).toEqual('/api/documents/44/'),
      expect(fetchMock.lastCall()![1]!.headers).toEqual({
        Authorization: 'Bearer cool_token_m8',
      });
    screen.getByText('Processing');

    // The document will be ready in further responses
    fetchMock.restore();
    deferred = new Deferred();
    fetchMock.mock('/api/documents/44/', deferred.promise);

    // Second backend call
    jest.advanceTimersByTime(1000 * 30 + 200);
    await act(async () =>
      deferred.resolve(
        JSON.stringify({
          ...document,
          is_ready_to_show: true,
          upload_state: uploadState.READY,
        }),
      ),

});
    await waitFor(() =>
      expect(
        fetchMock.called('/api/videos/video-id/initiate-upload/', {
          method: 'POST',
        }),
      ).toBe(true),
    );
    await waitFor(() =>
      expect(fetchMock.called('/api/videos/video-id/', { method: 'PUT' })).toBe(
        true,
      ),
    );
    expect(mockUploadFile).toHaveBeenCalled();
    // redirected to the dashboard
    screen.getByText('dashboard');
  });

id: '42',
              is_ready_to_show: true,
              language: 'fr',
              mode: timedTextMode.SUBTITLE,
              title: 'foo',
              upload_state: uploadState.READY,
              url: 'https://example.com/timedtexttrack/42',
              video: '142',
            }}
          />,
        ),
      ),
    );

    await screen.findByText('French');
    screen.getByText((content) => content.startsWith('Ready'));
    // No polling takes place as the track is already READY
    expect(
      fetchMock.called('/api/timedtexttracks/1/', { method: 'GET' }),
    ).not.toBeTruthy();
  });

fetchMock.restore();
      const deferred = new Deferred();
      fetchMock.mock('/api/timedtexttracks/1/', deferred.promise, {
        method: 'GET',
      });

      timer = timer * i;
      jest.advanceTimersByTime(1000 * timer + 200);
      await waitFor(() => {
        // Expect only 1 call since we restore the mock before each one
        expect(fetchMock.calls('/api/timedtexttracks/1/').length).toEqual(1);
      });
      await act(async () => deferred.resolve(JSON.stringify(track)));
      expect(fetchMock.lastCall()![0]).toEqual('/api/timedtexttracks/1/');
      expect(screen.queryByText('Ready')).toBeNull();
      screen.getByText('Processing');
    }
  });

fireEvent.change(container.querySelector('input[type="file"]')!, {
      target: {
        files: [new File(['(⌐□_□)'], 'course.mp4', { type: 'video/mp4' })],
      },
    });
    await waitFor(() =>
      expect(
        fetchMock.calls('/api/videos/video-id/initiate-upload/', {
          method: 'POST',
        }),
      ).toHaveLength(1),
    );
    await waitFor(() => {});
    expect(mockUploadFile).not.toHaveBeenCalled();
    // redirected to the dashboard
    screen.getByText('error policy');
  });
});

it('displays a list of available transcripts', async () => {
    render(wrapInIntlProvider());
    await screen.findByText('Choose a language');

    expect(screen.getByText('French').tagName).toEqual('OPTION');
    expect(screen.getByText('English').tagName).toEqual('OPTION');
    expect(screen.queryByText('Hide transcript')).toEqual(null);
  });

mode={timedTextMode.SUBTITLE}
          />,
          [
            {
              path: UPLOAD_FORM_ROUTE(),
              render: ({ match }) => (
                <span>{`Upload form: ${match.params.objectType} ${match.params.objectId}`}</span>
              ),
            },
          ],
        ),
      ),
    );
    await screen.findByText('Add a language');

    screen.getByText('Select...');
    const input = screen.getByRole('textbox');
    fireEvent.change(input!, { target: { value: 'French' } });
    fireEvent.keyDown(input!, { keyCode: 9, key: 'Tab' });
    fireEvent.click(screen.getByText('French'));

    const button = screen.getByRole('button', { name: /Upload the file/i });
    fireEvent.click(button);

    expect(
      fetchMock.calls('/api/timedtexttracks/', { method: 'POST' }).length,
    ).toEqual(1);
    expect(
      fetchMock.lastCall('/api/timedtexttracks/', { method: 'POST' })![1],
    ).toEqual({
      body: '{"language":"fr","mode":"st"}',
      headers: {

is_ready_to_show: true,
        language: 'fr',
        mode: timedTextMode.CLOSED_CAPTIONING,
        upload_state: uploadState.READY,
        url: 'https://example.com/ttt/144',
        video: '43',
      },
    ]);

    render(wrapInIntlProvider(wrapInRouter()));

    const closedCaptions = await screen.findByText('Closed captions');
    getByTextInContainer(closedCaptions.parentElement!, 'French');
    const subtitles = screen.getByText('Subtitles');
    getByTextInContainer(subtitles.parentElement!, 'English');
    screen.getByText('Transcripts');
  });

render(
      wrapInIntlProvider(
        wrapInRouter(
          ,
        ),
      ),
    );

    screen.getByText('Our title');

    await screen.findByText('French');
    screen.getByText('English');
  });
});