* Reset queue correctly all places
* test: verify UI config persists on second modal open (#27422)
* test: verify UI config persists on second modal open
Co-Authored-By: hariom@cal.com <hariombalhara@gmail.com>
* fix: update iframe selection logic in getEmbedIframe function
Refactor the getEmbedIframe function to improve iframe selection by using a more specific selector and ensuring the last iframe is targeted in cases of repeated modal openings. This change enhances reliability in iframe handling during tests.
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
* fix test
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
* fix: preserve UI config across iframe resets for element-click embeds
For element-click embeds, ui() is called before the iframe exists, and
iframeReset() clears the queue when the modal is opened. This causes UI
config like hideEventTypeDetails, cssVarsPerTheme, and styles to be lost.
This fix stores UI config in a persistent property that survives iframe
resets and applies it when the iframe becomes ready.
Co-Authored-By: joe@cal.com <j.auyeung419@gmail.com>
* test: add assertion to verify hideEventTypeDetails config is applied in element-click embed
Co-Authored-By: joe@cal.com <j.auyeung419@gmail.com>
* Add mergeUiConfig function and related tests for UI configuration merging
- Introduced mergeUiConfig function to handle merging of UI configuration, specifically for cssVarsPerTheme at theme level.
- Added comprehensive tests for mergeUiConfig covering various scenarios including merging themes, handling missing properties, and preserving existing configuration values.
- Updated utils.test.ts to include tests for the new function and ensure correct behavior in different merging situations.
* Fixes
* Remove process import as it breaks embed.js
* Simplify
* fix name
* fix name
* fix: use forEach instead of for...of for URLSearchParams iteration
Co-Authored-By: hariom@cal.com <hariombalhara@gmail.com>
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
* chore: add new view for two step slot selection for embed
* fix: make sure two step slot selection is false by default
* chore: update embed playground to showcase two step slot selection
* chore: add tests
* chore: update embed snippet generator code to include two step slot selection
* chore: update docs
* fix: back button styling
* chore: implement feedback from cubic
* fix: add missing isEnableTwoStepSlotSelectionVisible properties to test mock store
Co-Authored-By: unknown <>
* chore: implement PR feedback
* chore: update slot selection modal
* chore: add prop to hide available times header
* fix: scope two-step slot selection visibility to mobile only
Restores the isMobile check in the timeslot visibility guard to ensure
desktop embeds continue to show the booking UI when two-step slot
selection is enabled. The feature should only hide the timeslot list
on mobile devices.
Addresses Cubic AI review feedback (confidence 9/10).
Co-Authored-By: unknown <>
* fixup: use translations for loading instead of actual word
* fix: type check
* fix: add window.matchMedia mock for jsdom test environment
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: add window.matchMedia mock to packages/testing/src/setupVitest.ts
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: unit tests failing
* add a width style to the two-step slot selection embed container.
* refactor: rename enableTwoStepSlotSelection to useSlotsViewOnSmallScreen
- Rename external-facing embed config option from enableTwoStepSlotSelection to useSlotsViewOnSmallScreen
- Update URL parameter parsing in embed-iframe.ts
- Update type definitions in types.ts and index.d.ts
- Update internal variable names to slotsViewOnSmallScreen for consistency
- Update documentation, playground examples, and tests
Co-Authored-By: hariom@cal.com <hariombalhara@gmail.com>
* Add config to prefill all booking fields so that slot has confirm button along with it
* chore: implement PR feedback
* fix: move twoStepSlotSelection embed outside misc-embeds div to fix e2e test
The e2e test was failing because the misc-embeds div content was
intercepting pointer events on mobile viewport. This follows the same
pattern used for skeletonDemo - the embed is now outside misc-embeds
and the div is hidden when testing this namespace.
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: prevent pointer event interception in twoStepSlotSelection embed
Hide heading and note elements and set pointer-events: none on container
elements while keeping pointer-events: auto on the iframe container.
This prevents the container from intercepting clicks on the iframe
during mobile viewport e2e tests.
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: hide all non-essential content for twoStepSlotSelection e2e test
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: disable pointer-events on body for twoStepSlotSelection e2e test
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: remove pointer-events: auto on container to let clicks pass through to iframe
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: explicitly set pointer-events: none on container and inline-embed-container
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: also set pointer-events: none on html element to prevent interception
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: make .place div fill viewport for twoStepSlotSelection e2e test
Co-Authored-By: rajiv@cal.com <sahalrajiv6900@gmail.com>
* fix: failing embed tests
* fixup
* fixup fixup
* fix: failing tests
* fix: update checks for verifying prefilled date
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
* fix: add tests for embed
* update
* fix test
* fix: use immediate interpolation for cancel button link
- Change from delayed evaluation (${...}) to immediate interpolation (${...})
- Remove unnecessary fallback value and complex expression
- Remove frame.goto() from cancelBookingThroughEmbed as iframe already at cancel page
- Remove unused page parameter from selectFirstAvailableTimeSlotNextMonth
- This aligns with working pattern from line 294 and avoids parser issues with complex expressions + query params
Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
* chore: fix formatting in testUtils
Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
* fix: read popupCancelUid from URL parameter instead of copying rescheduleUid
The cancel button was using the wrong booking UID because it was copying from
popupRescheduleUid instead of reading from the URL parameter. This caused the
embed iframe to never appear when clicking the cancel button, resulting in test
timeouts.
The test navigates to /?popupCancelUid=<booking_uid> which should be read by
the JavaScript, just like popupRescheduleUid is read from its URL parameter.
Co-Authored-By: anik@cal.com <adhabal2002@gmail.com>
* fix
---------
Co-authored-by: Devin AI <158243242+devin-ai-integration[bot]@users.noreply.github.com>
* fix: fixed the flaky tests that failed maximum times
* Update action-based.e2e.ts
* another
* add
* add another
* update
* fix
* add
* fix
* update
* update and add
* fix
* update
* update
* chnages
* chore: updates
* reafactor and following best practice
* fix
* add and update
* update
* update and fix
* fix type
* another test
* update
* Update organization-invitation.e2e.ts
* refactor and update
* fix
* final update
* feat(appStore): add isOAuth config
* refactor(appStore): EventTypeAppSettngsInterface
* refactor(qr_code): split EventTypeAppCardInterface and EventTypeAppSettingsInterface
* feat(appStore): redirect to onboarding for stripe and basecam
* fix(ui/ScrollableArea): overflow indicator not working
* feat(apps): new install app flow
* fix(configureStep): get disabled props for settings
* fix: getAppInstallsBySlug now use teamIds
* chore: Alby to AppSettingsInterface
* chore: Giphy to appsettings interface
* chore: GTM migration
* chore: GT4 - migration
* chore: fathom migration
* chore: paypal
* feat: basecamp migration
* feat: metapixel migration
* feat:plausable
* feat:stripe
* fix merge issues
* fix merge issues in new app install flow steps
* wip: callback to onboarding
* fix: imports
* fix: more imports
* feat: use redirect to onboarding on install flow
* feat: New app install flow 2 (#14077)
* fix: redirect to event-type after oauth flow
* When clicking on install new app button, only redirect to the new app install flow if it is an oAuth app or an app that extends the EventType feature in it's config
* code refactor, skip event-type step
* removed extra consoles
* so that no one can change the eventTypeId in url
* theme support enabled
* only pass eventTypeId instead of whole evetType obj to OmniInstallAppButton
* fix: clicking on event-type gives error and redirects to /apps
* saved appOnboardingRedirectUrl to OAuth State
* fix: a user having no team breaks the onboarding flow
* add optional chaining to appMetadata.extendsFeature and appMetadata.isOAuth;
* encode appOnboardingRedirectUrl
* fix: dark theme ui issues
* skip configure step if no-event types
if user/team does not have event-type then skip configure step and goto apps/installed/[category]
* exclude calendars from apps- onboarding flow
* Update getAppOnboardingRedirectUrl.ts
* fix: On configure step, inputs aren't showing errors
* change route from `apps/onboarding` to `apps/installation`
* fix: flow not correctly working for teams
* should only allow team ADMIN or OWER to install an app to team
* Prevent two payment apps to be enabled
* removed loading state
* Fix type error
* undo new-app-flow from OmniInstallAppButton
* remove OAuth Step, handle step numbering
* fix: redirect url
* getAppOnboardingRedirectUrl refactor
* for debugging
* Revert "for debugging"
This reverts commit b9362c1a8f47f2280e684c213d7ec08d04a8ac4c.
* fix: added toaster
* feat: added support to select multiple events (almost)
* hide button
* Move inner form outside outer form using portal
Due to limitations with nested forms in React Hook Form, moved the inner form outside the outer form using a portal to ensure proper form handling.
* submit buttons refs madness
* removed configure step
we had to use query params to manage selected event-types, between routes which was causing 2 issues:
* each time we selected or unselected an event the whole page was reloaded including getserversideprops being called again and again
* the form was reloaded causing more issues
* removed extra unwanted code
* small fix
* fix: type error
* fix: types
* implemented suggested changes
* removed step footer
* fixed error.message
* removed commented styles
* removed step footer
* fix: Display team event types instead of user's on event types step when team selected
* fix: typo
* removed shouldLockDisableProps
* refactor setUpdatedEventTypesStatus, fix type
* removed extra code
* can't delete while saving
* added translations
* fix: loading in select account step, fix handle onSelect params type
* Fix typo
---------
Co-authored-by: Joe Au-Yeung <j.auyeung419@gmail.com>
* fix: type errors
* fix: failing tests
---------
Co-authored-by: sean-brydon <sean@cal.com>
Co-authored-by: Keith Williams <keithwillcode@gmail.com>
Co-authored-by: Joe Au-Yeung <j.auyeung419@gmail.com>
Co-authored-by: Somay Chauhan <somaychauhan98@gmail.com>
* test: add test cases to `window.getEmbedNamespace`
* test: add test cases when window.name doesn't have cal-embed=
* test: add test case to `getembedTheme` returning the theme from embedStore
* test: add test to `getEmbedTheme` returning the theme from query params
* Small refactor to reduce the time taken by tests and fix missing typings for embed functions on window
* Fix weird test failure
* Fix type import error caught by api.test.test
---------
Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
## What does this PR do?
Fixes#10187
See [Tests Done](https://www.loom.com/share/f03e0191b60143d8b45a505042dbfa11)
## Type of change
- [x] Bug fix (non-breaking change which fixes an issue)
## How should this be tested?
- [x] Configure embed to use `dark` theme and verify that dark theme is shown on event booking page(when user has light theme set). This is failing in main
- Additional Tests for embed to avoid any new regression
- [x] - Configure "auto" theme using embed API and see it reacts to system theme
- [x] - Don't configure any theme and see that "light" theme is shown even when we switch system theme(Because User has configured light theme in App)
- Tests outside embed to avoid any new regression
- [x] - See that light theme is shown even after switching system theme
- [x] - Now, switch the user theme to dark and see that it reflects the change.
## Mandatory Tasks
[x] Make sure you have self-reviewed the code. A decent size PR without self-review might be rejected.
* removed old booker and make new booker as a default
* fixes merge conflict
* fixed tests
* fixed tests for old-booker
* fixed typo in @calcom/lib/defaultEvents.ts
---------
Co-authored-by: René Müller <rene.mueller@clicksports.de>
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
* Fix colorscheme dark on success page due to embed not detected properly there
* Use calNamespace in getEmbediframe
* Fix missing variable
* Update basic.e2e.ts
---------
Co-authored-by: Omar López <zomars@me.com>
* Moving to vitest
* Rearranging test
* Fixing prettier linting
* Reverting launch.json
* Adjustments
* Merged with main and regenerated lockfile
* Fixing tests for API
* Yarn updated, docs is gone
---------
Co-authored-by: Peer Richelsen <peeroke@gmail.com>
Co-authored-by: zomars <zomars@me.com>
Co-authored-by: Alex van Andel <me@alexvanandel.com>
* Support dark theme in routing form
* Fix Embed detection
* Add routing form embed example
* Better rendering support in dark mode for react-select
* Fix more theme issues
* Added test for Routing Form Embed
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
* Add support to dynamically change the theme
* Add Embed UI in app
* Update UI as per Figma
* Dynamicaly update Embed Code
* Get differnet modes working in preview
* Support Embed on EventType Edit, Team Link Fix and Mobile unsupported
* Fix auto theme switch in Embed Snippet generator
* Fix types
* Self Review fixes
* Remove Embed from App section
* Move get query after the middleware to let middleware work on it
* Add sandboxes in the document
* Add error handling for embed loading
* Fix types
* Update snapshots and fix bug identified by tests
* UI Fixes
* Add Embed Tests
* Respond in preview to width and height
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
