Convert ConfirmDialog test to use React Testing Library

This commit is contained in:
Jon Koops 2021-07-07 12:09:47 +02:00 committed by Jon Koops
parent ffe9f74294
commit ad7b77503a

View file

@ -1,9 +1,9 @@
import { fireEvent, screen, render } from "@testing-library/react";
import React from "react"; import React from "react";
import { mount } from "enzyme"; import { useConfirmDialog } from "./ConfirmDialog";
import { useConfirmDialog } from "../ConfirmDialog";
describe("Confirmation dialog", () => { describe("ConfirmDialog", () => {
it("renders simple confirm dialog", () => { it("renders a simple confirm dialog", () => {
const onConfirm = jest.fn(); const onConfirm = jest.fn();
const Test = () => { const Test = () => {
const [toggle, ConfirmDialog] = useConfirmDialog({ const [toggle, ConfirmDialog] = useConfirmDialog({
@ -13,9 +13,10 @@ describe("Confirmation dialog", () => {
continueButtonLabel: "Delete", continueButtonLabel: "Delete",
onConfirm: onConfirm, onConfirm: onConfirm,
}); });
return ( return (
<> <>
<button id="show" onClick={toggle}> <button data-testid="show" onClick={toggle}>
Show Show
</button> </button>
<ConfirmDialog /> <ConfirmDialog />
@ -23,13 +24,13 @@ describe("Confirmation dialog", () => {
); );
}; };
const simple = mount(<Test />); render(<Test />);
simple.find("#show").simulate("click"); fireEvent.click(screen.getByTestId("show"));
const button = simple.find("#modal-confirm").find("button"); const confirmButton = screen.getByTestId("modalConfirm");
expect(button).not.toBeNull(); expect(confirmButton).toBeInTheDocument();
button!.simulate("click"); fireEvent.click(confirmButton);
expect(onConfirm).toBeCalled(); expect(onConfirm).toBeCalled();
}); });
}); });