repos / starfx

app.test.tsx

 1import React from "react";
 2import "@testing-library/jest-dom";
 3import { expect, test } from "@jest/globals";
 4import { fireEvent, render, screen, waitFor } from "./utils";
 5import { fetchUsers } from "../src/api";
 6import { App } from "../src/app";
 7
 8test("loads homepage", async () => {
 9  render(<App id="1" />);
10  expect(screen.getByRole("heading")).toHaveTextContent("hi there");
11});
12
13test("fetches users", async () => {
14  fetchUsers.use(function* (ctx, next) {
15    ctx.response = new Response(
16      JSON.stringify([
17        {
18          id: 1,
19          name: "Leanne Graham",
20        },
21        {
22          id: 2,
23          name: "Ervin Howell",
24        },
25      ])
26    );
27    yield* next();
28  });
29
30  render(<App id="1" />);
31
32  expect(screen.getByRole("heading")).toHaveTextContent("hi there");
33
34  const btn = await screen.findByRole("button", { name: /Fetch users/ });
35  fireEvent.click(btn);
36
37  await waitFor(() => {
38    expect(screen.getByText("(1) Leanne Graham")).toBeInTheDocument();
39  });
40  await waitFor(() => {
41    expect(screen.getByText("(2) Ervin Howell")).toBeInTheDocument();
42  });
43});