From be91bd6b1701cf00707a6dc933364a225967ba2a Mon Sep 17 00:00:00 2001
From: Rohit Rajan <rohitrajan@192.168.101.7>
Date: Wed, 3 Sep 2025 00:13:58 +0530
Subject: [PATCH 1/2] feat: calc relative coords input click

---
 .../recorder/DOMBrowserRenderer.tsx           | 20 +++++++++++++++----
 1 file changed, 16 insertions(+), 4 deletions(-)

diff --git a/src/components/recorder/DOMBrowserRenderer.tsx b/src/components/recorder/DOMBrowserRenderer.tsx
index e409ff64..7e909854 100644
--- a/src/components/recorder/DOMBrowserRenderer.tsx
+++ b/src/components/recorder/DOMBrowserRenderer.tsx
@@ -572,10 +572,22 @@ export const DOMBrowserRenderer: React.FC<RRWebDOMBrowserRendererProps> = ({
             }
           }
 
-          if (
-            elementInfo?.tagName !== "INPUT" &&
-            elementInfo?.tagName !== "SELECT"
-          ) {
+          if (elementInfo?.tagName === "INPUT" || elementInfo?.tagName === "TEXTAREA") {
+            const element = target as HTMLElement;
+            const elementRect = element.getBoundingClientRect();
+            const relativeX = iframeX - elementRect.left;
+            const relativeY = iframeY - elementRect.top;
+            
+            socket.emit("dom:click", {
+              selector,
+              url: snapshot.baseUrl,
+              userId: user?.id || "unknown",
+              elementInfo,
+              coordinates: { x: relativeX, y: relativeY },
+              isSPA: false,
+            });
+          } else if (elementInfo?.tagName !== "SELECT") {
+            // Handle other elements normally
             socket.emit("dom:click", {
               selector,
               url: snapshot.baseUrl,

From bfa941d4ba1b73f7c2b64d4f15e490b9558b5926 Mon Sep 17 00:00:00 2001
From: Rohit Rajan <rohitrajan@192.168.101.7>
Date: Wed, 3 Sep 2025 00:16:16 +0530
Subject: [PATCH 2/2] feat: perform clicks based on coords

---
 .../src/browser-management/inputHandlers.ts   | 29 ++++++++++++++++++-
 1 file changed, 28 insertions(+), 1 deletion(-)

diff --git a/server/src/browser-management/inputHandlers.ts b/server/src/browser-management/inputHandlers.ts
index 36bfd1c6..c014af3d 100644
--- a/server/src/browser-management/inputHandlers.ts
+++ b/server/src/browser-management/inputHandlers.ts
@@ -636,13 +636,40 @@ const handleClickAction = async (
     const { selector, url, elementInfo, coordinates, isSPA = false } = data;
     const currentUrl = page.url();
 
-    await page.click(selector);
+    if (elementInfo && coordinates && (elementInfo.tagName === 'INPUT' || elementInfo.tagName === 'TEXTAREA')) {
+      try {
+        const elementHandle = await page.$(selector);
+        if (elementHandle) {
+          const boundingBox = await elementHandle.boundingBox();
+          if (boundingBox) {
+            await page.mouse.click(
+              boundingBox.x + coordinates.x, 
+              boundingBox.y + coordinates.y
+            );
+          } else {
+            await page.click(selector);
+          }
+        } else {
+          await page.click(selector);
+        }
+      } catch (error: any) {
+        logger.log("warn", `Failed to click at coordinates: ${error.message}`);
+        await page.click(selector);
+      }
+    } else {
+      await page.click(selector);
+    }
 
     const generator = activeBrowser.generator;
     await generator.onDOMClickAction(page, data);
 
     logger.log("debug", `Click action processed: ${selector}`);
 
+    if (elementInfo && (elementInfo.tagName === 'INPUT' || elementInfo.tagName === 'TEXTAREA')) {
+      logger.log("debug", `Input field click - skipping DOM snapshot for smooth typing`);
+      return;
+    }
+
     if (isSPA) {
       logger.log("debug", `SPA interaction detected for selector: ${selector}`);