From 8ae71f61600be0f780059ec59f7fefa3f482cc65 Mon Sep 17 00:00:00 2001
From: Hariom Balhara <hariombalhara@gmail.com>
Date: Fri, 4 Oct 2024 12:59:45 +0530
Subject: [PATCH] fix: Certain query params being filtered out from embed
 (#16936)

---
 packages/embeds/embed-core/src/embed.test.ts | 38 ++++++++++++++------
 packages/embeds/embed-core/src/embed.ts      | 12 ++++---
 2 files changed, 36 insertions(+), 14 deletions(-)

diff --git a/packages/embeds/embed-core/src/embed.test.ts b/packages/embeds/embed-core/src/embed.test.ts
index 3507f9f89344b3..1d7e08a93abf14 100644
--- a/packages/embeds/embed-core/src/embed.test.ts
+++ b/packages/embeds/embed-core/src/embed.test.ts
@@ -31,15 +31,17 @@ describe("Cal", () => {
     CalClass = (await import("./embed")).Cal;
   });
 
-  beforeEach(() => {
-    cal = new CalClass("test-namespace", []);
-    window.Cal.config = { forwardQueryParams: true };
-    // Mock the getConfig method
-    cal.getConfig = vi.fn().mockReturnValue({ calOrigin: "https://app.cal.com" });
-  });
+
 
   describe("createIframe", () => {
-    describe("params handling", () => {
+    describe("params handling with forwardQueryParams feature enabled", () => {
+      beforeEach(() => {
+        cal = new CalClass("test-namespace", []);
+        window.Cal.config = { forwardQueryParams: true };
+        // Mock the getConfig method
+        cal.getConfig = vi.fn().mockReturnValue({ calOrigin: "https://app.cal.com" });
+      });
+
       it("should merge query parameters from URL and explicit params", () => {
         mockSearchParams("?existingParam=value");
 
@@ -81,12 +83,12 @@ describe("Cal", () => {
         expect(paramValues).toEqual(["value3"]);
       });
 
-      it("should exclude reserved params", () => {
+      it("should exclude reserved params from page URL(as these could be unintentional to pass these query params to embed, so better to exclude them and avoid crashing the booking page)", () => {
+        mockSearchParams("?date=2023-05-01&duration=30");
+
         const iframe = cal.createIframe({
           calLink: "john-doe/meeting",
           config: {
-            date: "2023-05-01",
-            duration: "30",
             email: "test@example.com",
           },
           calOrigin: null,
@@ -97,6 +99,22 @@ describe("Cal", () => {
         expect(iframe.src).toContain("email=test%40example.com");
       });
 
+      it("should allow configuring reserved params through config(as it is explicitly passed by user)", () => {
+        const iframe = cal.createIframe({
+          calLink: "john-doe/meeting",
+          config: {
+            date: "2023-05-01",
+            duration: "30",
+            email: "test@example.com",
+          },
+          calOrigin: null,
+        });
+
+        expect(iframe.src).toContain("date=2023-05-01");
+        expect(iframe.src).toContain("duration=30");
+        expect(iframe.src).toContain("email=test%40example.com");
+      });
+
       it("should respect forwardQueryParams setting to disable sending page query params but still send the ones in the config", () => {
         mockSearchParams("?param1=value");
 
diff --git a/packages/embeds/embed-core/src/embed.ts b/packages/embeds/embed-core/src/embed.ts
index dfeb15f60ddb37..72785fdb8d3fdc 100644
--- a/packages/embeds/embed-core/src/embed.ts
+++ b/packages/embeds/embed-core/src/embed.ts
@@ -440,16 +440,20 @@ export class Cal {
     return Object.fromEntries(Object.entries(params).filter(([key, value]) => !excludeParam(key, value)));
   }
 
+  private getQueryParamsFromPage() {
+    const queryParamsFromPage = getQueryParamsFromPage();
+    // Ensure valid params are used from the page.
+    return this.filterParams(queryParamsFromPage);
+  }
+
   private buildFilteredQueryParams(queryParamsFromConfig: PrefillAndIframeAttrsConfig): URLSearchParams {
-    const queryParamsFromPageUrl = globalCal.config?.forwardQueryParams ? getQueryParamsFromPage() : {};
+    const queryParamsFromPageUrl = globalCal.config?.forwardQueryParams ? this.getQueryParamsFromPage() : {};
 
     // Query Params via config have higher precedence
     const mergedQueryParams = { ...queryParamsFromPageUrl, ...queryParamsFromConfig };
 
-    const filteredQueryParams = this.filterParams(mergedQueryParams);
-
     const searchParams = new URLSearchParams();
-    for (const [key, value] of Object.entries(filteredQueryParams)) {
+    for (const [key, value] of Object.entries(mergedQueryParams)) {
       if (value === undefined) {
         continue;
       }