From fca752526d6e7c0a613cdc087b20376c9dc797e2 Mon Sep 17 00:00:00 2001 From: nick-delirium Date: Tue, 8 Oct 2024 17:48:45 +0200 Subject: [PATCH] spot: fixing inconsistent recording --- spot/entrypoints/background.ts | 44 ++++++++++++++++-------------- spot/entrypoints/content/index.tsx | 5 +++- spot/entrypoints/offscreen/main.js | 30 +++++++++++++------- spot/package.json | 2 +- spot/wxt.config.ts | 1 + 5 files changed, 50 insertions(+), 32 deletions(-) diff --git a/spot/entrypoints/background.ts b/spot/entrypoints/background.ts index 9373275be..0261ec9b9 100644 --- a/spot/entrypoints/background.ts +++ b/spot/entrypoints/background.ts @@ -5,7 +5,7 @@ let checkBusy = false; export default defineBackground(() => { const CHECK_INT = 60 * 1000; const PING_INT = 30 * 1000; - const VER = "1.0.7"; + const VER = "1.0.10"; const messages = { popup: { @@ -42,6 +42,7 @@ export default defineBackground(() => { checkNewTab: "ort:check-new-tab", started: "ort:started", stopped: "ort:stopped", + toStop: "ort:stop", restart: "ort:restart", getErrorEvents: "ort:get-error-events", }, @@ -63,6 +64,7 @@ export default defineBackground(() => { to: { checkRecStatus: "offscr:check-status", startRecording: "offscr:start-recording", + stopRecording: "offscr:stop-recording", }, }, }; @@ -661,10 +663,14 @@ export default defineBackground(() => { errorData, }); } - if (request.type === "ort:stop") { + if (request.type === messages.content.from.toStop) { + if (recordingState.recording === REC_STATE.stopped) { + return console.error('Calling stopped recording?') + } + console.log('calling stop') browser.runtime .sendMessage({ - type: "offscr:stop-recording", + type: messages.offscreen.to.stopRecording, target: "offscreen", }) .then((r) => { @@ -999,6 +1005,7 @@ export default defineBackground(() => { let activeTab = activeTabs[0]; const sendTo = message.activeTabId || activeTab.id!; let attempts = 0; + // 10 seconds; while (!contentArmy[sendTo] && attempts < 100) { await new Promise((resolve) => setTimeout(resolve, 100)); attempts++; @@ -1142,18 +1149,16 @@ export default defineBackground(() => { } const trackedTab: number | null = usedTab ?? null; + /** reloads ui on currently active tab once its reloads itself */ - function tabUpdateListener(tabId: number, changeInfo: any) { + function tabNavigatedListener(details: { tabId: number }) { const state = getRecState(); if (state === REC_STATE.stopped) { - return stopTabListening(); + return stopNavListening(); } + contentArmy[details.tabId] = false - if (changeInfo.status !== "complete") { - return (contentArmy[tabId] = false); - } - - if (area === "tab" && (!trackedTab || tabId !== trackedTab)) { + if (area === "tab" && (!trackedTab || details.tabId !== trackedTab)) { return; } @@ -1174,6 +1179,13 @@ export default defineBackground(() => { }); } + function startNavListening() { + browser.webNavigation.onCompleted.addListener(tabNavigatedListener) + } + function stopNavListening() { + browser.webNavigation.onCompleted.removeListener(tabNavigatedListener) + } + /** discards recording if was recording single tab and its now closed */ function tabRemovedListener(tabId: number) { if (tabId === trackedTab) { @@ -1200,15 +1212,7 @@ export default defineBackground(() => { browser.tabs.onRemoved.removeListener(tabRemovedListener); } - function startTabListening() { - browser.tabs.onUpdated.addListener(tabUpdateListener); - } - - function stopTabListening() { - browser.tabs.onUpdated.removeListener(tabUpdateListener); - } - - startTabListening(); + startNavListening(); if (area === "desktop") { // if desktop, watch for tab change events startTabActivationListening(); @@ -1218,7 +1222,7 @@ export default defineBackground(() => { startRemovedListening(); } setOnStop(() => { - stopTabListening(); + stopNavListening(); if (area === "desktop") { stopTabActivationListening(); } diff --git a/spot/entrypoints/content/index.tsx b/spot/entrypoints/content/index.tsx index 56a913776..f3c93e34c 100644 --- a/spot/entrypoints/content/index.tsx +++ b/spot/entrypoints/content/index.tsx @@ -125,6 +125,7 @@ export default defineContentScript({ stopClickRecording(); stopLocationRecording(); const result = await browser.runtime.sendMessage({ type: "ort:stop" }); + console.log('Spot getting video:', result) if (result.status === "full") { chunksReady = true; data = result; @@ -323,7 +324,9 @@ export default defineContentScript({ }); } - void browser.runtime.sendMessage({ type: "ort:content-ready" }); + setInterval(() => { + void browser.runtime.sendMessage({ type: "ort:content-ready" }); + }, 500) // @ts-ignore false positive browser.runtime.onMessage.addListener((message: any, resp) => { if (message.type === "content:mount") { diff --git a/spot/entrypoints/offscreen/main.js b/spot/entrypoints/offscreen/main.js index bf7dd2db4..fa82993af 100644 --- a/spot/entrypoints/offscreen/main.js +++ b/spot/entrypoints/offscreen/main.js @@ -1,3 +1,6 @@ +/** + * 24 MB; hardlimit for video chunk + * */ const hardLimit = 24 * 1024 * 1024; // 24 MB function getRecordingSettings(qualityValue) { @@ -124,6 +127,7 @@ class ScreenRecorder { this.mRecorder.start(); this.isRecording = true; this.trackDuration(); + console.log('started recording inside startRecording'); } stop() { @@ -217,20 +221,24 @@ class ScreenRecorder { }, })); } catch (e) { - console.error(e); + console.error('get stream error:', e); throw e; } + // try { + // microphoneStream = await navigator.mediaDevices.getUserMedia({ + // audio: { echoCancellation: false, deviceId: audioId }, + // }); + // this.audioTrack = microphoneStream.getAudioTracks()[0]; + // if (!useMicrophone) { + // this.audioTrack.enabled = false; + // } + // } catch (e) { + // console.error('get audio error', e); + // } try { - microphoneStream = await navigator.mediaDevices.getUserMedia({ - audio: { echoCancellation: false, deviceId: audioId }, - }); - this.audioTrack = microphoneStream.getAudioTracks()[0]; - if (!useMicrophone) { - this.audioTrack.enabled = false; - } - } catch (e) { - console.error(e); this.audioTrack = this.createPlaceholderAudioTrack(); + } catch (e) { + console.error('get audio error', e); } const existingAudioTracks = this.videoStream.getAudioTracks(); @@ -312,6 +320,7 @@ browser.runtime.onMessage.addListener((message, _, respond) => { message.audioId, ) .then(() => { + console.log('started recording'); respond({ success: true, time: Date.now() }); }) .catch(e => { @@ -336,6 +345,7 @@ browser.runtime.onMessage.addListener((message, _, respond) => { recorder.stop(); const duration = recorder.duration; recorder.getVideoData().then((data) => { + console.log(data) if (!data.blob) { respond({ status: "empty" }); } diff --git a/spot/package.json b/spot/package.json index 0d5997b74..6bbfe2d64 100644 --- a/spot/package.json +++ b/spot/package.json @@ -2,7 +2,7 @@ "name": "wxt-starter", "description": "manifest.json description", "private": true, - "version": "1.0.9", + "version": "1.0.10", "type": "module", "scripts": { "dev": "wxt", diff --git a/spot/wxt.config.ts b/spot/wxt.config.ts index 0b06a056f..243d9f074 100644 --- a/spot/wxt.config.ts +++ b/spot/wxt.config.ts @@ -25,6 +25,7 @@ export default defineConfig({ "tabCapture", "offscreen", "unlimitedStorage", + "webNavigation", ], }, });