fix: update e2e tests for event types#23322
Conversation
WalkthroughThis PR updates event-types UI to display event.title (replacing the previously shown formatEventSlug), adds data-testid attributes to event-type and team-event-type cards, the EventTypeSettings wrapper, and the two creation panels, and makes minor formatting edits. It adds two Playwright E2E tests covering create/edit/delete flows for individual and team event types (including navigation of vertical tabs and description updates) and introduces helper modules generateRandomText and words used by those tests. Possibly related PRs
Tip 🔌 Remote MCP (Model Context Protocol) integration is now available!Pro plan users can now connect to remote MCP servers from the Integrations page. Connect with popular remote MCPs such as Notion and Linear to add more context to your reviews and chats. 📜 Recent review detailsConfiguration used: Path: .coderabbit.yaml Review profile: CHILL Plan: Pro 💡 Knowledge Base configuration:
You can enable these sources in your CodeRabbit configuration. 📒 Files selected for processing (2)
🚧 Files skipped from review as they are similar to previous changes (2)
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (8)
✨ Finishing Touches
🧪 Generate unit tests
Thanks for using CodeRabbit! It's free for OSS, and your support helps us grow. If you like it, consider giving us a shout-out. 🪧 TipsChatThere are 3 ways to chat with CodeRabbit:
SupportNeed help? Create a ticket on our support page for assistance with any issues or questions. CodeRabbit Commands (Invoked using PR/Issue comments)Type Other keywords and placeholders
Status, Documentation and Community
|
|
The latest updates on your projects. Learn more about Vercel for GitHub. |
Graphite Automations"Add consumer team as reviewer" took an action on this PR • (08/25/25)1 reviewer was added to this PR based on Keith Williams's automation. |
There was a problem hiding this comment.
Actionable comments posted: 3
Caution
Some comments are outside the diff and can’t be posted inline due to platform limitations.
⚠️ Outside diff range comments (1)
packages/platform/examples/base/src/pages/event-types.tsx (1)
47-52: Prevent Unintended Queries WhenteamIdIs FalsyThe hook
useTeamEventTypes(teamId: number)is always issuing a request—even when passed0, which happens beforeteamshas loaded—and will hit
/organizations/{org}/teams/0/event-types, resulting in 404s or unnecessary network noise.To address this, we need to:
• Update the hook signature to accept React Query options and default
enabledtoBoolean(teamId).
packages/platform/atoms/hooks/event-types/public/useTeamEventTypes.tsimport { useQuery, UseQueryOptions } from "react-query"; import { useAtomsContext } from "../../useAtomsContext"; export const QUERY_KEY = "use-team-event-types"; - export const useTeamEventTypes = (teamId: number) => { + export const useTeamEventTypes = ( + teamId: number, + options?: UseQueryOptions<any, Error> + ) => { const { organizationId } = useAtomsContext(); const pathname = `/organizations/${organizationId}/teams/${teamId}/event-types`; + + return useQuery( + [QUERY_KEY, organizationId, teamId], + () => fetch(pathname).then(res => res.json()), + { enabled: Boolean(teamId), ...options } + ); };• Change both example pages to pass the
enabledflag instead of defaulting to0:
packages/platform/examples/base/src/pages/booking.tsx (line 19) &
packages/platform/examples/base/src/pages/event-types.tsx (line 51)- const { - isLoading: isLoadingTeamEvents, - data: teamEventTypes, - refetch: refetchTeamEvents, - } = useTeamEventTypes(teams?.[0]?.id || 0); + const teamId = teams?.[0]?.id ?? 0; + const { + isLoading: isLoadingTeamEvents, + data: teamEventTypes, + refetch: refetchTeamEvents, + } = useTeamEventTypes(teamId, { enabled: Boolean(teamId) });This ensures no network request is made until a valid
teamIdis available.
🧹 Nitpick comments (10)
packages/platform/examples/base/src/pages/event-types.tsx (5)
69-84: Remove unused slug formatter and add a stable selector for cards
formatEventSlugis computed but never used. Drop it to reduce noise.- While the new
data-testid="event-type-card"is helpful, tests currently rely on text matching. Add a stable attribute keyed by slug so tests can target the exact card without depending on title case.Apply:
- const formatEventSlug = event.slug - .split("-") - .map((item) => `${item[0].toLocaleUpperCase()}${item.slice(1)}`) - .join(" "); - return ( <div data-testid="event-type-card" + data-event-slug={event.slug} onClick={() => { setEventTypeId(event.id); setIsTeamEvent(false); }} className="mx-10 w-[80vw] cursor-pointer rounded-md border-[0.8px] border-black px-10 py-4" key={event.id}> <h1 className="text-lg font-semibold">{event.title}</h1> <p>{`/${event.slug}`}</p> <span className="border-none bg-gray-800 px-2 text-white">{event?.lengthInMinutes}</span> </div> );
98-115: Mirror the cleanup and selector improvement for team event type cardsSame as above: remove the unused
formatEventSlugand expose a stable slug-based attribute for tests.- const formatEventSlug = event.slug - .split("-") - .map((item) => `${item[0].toLocaleUpperCase()}${item.slice(1)}`) - .join(" "); - return ( <div data-testid="team-event-type-card" + data-event-slug={event.slug} onClick={() => { setEventTypeId(event.id); setIsTeamEvent(true); }} className="mx-10 w-[80vw] cursor-pointer rounded-md border-[0.8px] border-black px-10 py-4" key={event.id}> <h1 className="text-lg font-semibold">{event.title}</h1> <p>{`/${event.slug}`}</p> <span className="border-none bg-gray-800 px-2 text-white">{event?.lengthInMinutes}</span> </div> );
33-44: Console messages OK; consider aligning success/error hooks with a user-visible assertionThe updated console messages are fine. For E2E robustness, consider exposing a toast/snackbar (or a data-testid flag) upon success/error so tests can await a deterministic UI signal instead of relying on timing.
790-797: Good: test ids for creation panels; localize headingsThe new
data-testid="create-event-type-atom"anddata-testid="create-team-event-type-atom"are helpful. However, static headings (“Create Event Type”, “Create Team Event Type”) should uset()per guidelines.Example:
- <h1 className="font-semibold">Create Event Type</h1> + <h1 className="font-semibold">{t("create_event_type")}</h1> - <h1 className="font-semibold">Create Team Event Type</h1> + <h1 className="font-semibold">{t("create_team_event_type")}</h1>Also applies to: 803-824
59-61: Front-end strings should use t()Directly embedded strings violate the localization guideline for TSX files. Please wrap these with
t():
- Title “EventTypes…”
- “Loading…”
- “Team event types”
- “Validate Form”, “Submit Form”
I can sweep this file and raise a follow-up PR wiring
t()and adding missing keys.Also applies to: 63-63, 95-95, 777-778, 781-783
packages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts (2)
21-22: Prefer role-based or explicit test id selectors over .check() on a button
.check()is intended for inputs or elements with role=radio/checkbox. If the UI uses a button to mimic a radio,.check()may be brittle.Options:
- If accessible role is present:
- await page.locator('[data-testid="create-team-event-type-atom"] button[value="COLLECTIVE"]').check(); + await page.getByRole("radio", { name: /collective/i }).check();
- Otherwise, just click:
- await page.locator('[data-testid="create-team-event-type-atom"] button[value="COLLECTIVE"]').check(); + await page.locator('[data-testid="create-team-event-type-atom"] button[value="COLLECTIVE"]').click();
66-71: Use accessible name for the Delete actionTargeting a
tooltipattribute is fragile. Prefer the accessible role/name or a test id.- await page.locator('button[type="button"][tooltip="Delete"]').waitFor({ state: "visible" }); - await page.locator('button[type="button"][tooltip="Delete"]').click(); + const deleteBtn = page.getByRole("button", { name: /^delete$/i }); + await deleteBtn.waitFor({ state: "visible" }); + await deleteBtn.click();packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts (3)
12-18: Scope selectors to the creation panel to avoid accidental matches and i18n brittleness
- Scope inputs and buttons within the creation atom.
- Avoid relying on placeholder/default text that may change with localization.
- await page.fill('[data-testid="event-type-quick-chat"]', "e2e event"); + await page.fill('[data-testid="create-event-type-atom"] [data-testid="event-type-quick-chat"]', "e2e event"); - await page.fill('textarea[placeholder="A quick video meeting."]', "This is an e2e test event description"); + // Prefer a data-testid on the description input; if unavailable, keep this as a fallback but scope it: + await page.fill('[data-testid="create-event-type-atom"] textarea[placeholder="A quick video meeting."]', "This is an e2e test event description"); - await page.waitForSelector('button[type="submit"]:has-text("Continue")', { state: "visible" }); - await page.click('button[type="submit"]:has-text("Continue")'); + await page.waitForSelector( + '[data-testid="create-event-type-atom"] button[type="submit"]:has-text("Continue")', + { state: "visible" } + ); + await page.click('[data-testid="create-event-type-atom"] button[type="submit"]:has-text("Continue")');
22-25: Avoid title-dependent card selection; use slug or a stable attributeMatching by “E2e Event” ties the test to title-casing. Prefer slug-based targeting.
- await page.locator('[data-testid="event-type-card"] h1:has-text("E2e Event")').click(); + await page + .getByTestId("event-type-card") + .filter({ has: page.locator('p:has-text("/e2e-event")') }) + .click();If you add
data-event-slugon the page:+ await page.locator('[data-testid="event-type-card"][data-event-slug="e2e-event"]').click();
55-60: Prefer accessible role/name or test id for destructive actionsThe tooltip attribute is a fragile selector.
- await page.locator('button[type="button"][tooltip="Delete"]').waitFor({ state: "visible" }); - await page.locator('button[type="button"][tooltip="Delete"]').click(); + const deleteBtn = page.getByRole("button", { name: /^delete$/i }); + await deleteBtn.waitFor({ state: "visible" }); + await deleteBtn.click();
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (3)
packages/platform/examples/base/src/pages/event-types.tsx(6 hunks)packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts(1 hunks)packages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts(1 hunks)
🧰 Additional context used
📓 Path-based instructions (4)
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
**/*.ts: For Prisma queries, only select data you need; never useinclude, always useselect
Ensure thecredential.keyfield is never returned from tRPC endpoints or APIs
Files:
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.tspackages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Flag excessive Day.js use in performance-critical code; prefer native Date or Day.js
.utc()in hot paths like loops
Files:
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.tspackages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.tspackages/platform/examples/base/src/pages/event-types.tsx
**/*.{ts,tsx,js,jsx}
⚙️ CodeRabbit configuration file
Flag default exports and encourage named exports. Named exports provide better tree-shaking, easier refactoring, and clearer imports. Exempt main components like pages, layouts, and components that serve as the primary export of a module.
Files:
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.tspackages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.tspackages/platform/examples/base/src/pages/event-types.tsx
**/*.tsx
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Always use
t()for text localization in frontend code; direct text embedding should trigger a warning
Files:
packages/platform/examples/base/src/pages/event-types.tsx
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (2)
- GitHub Check: Type check / check-types
- GitHub Check: Tests / Unit
🔇 Additional comments (1)
packages/platform/examples/base/src/pages/event-types.tsx (1)
121-123: Nice: dedicated wrapper test id for settings
data-testid="event-type-settings-atom"makes the settings pane reliably targetable in E2E. LGTM.
| await page.locator('[data-testid="dialog-creation"]').waitFor({ state: "visible" }); | ||
| await page.locator('[data-testid="dialog-confirmation"]').click(); | ||
|
|
||
| await expect(page.locator("body")).toBeVisible(); |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Verify the event is actually deleted
Replace the generic body visibility assertion with a check that the specific card for /e2e-event is gone.
- await expect(page.locator("body")).toBeVisible();
+ await expect(
+ page.getByTestId("event-type-card").filter({ has: page.locator('p:has-text("/e2e-event")') })
+ ).toHaveCount(0);📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await expect(page.locator("body")).toBeVisible(); | |
| await expect( | |
| page.getByTestId("event-type-card").filter({ has: page.locator('p:has-text("/e2e-event")') }) | |
| ).toHaveCount(0); |
🤖 Prompt for AI Agents
In
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts
around line 61, replace the generic await
expect(page.locator("body")).toBeVisible(); with a targeted assertion that the
specific event card for "/e2e-event" no longer exists; locate the card (by its
text, data-testid, or unique selector that contains "/e2e-event") and assert it
is absent (e.g., not visible or has count 0) so the test verifies the event was
actually deleted.
| await expect(page.locator('h1:has-text("Platform Team E2e Event")')).toBeVisible(); | ||
| await expect(page.locator('p:has-text("/platform-team-e2e-event")')).toBeVisible(); | ||
|
|
||
| await page.locator('[data-testid="team-event-type-card"] h1:has-text("Platform team e2e event")').click(); | ||
|
|
There was a problem hiding this comment.
Title-case mismatch makes the test flaky; target by slug instead
You assert the title in Title Case but click a card matching the lowercased input. This can fail depending on how event.title is normalized. Use the slug as a stable selector.
Apply:
- await expect(page.locator('h1:has-text("Platform Team E2e Event")')).toBeVisible();
- await expect(page.locator('p:has-text("/platform-team-e2e-event")')).toBeVisible();
-
- await page.locator('[data-testid="team-event-type-card"] h1:has-text("Platform team e2e event")').click();
+ await expect(page.locator('p:has-text("/platform-team-e2e-event")')).toBeVisible();
+ await page
+ .getByTestId("team-event-type-card")
+ .filter({ has: page.locator('p:has-text("/platform-team-e2e-event")') })
+ .click();If you accept the page changes suggested to expose data-event-slug, this becomes even cleaner:
+ await page.locator('[data-testid="team-event-type-card"][data-event-slug="platform-team-e2e-event"]').click();Also applies to: 30-31
🤖 Prompt for AI Agents
In
packages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts
around lines 27 to 31, the test targets the card by a title-case h1 which can be
flaky due to normalization; change the selector to target a stable slug
attribute instead (e.g., use data-event-slug or data-testid including the slug)
so the click and assertions use the event slug selector; update both occurrences
on lines 30-31 to click and assert via the slug-based data attribute (add the
attribute to the page/component if not present).
| await page.locator('[data-testid="dialog-creation"]').waitFor({ state: "visible" }); | ||
| await page.locator('[data-testid="dialog-confirmation"]').click(); | ||
|
|
||
| await expect(page.locator("body")).toBeVisible(); |
There was a problem hiding this comment.
🛠️ Refactor suggestion
Assert actual deletion instead of generic “body visible”
Confirm the specific card is gone to make the test meaningful and resilient.
- await expect(page.locator("body")).toBeVisible();
+ await expect(
+ page.getByTestId("team-event-type-card").filter({ has: page.locator('p:has-text("/platform-team-e2e-event")') })
+ ).toHaveCount(0);📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await expect(page.locator("body")).toBeVisible(); | |
| // … | |
| // instead of a generic “body visible” check: | |
| await expect( | |
| page.getByTestId("team-event-type-card") | |
| .filter({ has: page.locator('p:has-text("/platform-team-e2e-event")') }) | |
| ).toHaveCount(0); | |
| // … |
E2E results are ready! |
Pull request was converted to draft
There was a problem hiding this comment.
Actionable comments posted: 1
♻️ Duplicate comments (1)
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts (1)
63-63: Verify the event is actually deleted (assert card absence)Replace the generic body visibility check with a targeted assertion that the specific event card (by slug) is gone.
- await expect(page.locator("body")).toBeVisible(); + await expect( + page.getByTestId("event-type-card").filter({ has: page.locator('p:has-text("/individual-e2e-event")') }) + ).toHaveCount(0);
🧹 Nitpick comments (9)
packages/platform/examples/base/src/lib/generateRandomText.ts (3)
1-4: Remove redundant aliasing of words importNo need to alias and then reassign. Import
wordsdirectly and drop the extra local assignment.-import { words as randomWords } from "./words"; +import { words } from "./words"; export function generateRandomText(): string { - const words = randomWords;
7-21: Avoid repeated string concatenation; build tokens and joinFor small strings this is fine, but constructing an array of tokens and joining improves clarity and avoids quadratic concatenation costs.
- let result = ""; - - for (let i = 0; i < randomLength; i++) { - const randomWord = words[Math.floor(Math.random() * words.length)]; - if (i === 0) { - result += randomWord.charAt(0).toUpperCase() + randomWord.slice(1); - } else { - result += ` ${randomWord}`; - } - } - - result += "."; - - return result; + const tokens: string[] = Array.from({ length: randomLength }, () => { + return words[Math.floor(Math.random() * words.length)]; + }); + if (tokens.length > 0) { + tokens[0] = tokens[0].charAt(0).toUpperCase() + tokens[0].slice(1); + } + return `${tokens.join(" ")}.`;
6-6: Optionally allow deterministic output for test reproducibilityIf you ever need to assert on the generated description, consider a variant that accepts
{ min = 5, max = 24, rng = Math.random }so tests can inject a seeded RNG. No action needed now; just a consideration if future tests depend on the text itself.packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts (6)
16-16: Prefer stable selectors over placeholder textPlaceholders can change (copy tweaks, i18n). Use the
nameattribute you already rely on later.- await page.fill('textarea[placeholder="A quick video meeting."]', "This is an e2e test event description"); + await page.fill('textarea[name="description"]', "This is an e2e test event description");
18-21: Wait for network to settle after submitting the creation formA brief network idle wait reduces flakiness before asserting on the new page content.
await page.waitForSelector('button[type="submit"]:has-text("Continue")', { state: "visible" }); await page.click('button[type="submit"]:has-text("Continue")'); + await page.waitForLoadState("networkidle"); await expect(page.locator('h1:has-text("Individual e2e event")')).toBeVisible();
24-27: Target the card by its slug to avoid text/casing brittlenessCard titles can change or differ in casing. Anchoring the click via the slug on the same card is more robust.
- await page.locator('[data-testid="event-type-card"] h1:has-text("Individual e2e event")').click(); + await page + .getByTestId("event-type-card") + .filter({ has: page.locator('p:has-text("/individual-e2e-event")') }) + .click();
28-45: Make tab navigation assertions more statefulYou assert visibility then click each tab, which is fine. For stronger coverage and less flake, also assert the tab became active (e.g.,
aria-selected="true") or that an expected panel region became visible for each tab.If helpful, I can propose exact
getByRole('tab', { name: '...' })+toHaveAttribute('aria-selected','true')assertions for each tab.
46-49: Store the generated text; wait for save to settleSaving the generated text in a variable helps with potential follow-up asserts/debugging. Also add a brief settle wait after clicking Update.
- await page.fill('textarea[name="description"]', generateRandomText()); - - await page.locator('[data-testid="update-eventtype"]').click(); + const updatedDescription = generateRandomText(); + await page.fill('textarea[name="description"]', updatedDescription); + await page.getByTestId("update-eventtype").click(); + await page.waitForLoadState("networkidle");
57-61: Scope the Delete action to the settings pane and wait for dialog closeScoping avoids accidental clicks if multiple Delete buttons exist. Also wait for the dialog to detach after confirming.
- await page.locator('button[type="button"][tooltip="Delete"]').waitFor({ state: "visible" }); - await page.locator('button[type="button"][tooltip="Delete"]').click(); + const settingsPane = page.getByTestId("event-type-settings-atom"); + await expect(settingsPane).toBeVisible(); + await settingsPane.getByRole("button", { name: "Delete" }).click(); - await page.locator('[data-testid="dialog-creation"]').waitFor({ state: "visible" }); - await page.locator('[data-testid="dialog-confirmation"]').click(); + await page.getByTestId("dialog-creation").waitFor({ state: "visible" }); + await page.getByTestId("dialog-confirmation").click(); + await page.getByTestId("dialog-creation").waitFor({ state: "detached" });
📜 Review details
Configuration used: Path: .coderabbit.yaml
Review profile: CHILL
Plan: Pro
💡 Knowledge Base configuration:
- MCP integration is disabled by default for public repositories
- Jira integration is disabled by default for public repositories
- Linear integration is disabled by default for public repositories
You can enable these sources in your CodeRabbit configuration.
📒 Files selected for processing (4)
packages/platform/examples/base/src/lib/generateRandomText.ts(1 hunks)packages/platform/examples/base/src/lib/words.ts(1 hunks)packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts(2 hunks)packages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts(1 hunks)
✅ Files skipped from review due to trivial changes (1)
- packages/platform/examples/base/src/lib/words.ts
🚧 Files skipped from review as they are similar to previous changes (1)
- packages/platform/examples/base/tests/create-team-event-type-atom/create-team-event-type.e2e.ts
🧰 Additional context used
📓 Path-based instructions (3)
**/*.ts
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
**/*.ts: For Prisma queries, only select data you need; never useinclude, always useselect
Ensure thecredential.keyfield is never returned from tRPC endpoints or APIs
Files:
packages/platform/examples/base/src/lib/generateRandomText.tspackages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts
**/*.{ts,tsx}
📄 CodeRabbit inference engine (.cursor/rules/review.mdc)
Flag excessive Day.js use in performance-critical code; prefer native Date or Day.js
.utc()in hot paths like loops
Files:
packages/platform/examples/base/src/lib/generateRandomText.tspackages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts
**/*.{ts,tsx,js,jsx}
⚙️ CodeRabbit configuration file
Flag default exports and encourage named exports. Named exports provide better tree-shaking, easier refactoring, and clearer imports. Exempt main components like pages, layouts, and components that serve as the primary export of a module.
Files:
packages/platform/examples/base/src/lib/generateRandomText.tspackages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts
🧬 Code graph analysis (2)
packages/platform/examples/base/src/lib/generateRandomText.ts (1)
packages/platform/examples/base/src/lib/words.ts (1)
words(1-68)
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts (1)
packages/platform/examples/base/src/lib/generateRandomText.ts (1)
generateRandomText(3-21)
⏰ Context from checks skipped due to timeout of 180000ms. You can increase the timeout in your CodeRabbit configuration to a maximum of 15 minutes (900000ms). (1)
- GitHub Check: Install dependencies / Yarn install & cache
🔇 Additional comments (1)
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts (1)
3-3: Good: shared helper import (named export) improves reuseImporting
generateRandomTextfromsrc/libkeeps tests DRY and aligns with our “named exports” guideline.
| await page.locator('[data-testid="event-type-card"] h1:has-text("E2e Event")').click(); | ||
|
|
||
| await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible(); |
There was a problem hiding this comment.
💡 Verification agent
🧩 Analysis chain
Bug: Clicking non-existent/mismatched title ("E2e Event")
You created “Individual e2e event” but later click a card with title “E2e Event”. This is likely to fail or match the wrong element. Click the card scoped by its slug instead (same approach as earlier).
- await page.locator('[data-testid="event-type-card"] h1:has-text("E2e Event")').click();
+ await page
+ .getByTestId("event-type-card")
+ .filter({ has: page.locator('p:has-text("/individual-e2e-event")') })
+ .click();Run this to ensure no other tests rely on the “E2e Event” text:
🏁 Script executed:
#!/bin/bash
# Search for case-sensitive uses of "E2e Event" across the repo with context
rg -n -S -C2 '\bE2e Event\b'Length of output: 738
Fix click selector to use slug instead of incorrect title
The test sets up an event type with slug /individual-e2e-event but then clicks a card titled “E2e Event”, which doesn’t match and will lead to flaky or failing tests. No other occurrences of “E2e Event” were found in the repo, so it’s safe to replace this locator.
• File needing update:
- packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts, line 53
Proposed change:
- await page.locator('[data-testid="event-type-card"] h1:has-text("E2e Event")').click();
+ await page
+ .getByTestId("event-type-card")
+ .filter({ has: page.locator('p:has-text("/individual-e2e-event")') })
+ .click();📝 Committable suggestion
‼️ IMPORTANT
Carefully review the code before committing. Ensure that it accurately replaces the highlighted code, contains no missing lines, and has no issues with indentation. Thoroughly test & benchmark the code to ensure it meets the requirements.
| await page.locator('[data-testid="event-type-card"] h1:has-text("E2e Event")').click(); | |
| await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible(); | |
| await page | |
| .getByTestId("event-type-card") | |
| .filter({ has: page.locator('p:has-text("/individual-e2e-event")') }) | |
| .click(); | |
| await expect(page.locator('[data-testid="event-type-settings-atom"]')).toBeVisible(); |
🤖 Prompt for AI Agents
In
packages/platform/examples/base/tests/create-event-type-atom/create-event-type.e2e.ts
around lines 53 to 55, the test clicks a card by title "E2e Event" but the
created event uses slug "/individual-e2e-event", causing a mismatch; update the
locator to target the card using the slug (e.g. selector that matches
data-testid or attribute containing "individual-e2e-event") so the test reliably
clicks the correct event-type card and then assert the settings atom is visible.
What does this PR do?
Video Demo (if applicable):
Screen.Recording.2025-08-25.at.12.29.24.PM.mov
Mandatory Tasks (DO NOT REMOVE)
How should this be tested?
This can be tested in the examples app