Skip to content

Commit d49843d

Browse files
RyukemeisterRyukemeister
authored
fix: update e2e tests for event types (calcom#23322)
* add data test id for testing * update tests for creating event type * add test for creating team event types * helper function for tests * update tests * update tests * fixup: fix correct data test ids for tabs
1 parent 42efd95 commit d49843d

5 files changed

Lines changed: 222 additions & 11 deletions

File tree

‎packages/platform/examples/base/src/lib/generateRandomText.ts‎

Lines changed: 21 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,21 @@
1+
import { words as randomWords } from "./words";
2+
3+
export function generateRandomText(): string {
4+
const words = randomWords;
5+
6+
const randomLength = Math.floor(Math.random() * 20) + 5;
7+
let result = "";
8+
9+
for (let i = 0; i < randomLength; i++) {
10+
const randomWord = words[Math.floor(Math.random() * words.length)];
11+
if (i === 0) {
12+
result += randomWord.charAt(0).toUpperCase() + randomWord.slice(1);
13+
} else {
14+
result += ` ${randomWord}`;
15+
}
16+
}
17+
18+
result += ".";
19+
20+
return result;
21+
}

‎packages/platform/examples/base/src/lib/words.ts‎

Lines changed: 68 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,68 @@
1+
export const words = [
2+
"lorem",
3+
"ipsum",
4+
"dolor",
5+
"sit",
6+
"amet",
7+
"consectetur",
8+
"adipiscing",
9+
"elit",
10+
"sed",
11+
"do",
12+
"eiusmod",
13+
"tempor",
14+
"incididunt",
15+
"ut",
16+
"labore",
17+
"et",
18+
"dolore",
19+
"magna",
20+
"aliqua",
21+
"ut",
22+
"enim",
23+
"ad",
24+
"minim",
25+
"veniam",
26+
"quis",
27+
"nostrud",
28+
"exercitation",
29+
"ullamco",
30+
"laboris",
31+
"nisi",
32+
"aliquip",
33+
"ex",
34+
"ea",
35+
"commodo",
36+
"consequat",
37+
"duis",
38+
"aute",
39+
"irure",
40+
"dolor",
41+
"in",
42+
"reprehenderit",
43+
"voluptate",
44+
"velit",
45+
"esse",
46+
"cillum",
47+
"dolore",
48+
"eu",
49+
"fugiat",
50+
"nulla",
51+
"pariatur",
52+
"excepteur",
53+
"sint",
54+
"occaecat",
55+
"cupidatat",
56+
"non",
57+
"proident",
58+
"sunt",
59+
"culpa",
60+
"qui",
61+
"officia",
62+
"deserunt",
63+
"mollit",
64+
"anim",
65+
"id",
66+
"est",
67+
"laborum",
68+
];

‎packages/platform/examples/base/src/pages/event-types.tsx‎

Lines changed: 10 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -33,13 +33,13 @@ export default function Bookings(props: { calUsername: string; calEmail: string
3333
const handleSubmit = () => {
3434
eventTypeRef.current?.handleFormSubmit({
3535
onSuccess: () => {
36-
console.log('Event type updated successfully');
36+
console.log("Event type updated successfully");
3737
// Additional success handling logic here
3838
},
3939
onError: (error) => {
40-
console.error('Error updating event type:', error);
40+
console.error("Error updating event type:", error);
4141
// Additional error handling logic here
42-
}
42+
},
4343
});
4444
};
4545
const { isLoading: isLoadingEvents, data: eventTypes, refetch } = useEventTypes(props.calUsername);
@@ -73,13 +73,14 @@ export default function Bookings(props: { calUsername: string; calEmail: string
7373

7474
return (
7575
<div
76+
data-testid="event-type-card"
7677
onClick={() => {
7778
setEventTypeId(event.id);
7879
setIsTeamEvent(false);
7980
}}
8081
className="mx-10 w-[80vw] cursor-pointer rounded-md border-[0.8px] border-black px-10 py-4"
8182
key={event.id}>
82-
<h1 className="text-lg font-semibold">{formatEventSlug}</h1>
83+
<h1 className="text-lg font-semibold">{event.title}</h1>
8384
<p>{`/${event.slug}`}</p>
8485
<span className="border-none bg-gray-800 px-2 text-white">{event?.lengthInMinutes}</span>
8586
</div>
@@ -101,13 +102,14 @@ export default function Bookings(props: { calUsername: string; calEmail: string
101102

102103
return (
103104
<div
105+
data-testid="team-event-type-card"
104106
onClick={() => {
105107
setEventTypeId(event.id);
106108
setIsTeamEvent(true);
107109
}}
108110
className="mx-10 w-[80vw] cursor-pointer rounded-md border-[0.8px] border-black px-10 py-4"
109111
key={event.id}>
110-
<h1 className="text-lg font-semibold">{formatEventSlug}</h1>
112+
<h1 className="text-lg font-semibold">{event.title}</h1>
111113
<p>{`/${event.slug}`}</p>
112114
<span className="border-none bg-gray-800 px-2 text-white">{event?.lengthInMinutes}</span>
113115
</div>
@@ -117,7 +119,7 @@ export default function Bookings(props: { calUsername: string; calEmail: string
117119
</div>
118120
)}
119121
{eventTypeId && (
120-
<div>
122+
<div data-testid="event-type-settings-atom">
121123
<EventTypeSettings
122124
customClassNames={{
123125
atomsWrapper: "!w-[50vw] !m-auto",
@@ -785,7 +787,7 @@ export default function Bookings(props: { calUsername: string; calEmail: string
785787

786788
{!eventTypeId && (
787789
<div className="mt-8 flex flex-row items-center justify-center gap-24">
788-
<div className="flex w-[30vw] flex-col gap-2">
790+
<div data-testid="create-event-type-atom" className="flex w-[30vw] flex-col gap-2">
789791
<h1 className="font-semibold">Create Event Type</h1>
790792
<CreateEventType
791793
customClassNames={{
@@ -798,7 +800,7 @@ export default function Bookings(props: { calUsername: string; calEmail: string
798800
/>
799801
</div>
800802

801-
<div className="flex w-[30vw] flex-col gap-2">
803+
<div data-testid="create-team-event-type-atom" className="flex w-[30vw] flex-col gap-2">
802804
<h1 className="font-semibold">Create Team Event Type</h1>
803805
{teams?.[0]?.id && (
804806
<CreateEventType

‎packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts‎

Lines changed: 47 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,7 @@
11
import { test, expect } from "@playwright/test";
22

3+
import { generateRandomText } from "../../src/lib/generateRandomText";
4+
35
test("create event type using CreateEventTypeAtom", async ({ page }) => {
46
await page.goto("/");
57

@@ -9,13 +11,55 @@ test("create event type using CreateEventTypeAtom", async ({ page }) => {
911

1012
await expect(page.locator("body")).toBeVisible();
1113

12-
await page.fill('[data-testid="event-type-quick-chat"]', "e2e event");
14+
await page.fill('[data-testid="event-type-quick-chat"]', "Individual e2e event");
1315

1416
await page.fill('textarea[placeholder="A quick video meeting."]', "This is an e2e test event description");
1517

1618
await page.waitForSelector('button[type="submit"]:has-text("Continue")', { state: "visible" });
1719
await page.click('button[type="submit"]:has-text("Continue")');
1820

19-
await expect(page.locator('h1:has-text("E2e Event")')).toBeVisible();
20-
await expect(page.locator('p:has-text("/e2e-event")')).toBeVisible();
21+
await expect(page.locator('h1:has-text("Individual e2e event")')).toBeVisible();
22+
await expect(page.locator('p:has-text("/individual-e2e-event")')).toBeVisible();
23+
24+
await page.locator('[data-testid="event-type-card"] h1:has-text("Individual e2e event")').click();
25+
26+
await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible();
27+
28+
await expect(page.locator('[data-testid="vertical-tab-availability"]')).toBeVisible();
29+
await page.locator('[data-testid="vertical-tab-availability"]').click();
30+
31+
await expect(page.locator('[data-testid="vertical-tab-event_limit_tab_title"]')).toBeVisible();
32+
await page.locator('[data-testid="vertical-tab-event_limit_tab_title"]').click();
33+
34+
await expect(page.locator('[data-testid="vertical-tab-event_advanced_tab_title"]')).toBeVisible();
35+
await page.locator('[data-testid="vertical-tab-event_advanced_tab_title"]').click();
36+
37+
await expect(page.locator('[data-testid="vertical-tab-recurring"]')).toBeVisible();
38+
await page.locator('[data-testid="vertical-tab-recurring"]').click();
39+
40+
await expect(page.locator('[data-testid="vertical-tab-payments"]')).toBeVisible();
41+
await page.locator('[data-testid="vertical-tab-payments"]').click();
42+
43+
await expect(page.locator('[data-testid="vertical-tab-basics"]')).toBeVisible();
44+
await page.locator('[data-testid="vertical-tab-basics"]').click();
45+
46+
await expect(page.locator('textarea[name="description"]')).toBeVisible();
47+
await page.fill('textarea[name="description"]', generateRandomText());
48+
49+
await page.locator('[data-testid="update-eventtype"]').click();
50+
51+
await expect(page.locator('h1:has-text("Individual e2e event")')).toBeVisible();
52+
await expect(page.locator('p:has-text("/individual-e2e-event")')).toBeVisible();
53+
54+
await page.locator('[data-testid="event-type-card"] h1:has-text("E2e Event")').click();
55+
56+
await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible();
57+
58+
await page.locator('button[type="button"][tooltip="Delete"]').waitFor({ state: "visible" });
59+
await page.locator('button[type="button"][tooltip="Delete"]').click();
60+
61+
await page.locator('[data-testid="dialog-creation"]').waitFor({ state: "visible" });
62+
await page.locator('[data-testid="dialog-confirmation"]').click();
63+
64+
await expect(page.locator("body")).toBeVisible();
2165
});

‎packages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts‎

Lines changed: 76 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,76 @@
1+
import { test, expect } from "@playwright/test";
2+
3+
import { generateRandomText } from "../../src/lib/generateRandomText";
4+
5+
test("create team event using CreateTeamEventTypeAtom", async ({ page }) => {
6+
await page.goto("/");
7+
8+
await page.goto("/event-types");
9+
10+
await expect(page).toHaveURL("/event-types");
11+
12+
await expect(page.locator("body")).toBeVisible();
13+
14+
await page.fill(
15+
'[data-testid="create-team-event-type-atom"] [data-testid="event-type-quick-chat"]',
16+
"Platform team e2e event"
17+
);
18+
19+
await page.waitForSelector(
20+
'[data-testid="create-team-event-type-atom"] button[type="submit"]:has-text("Continue")',
21+
{ state: "visible" }
22+
);
23+
await page.locator('[data-testid="create-team-event-type-atom"] button[value="COLLECTIVE"]').check();
24+
25+
await page
26+
.locator('[data-testid="create-team-event-type-atom"] button[type="submit"]:has-text("Continue")')
27+
.click();
28+
29+
await expect(page.locator('h1:has-text("Platform team e2e event")')).toBeVisible();
30+
await expect(page.locator('p:has-text("/platform-team-e2e-event")')).toBeVisible();
31+
32+
await page.locator('[data-testid="team-event-type-card"] h1:has-text("Platform team e2e event")').click();
33+
34+
await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible();
35+
36+
await expect(page.locator('[data-testid="vertical-tab-availability"]')).toBeVisible();
37+
await page.locator('[data-testid="vertical-tab-availability"]').click();
38+
39+
await expect(page.locator('[data-testid="vertical-tab-assignment"]')).toBeVisible();
40+
await page.locator('[data-testid="vertical-tab-assignment"]').click();
41+
42+
await expect(page.locator('[data-testid="vertical-tab-event_limit_tab_title"]')).toBeVisible();
43+
await page.locator('[data-testid="vertical-tab-event_limit_tab_title"]').click();
44+
45+
await expect(page.locator('[data-testid="vertical-tab-event_advanced_tab_title"]')).toBeVisible();
46+
await page.locator('[data-testid="vertical-tab-event_advanced_tab_title"]').click();
47+
48+
await expect(page.locator('[data-testid="vertical-tab-recurring"]')).toBeVisible();
49+
await page.locator('[data-testid="vertical-tab-recurring"]').click();
50+
51+
await expect(page.locator('[data-testid="vertical-tab-payments"]')).toBeVisible();
52+
await page.locator('[data-testid="vertical-tab-payments"]').click();
53+
54+
await expect(page.locator('[data-testid="vertical-tab-basics"]')).toBeVisible();
55+
await page.locator('[data-testid="vertical-tab-basics"]').click();
56+
57+
await expect(page.locator('textarea[name="description"]')).toBeVisible();
58+
await page.fill('textarea[name="description"]', generateRandomText());
59+
60+
await page.locator('[data-testid="update-eventtype"]').click();
61+
62+
await expect(page.locator('h1:has-text("Platform team e2e event")')).toBeVisible();
63+
await expect(page.locator('p:has-text("/platform-team-e2e-event")')).toBeVisible();
64+
65+
await page.locator('[data-testid="team-event-type-card"] h1:has-text("Platform team e2e event")').click();
66+
67+
await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible();
68+
69+
await page.locator('button[type="button"][tooltip="Delete"]').waitFor({ state: "visible" });
70+
await page.locator('button[type="button"][tooltip="Delete"]').click();
71+
72+
await page.locator('[data-testid="dialog-creation"]').waitFor({ state: "visible" });
73+
await page.locator('[data-testid="dialog-confirmation"]').click();
74+
75+
await expect(page.locator("body")).toBeVisible();
76+
});

0 commit comments

Comments
 (0)