ASP.NET Core 3 and React

Testing the HomePage component

The final component we are going to implement tests for is the HomePage component. Carry out the following steps to do so:

1. Let's create a file called HomePage.test.tsx with the following content:

import React from 'react';import { render, cleanup, waitForElement } from '@testing-library/react';import { HomePage } from './HomePage';import { BrowserRouter } from 'react-router-dom';afterEach(cleanup);test('When HomePage first rendered, loading indicator should show', () => {  const { getByText } = render(    <BrowserRouter>      <HomePage />    </BrowserRouter>,  );  const loading = getByText('Loading...');  expect(loading).not.toBeNull();});

The test verifies that a Loading... message appears in the HomePage component when ...