From 17324e406cfe869b69c4e1f3bbc36be7b30ed33e Mon Sep 17 00:00:00 2001
From: Pradumn Kumar <47187878+Pradumn27@users.noreply.github.com>
Date: Mon, 17 Jul 2023 08:46:00 +0530
Subject: [PATCH] feat: unit tests for embed pages (#10014)

Co-authored-by: Hariom Balhara <hariombalhara@gmail.com>
---
 .../playwright/tests/embed-pages.e2e.ts       | 59 +++++++++++++++++++
 1 file changed, 59 insertions(+)
 create mode 100644 packages/embeds/embed-core/playwright/tests/embed-pages.e2e.ts

diff --git a/packages/embeds/embed-core/playwright/tests/embed-pages.e2e.ts b/packages/embeds/embed-core/playwright/tests/embed-pages.e2e.ts
new file mode 100644
index 0000000000..b543f4a859
--- /dev/null
+++ b/packages/embeds/embed-core/playwright/tests/embed-pages.e2e.ts
@@ -0,0 +1,59 @@
+import { expect } from "@playwright/test";
+
+import { test } from "@calcom/web/playwright/lib/fixtures";
+
+test.describe("Embed Pages", () => {
+  test("Event Type Page: should not have margin top on embed page", async ({ page }) => {
+    await page.goto("http://localhost:3000/free/30min/embed");
+    // Checks the margin from top by checking the distance between the div inside main from the viewport
+    const marginFromTop = await page.evaluate(() => {
+      const mainElement = document.querySelector("main");
+      const divElement = mainElement?.querySelector("div");
+
+      if (mainElement && divElement) {
+        // This returns the distance of the div element from the viewport
+        const divRect = divElement.getBoundingClientRect();
+        return divRect.top;
+      }
+
+      return null;
+    });
+
+    expect(marginFromTop).toBe(0);
+  });
+
+  test("Event Type Page: should have margin top on non embed page", async ({ page }) => {
+    await page.goto("http://localhost:3000/free/30min");
+
+    // Checks the margin from top by checking the distance between the div inside main from the viewport
+    const marginFromTop = await page.evaluate(() => {
+      const mainElement = document.querySelector("main");
+      const divElement = mainElement?.querySelector("div");
+
+      if (mainElement && divElement) {
+        // This returns the distance of the div element from the viewport
+        const divRect = divElement.getBoundingClientRect();
+        return divRect.top;
+      }
+
+      return null;
+    });
+
+    expect(marginFromTop).not.toBe(0);
+  });
+
+  test("should change to embed when window.name is changed to cal-embed=", async ({ page }) => {
+    await page.goto("http://localhost:3000/free/30min");
+
+    await page.evaluate(() => {
+      window.name = "cal-embed=";
+    });
+
+    await page.reload();
+
+    const isEmbed = await page.evaluate(() => {
+      return window?.isEmbed?.();
+    });
+    expect(isEmbed).toBe(true);
+  });
+});