Skip to content

Commit

Permalink
Add some tests for InformationModal
Browse files Browse the repository at this point in the history
  • Loading branch information
Li Juen Chang committed Apr 6, 2021
1 parent 903dcb5 commit 310f1a2
Show file tree
Hide file tree
Showing 3 changed files with 109 additions and 4 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -49,7 +49,7 @@ describe("<ConfirmationModal />", () => {
expect(queryByText("Confirm")).toBeNull()
})

it("closes the modal when escape key pressed", () => {
it("supports a dismiss action when escape key is pressed", () => {
const handleConfirm = jest.fn()
const handleDismiss = jest.fn()
const document = render(
Expand All @@ -65,7 +65,23 @@ describe("<ConfirmationModal />", () => {
expect(handleConfirm).toHaveBeenCalledTimes(0)
})

it("closes the modal when cancel button is pressed", () => {
it("supports a dismiss action when dismiss button is pressed", () => {
const handleConfirm = jest.fn()
const handleDismiss = jest.fn()
const { getByTitle } = render(
<ConfirmationModalWrapper
onConfirm={handleConfirm}
onDismiss={handleDismiss}
>
Example modal body
</ConfirmationModalWrapper>
)
fireEvent.click(getByTitle(/Dismiss/i))
expect(handleConfirm).toHaveBeenCalledTimes(0)
expect(handleDismiss).toHaveBeenCalledTimes(1)
})

it("supports a dismiss action when cancel button is pressed", () => {
const handleConfirm = jest.fn()
const handleDismiss = jest.fn()
const { getByText } = render(
Expand All @@ -81,7 +97,7 @@ describe("<ConfirmationModal />", () => {
expect(handleDismiss).toHaveBeenCalledTimes(1)
})

it("closes the modal when confirm button is pressed", () => {
it("supports a confirm action when confirm button is pressed", () => {
const handleConfirm = jest.fn()
const handleDismiss = jest.fn()
const { getByText } = render(
Expand Down
Original file line number Diff line number Diff line change
@@ -0,0 +1,89 @@
import { cleanup, render, fireEvent } from "@testing-library/react"
import * as React from "react"
import InformationModal, { InformationModalProps } from "./InformationModal"

afterEach(cleanup)

const InformationModalWrapper = (props: Partial<InformationModalProps>) => (
<InformationModal
isOpen={true}
title="Example modal title"
onConfirm={() => undefined}
onDismiss={() => undefined}
children="Example modal body"
secondaryLabel="Example secondary"
onSecondaryAction={() => undefined}
{...props}
/>
)

describe("<InformationModal />", () => {
it("renders an open modal with the provided content", () => {
const { getByText } = render(
<InformationModalWrapper>Example modal body</InformationModalWrapper>
)
expect(getByText("Example modal body")).toBeTruthy()
})

it("supports a dismiss action when escape key is pressed", () => {
const handleDismiss = jest.fn()
const document = render(
<InformationModalWrapper onDismiss={handleDismiss}>
Example modal body
</InformationModalWrapper>
)
fireEvent.keyUp(document.container, { key: "Escape", code: "Escape" })
expect(handleDismiss).toHaveBeenCalledTimes(1)
})

it("supports a dismiss action when dismiss button is pressed", () => {
const handleConfirm = jest.fn()
const handleDismiss = jest.fn()
const { getByTitle } = render(
<InformationModalWrapper
onConfirm={handleConfirm}
onDismiss={handleDismiss}
>
Example modal body
</InformationModalWrapper>
)
fireEvent.click(getByTitle(/Dismiss/i))
expect(handleConfirm).toHaveBeenCalledTimes(0)
expect(handleDismiss).toHaveBeenCalledTimes(1)
})

it("supports a confirm action when confirm button is pressed", () => {
const handleConfirm = jest.fn()
const handleDismiss = jest.fn()
const { getByText } = render(
<InformationModalWrapper
onConfirm={handleConfirm}
onDismiss={handleDismiss}
>
Example modal body
</InformationModalWrapper>
)
fireEvent.click(getByText(/Confirm/i))
expect(handleConfirm).toHaveBeenCalledTimes(1)
expect(handleDismiss).toHaveBeenCalledTimes(0)
})

it("supports a secondary action when secondary button is pressed", () => {
const handleConfirm = jest.fn()
const handleSecondary = jest.fn()
const handleDismiss = jest.fn()
const { getByText } = render(
<InformationModalWrapper
onConfirm={handleConfirm}
onDismiss={handleDismiss}
onSecondaryAction={handleSecondary}
>
Example modal body
</InformationModalWrapper>
)
fireEvent.click(getByText(/Example secondary/i))
expect(handleSecondary).toHaveBeenCalledTimes(1)
expect(handleConfirm).toHaveBeenCalledTimes(0)
expect(handleDismiss).toHaveBeenCalledTimes(0)
})
})
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ describe("<GenericModal />", () => {
expect(() => getByText("Example")).toThrow()
})

it("closes the modal when the escape key is pressed", () => {
it("closes the modal when escape key is pressed", () => {
const handleDismiss = jest.fn()
const document = render(
<GenericModal isOpen={true} onEscapeKeyup={handleDismiss}>
Expand Down

0 comments on commit 310f1a2

Please sign in to comment.