From ad393a654c802a6b98d683670c49680c652302ae Mon Sep 17 00:00:00 2001 From: nas Date: Sun, 8 Dec 2024 14:51:46 -0500 Subject: [PATCH] fix: session recording events to be sent on extension side (#26) fix: session recording for live replay --- api/extensions/recorder/background.js | 39 ++++++++++++++++++++ api/extensions/recorder/inject.js | 52 ++++++++------------------- 2 files changed, 53 insertions(+), 38 deletions(-) diff --git a/api/extensions/recorder/background.js b/api/extensions/recorder/background.js index a2fec3b..aa1042f 100644 --- a/api/extensions/recorder/background.js +++ b/api/extensions/recorder/background.js @@ -18,3 +18,42 @@ function injectScript(tabId, changeInfo, tab) { // Listen for any tab updates chrome.tabs.onUpdated.addListener(injectScript); + +const LOCAL_API_URL = "http://localhost:3000/v1/events"; +const FALLBACK_API_URL = "http://0.0.0.0:3000/v1/events"; // Need to point to 0.0.0.0 in some deploys +let currentApiUrl = LOCAL_API_URL; + +chrome.runtime.onMessage.addListener((message, sender, sendResponse) => { + const sendEvents = () => { + fetch(currentApiUrl, { + method: "POST", + headers: { + "Content-Type": "application/json", + }, + mode: "no-cors", + body: JSON.stringify({ + events: message.events, + }), + }) + .then((response) => { + if (!response.ok) { + throw new Error(`HTTP error! status: ${response.status}`); + } + sendResponse({ success: true }); + }) + .catch((error) => { + if (currentApiUrl === LOCAL_API_URL) { + // Retry with fallback URL + currentApiUrl = FALLBACK_API_URL; + sendEvents(); + } + }); + }; + if (message.type === "SAVE_EVENTS") { + console.log("[Recorder Background] Saving events to", currentApiUrl); + sendEvents(); + + sendResponse({ success: true }); + return true; // Required for async response + } +}); diff --git a/api/extensions/recorder/inject.js b/api/extensions/recorder/inject.js index c4bd929..ce419e5 100644 --- a/api/extensions/recorder/inject.js +++ b/api/extensions/recorder/inject.js @@ -569,54 +569,30 @@ var rrwebRecord = (function () { let snapshots = []; -console.log("[Recorder] Setting up rrweb..."); rrwebRecord({ emit: (event) => { - console.log("[Recorder] Event captured:", event.type); snapshots.push(event); }, }); -const LOCAL_API_URL = "http://localhost:3000/v1/events"; -const FALLBACK_API_URL = "http://0.0.0.0:3000/v1/events"; // Need to point to 0.0.0.0 in some deploys -let currentApiUrl = LOCAL_API_URL; - function save() { if (snapshots.length > 0) { - console.log(`[Recorder] Attempting to save ${snapshots.length} events`); - const body = JSON.stringify({ - events: snapshots, - }); - - console.log("[Recorder] Saving events to", currentApiUrl); - fetch(currentApiUrl, { - method: "POST", - headers: { - "Content-Type": "application/json", + // Send events to background script + chrome.runtime.sendMessage( + { + type: "SAVE_EVENTS", + events: snapshots, }, - body, - }) - .then((response) => { - console.log("[Recorder] Save response status:", response.status); - if (!response.ok) { - throw new Error(`HTTP error! status: ${response.status}`); - } - console.log("[Recorder] Events saved successfully"); - snapshots = []; - }) - .catch((error) => { - console.error("[Recorder] Failed to save events:", error.toString()); - if (currentApiUrl === LOCAL_API_URL) { - console.log("[Recorder] Switching to fallback URL"); - currentApiUrl = FALLBACK_API_URL; - // Retry with the new URL - save(); + (response) => { + if (response.success) { + snapshots = []; + } else { + console.error("[Recorder] Failed to save events:", response.error); } - }); + }, + ); } } -console.log("[Recorder] Setting up save interval..."); -setInterval(save, 1000); -console.log("[Recorder] Adding beforeunload handler..."); + +setInterval(save, 500); window.addEventListener("beforeunload", save); -console.log("[Recorder] Initialization complete");