Skip to content

Commit c164087

Browse files
BrunoQuaresmaBrunoQuaresma
committed
Refactor ConfirmDialog tests
1 parent 70ef3da commit c164087

File tree

2 files changed

+38
-127
lines changed

2 files changed

+38
-127
lines changed

‎site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.stories.tsx

Lines changed: 37 additions & 38 deletions
Original file line numberDiff line numberDiff line change
@@ -1,58 +1,57 @@
11
import { action } from "@storybook/addon-actions";
2-
import { ComponentMeta, Story } from "@storybook/react";
3-
import { ConfirmDialog, ConfirmDialogProps } from "./ConfirmDialog";
2+
import type { Meta, StoryObj } from "@storybook/react";
3+
import { ConfirmDialog } from "./ConfirmDialog";
44

5-
export default {
6-
title: "Components/Dialogs/ConfirmDialog",
5+
const meta: Meta<typeof ConfirmDialog> = {
6+
title: "components/Dialogs/ConfirmDialog",
77
component: ConfirmDialog,
8-
argTypes: {
9-
open: {
10-
control: "boolean",
11-
},
12-
},
138
args: {
149
onClose: action("onClose"),
1510
onConfirm: action("onConfirm"),
1611
open: true,
1712
title: "Confirm Dialog",
1813
},
19-
} as ComponentMeta<typeof ConfirmDialog>;
14+
};
2015

21-
const Template: Story<ConfirmDialogProps> = (args) => (
22-
<ConfirmDialog {...args} />
23-
);
16+
export default meta;
17+
type Story = StoryObj<typeof ConfirmDialog>;
2418

25-
export const DeleteDialog = Template.bind({});
26-
DeleteDialog.args = {
27-
description: "Do you really want to delete me?",
28-
hideCancel: false,
29-
type: "delete",
19+
export const Example: Story = {
20+
args: {
21+
description: "Do you really want to delete me?",
22+
hideCancel: false,
23+
type: "delete",
24+
},
3025
};
3126

32-
export const InfoDialog = Template.bind({});
33-
InfoDialog.args = {
34-
description: "Information is cool!",
35-
hideCancel: true,
36-
type: "info",
27+
export const InfoDialog: Story = {
28+
args: {
29+
description: "Information is cool!",
30+
hideCancel: true,
31+
type: "info",
32+
},
3733
};
3834

39-
export const InfoDialogWithCancel = Template.bind({});
40-
InfoDialogWithCancel.args = {
41-
description: "Information can be cool!",
42-
hideCancel: false,
43-
type: "info",
35+
export const InfoDialogWithCancel: Story = {
36+
args: {
37+
description: "Information can be cool!",
38+
hideCancel: false,
39+
type: "info",
40+
},
4441
};
4542

46-
export const SuccessDialog = Template.bind({});
47-
SuccessDialog.args = {
48-
description: "I am successful.",
49-
hideCancel: true,
50-
type: "success",
43+
export const SuccessDialog: Story = {
44+
args: {
45+
description: "I am successful.",
46+
hideCancel: true,
47+
type: "success",
48+
},
5149
};
5250

53-
export const SuccessDialogWithCancel = Template.bind({});
54-
SuccessDialogWithCancel.args = {
55-
description: "I may be successful.",
56-
hideCancel: false,
57-
type: "success",
51+
export const SuccessDialogWithCancel: Story = {
52+
args: {
53+
description: "I may be successful.",
54+
hideCancel: false,
55+
type: "success",
56+
},
5857
};

‎site/src/components/Dialogs/ConfirmDialog/ConfirmDialog.test.tsx

Lines changed: 1 addition & 89 deletions
Original file line numberDiff line numberDiff line change
@@ -1,96 +1,8 @@
11
import { fireEvent, screen } from "@testing-library/react";
2-
import { ConfirmDialog, ConfirmDialogProps } from "./ConfirmDialog";
2+
import { ConfirmDialog } from "./ConfirmDialog";
33
import { render } from "testHelpers/renderHelpers";
44

55
describe("ConfirmDialog", () => {
6-
it("renders", () => {
7-
// Given
8-
const onCloseMock = jest.fn();
9-
const props = {
10-
onClose: onCloseMock,
11-
open: true,
12-
title: "Test",
13-
};
14-
15-
// When
16-
render(<ConfirmDialog {...props} />);
17-
18-
// Then
19-
expect(screen.getByRole("dialog")).toBeDefined();
20-
});
21-
22-
it("does not display cancel for info dialogs", () => {
23-
// Given (note that info is the default)
24-
const onCloseMock = jest.fn();
25-
const props = {
26-
cancelText: "CANCEL",
27-
onClose: onCloseMock,
28-
open: true,
29-
title: "Test",
30-
};
31-
32-
// When
33-
render(<ConfirmDialog {...props} />);
34-
35-
// Then
36-
expect(screen.queryByText("CANCEL")).toBeNull();
37-
});
38-
39-
it("can display cancel when normally hidden", () => {
40-
// Given
41-
const onCloseMock = jest.fn();
42-
const props = {
43-
cancelText: "CANCEL",
44-
onClose: onCloseMock,
45-
open: true,
46-
title: "Test",
47-
hideCancel: false,
48-
};
49-
50-
// When
51-
render(<ConfirmDialog {...props} />);
52-
53-
// Then
54-
expect(screen.getByText("CANCEL")).toBeDefined();
55-
});
56-
57-
it("displays cancel for delete dialogs", () => {
58-
// Given
59-
const onCloseMock = jest.fn();
60-
const props: ConfirmDialogProps = {
61-
cancelText: "CANCEL",
62-
onClose: onCloseMock,
63-
open: true,
64-
title: "Test",
65-
type: "delete",
66-
};
67-
68-
// When
69-
render(<ConfirmDialog {...props} />);
70-
71-
// Then
72-
expect(screen.getByText("CANCEL")).toBeDefined();
73-
});
74-
75-
it("can hide cancel when normally visible", () => {
76-
// Given
77-
const onCloseMock = jest.fn();
78-
const props: ConfirmDialogProps = {
79-
cancelText: "CANCEL",
80-
onClose: onCloseMock,
81-
open: true,
82-
title: "Test",
83-
hideCancel: true,
84-
type: "delete",
85-
};
86-
87-
// When
88-
render(<ConfirmDialog {...props} />);
89-
90-
// Then
91-
expect(screen.queryByText("CANCEL")).toBeNull();
92-
});
93-
946
it("onClose is called when cancelled", () => {
957
// Given
968
const onCloseMock = jest.fn();

0 commit comments

Comments
 (0)