nedgrady

test("When the 'cancel' button is clicked, onClose is called", () => {
    const mockOnClose = vi.fn()

    render(<CustomModal onClose={mockOnClose} />)

    const button = screen.getByRole("button", { name: /Cancel/i })
    userEvent.click(button)

    expect(mockOnClose).toHaveBeenCalledWith("clicked cancel")
})

nedgrady

test("When the 'cancel' button is clicked, onClose is called", () => {
    render(
        <CustomModal
            onClose={reason => {
                expect(reason).toBe("clicked cancel")
            }}
        />,
    )

    const button = screen.getByRole("button", { name: /Cancel/i })

nedgrady

function CustomModal({ onClose }: CustomModalProps) {
    return (
        <div>
            <div>Some modal content</div>
            <div>
                <button>OK</button>
                <button>Cancel</button>
            </div>
        </div>
    )

nedgrady

test("The button callback is called when the button is clicked", () => {
    const onClickMock = vi.fn()

    const { getByRole } = render(<CustomButton onClick={onClickMock} text="Click me" />)
    userEvent.click(getByRole("button", { name: "Click me" }))

    expect(onClickMock).toHaveBeenCalled
})

nedgrady

> Error: Expected requests to be equal
- Expected
+ Received
  Object {
    "method": "GET",
    "path": "/some-long-running-endpoint",
-   "requestId": "123",
+   "requestId": "456",
  }

nedgrady

expect.extend({
    toBeRequest(received: http.ClientRequest, expected: http.ClientRequest) {
        const pass = received === expected
        return {
            pass,
            message: () => `Expected requests${this.isNot ? "not " : ""} to be equal`,
            // expected/actual object graphs are displayed under the test failure message
            expected: { method: expected.method, path: expected.path, requestId: expected.getHeader("x-request-id") },
            actual: { method: received.method, path: received.path, requestId: received.getHeader("x-request-id") },
        }

nedgrady

test("the returned duplicates contain the first request", () => {
    const request1 = new http.ClientRequest({
        method: "GET",
        path: "/some-long-running-endpoint",
        headers: {
            "x-request-id": "123",
            authorization: "user1",
        },
    })

nedgrady

  render(<CommunicationList />);

  await waitForElementToBeRemoved(() => screen.queryByText("Loading..."));

  expect(
    screen.queryByText("Some Draft Communication")
  ).not.toBeInTheDocument();

nedgrady

  expect(
    screen.queryByText("Some Draft Communication")
  ).not.toBeInTheDocument();

nedgrady

 return (
    <ul>
      {communicationsToDisplay
        .filter((communication) => communication.status !== "draft")
        .map((communication) => (
          <li key={communication.id}>{communication.name}</li>
        ))}
    </ul>
  );