From 37f8ef9c2b1854d252be43630f67ba0063756a3e Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E9=9B=A8=E9=9C=96=E9=93=83?= Date: Mon, 2 Feb 2026 22:57:01 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20=E4=BC=98=E5=8C=96=E6=B6=88=E6=81=AF?= =?UTF-8?q?=E5=A4=84=E7=90=86=E9=80=BB=E8=BE=91=EF=BC=8C=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E5=BD=95=E5=88=B6=E5=BC=80=E5=A7=8B=E5=92=8C=E5=81=9C=E6=AD=A2?= =?UTF-8?q?=E7=9A=84=E6=B6=88=E6=81=AF=E5=A4=84=E7=90=86=EF=BC=8C=E5=88=A0?= =?UTF-8?q?=E9=99=A4=E6=9C=AA=E4=BD=BF=E7=94=A8=E7=9A=84=20chromeUtils=20?= =?UTF-8?q?=E6=96=87=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- entrypoints/background.ts | 25 ++++++-- entrypoints/content.ts | 15 ++++- entrypoints/popup/pages/RecordeReplayPage.tsx | 57 +++++++------------ utils/chromeUtils.tsx | 41 ------------- utils/messages.tsx | 1 + 5 files changed, 55 insertions(+), 84 deletions(-) delete mode 100644 utils/chromeUtils.tsx diff --git a/entrypoints/background.ts b/entrypoints/background.ts index ba4f3f5..587ac3b 100644 --- a/entrypoints/background.ts +++ b/entrypoints/background.ts @@ -31,7 +31,6 @@ export default defineBackground(() => { chrome.runtime.onMessage.addListener((msg, _sender, sendResponse) => { if (msg.type === messages.popup.checkStatus) { console.log('[bg] checkStatus received'); - // void chrome.runtime.sendMessage({ type: messages.content.checkStatus }); sendToActiveTab({ type: messages.content.checkStatus }) .then(() => { sendResponse({ ok: true }); @@ -42,10 +41,28 @@ export default defineBackground(() => { return true; } - if (msg.type === messages.offscreen.to.startRecording) { + if (msg.type === messages.popup.from.start) { console.log('[bg] startRecording received'); - sendResponse({ ok: true }); - // void browser.runtime.sendMessage({ type: messages.popup.to.started }); + sendToActiveTab({ type: messages.content.to.startRecording }) + .then(async () => { + await chrome.runtime.sendMessage({ type: messages.popup.to.started }); + sendResponse({ ok: true }); + }) + .catch(() => { + sendResponse({ ok: false }); + }); + } + + if (msg.type === messages.popup.from.stop) { + console.log('[bg] stopRecording received'); + sendToActiveTab({ type: messages.content.to.stopRecording }) + .then(async () => { + await chrome.runtime.sendMessage({ type: messages.popup.to.stoped }); + sendResponse({ ok: true }); + }) + .catch(() => { + sendResponse({ ok: false }); + }); } return true; diff --git a/entrypoints/content.ts b/entrypoints/content.ts index be7cb99..fa79904 100644 --- a/entrypoints/content.ts +++ b/entrypoints/content.ts @@ -8,10 +8,21 @@ export default defineContentScript({ // 监听来自 background script 的消息 chrome.runtime.onMessage.addListener((msg: { type: string }, _sender, sendResponse) => { if (msg.type === messages.content.checkStatus) { + // 检查状态的处理逻辑 console.log('[content] checkStatus received'); sendResponse({ ok: true }); - } else { - console.log('[content] unknown message type:', msg.type); + } + + if (msg.type === messages.content.to.startRecording) { + // 开始录制的处理逻辑 + console.log('[content] startRecording received'); + sendResponse({ ok: true }); + } + + if (msg.type === messages.content.to.stopRecording) { + // 停止录制的处理逻辑 + console.log('[content] stopRecording received'); + sendResponse({ ok: true }); } return true; diff --git a/entrypoints/popup/pages/RecordeReplayPage.tsx b/entrypoints/popup/pages/RecordeReplayPage.tsx index e1a817b..2f32cf2 100644 --- a/entrypoints/popup/pages/RecordeReplayPage.tsx +++ b/entrypoints/popup/pages/RecordeReplayPage.tsx @@ -1,23 +1,23 @@ import { useEffect, useState } from 'react'; import { AppState } from '../types'; -import { messages } from '../../../utils/messages'; +import { messages } from '@/utils/messages'; const RecordeReplayPage = () => { const [status, setStatus] = useState(AppState.READ); - const [isRecording, setIsRecording] = useState(false); - - const getActiveTab = async () => { - const [tab] = await chrome.tabs.query({ active: true, currentWindow: true }); - return tab; - }; + const isRecording = useMemo(() => status === AppState.RECORDING, [status]); useEffect(() => { const handleMessage = (msg: { type: string }) => { if (msg.type === messages.popup.ready) { setStatus(AppState.READ); - } else if (msg.type === messages.popup.to.started) { + } + + if (msg.type === messages.popup.to.started) { + console.log('[popup] Received started message'); setStatus(AppState.RECORDING); - } else if (msg.type === messages.popup.to.stoped) { + } + + if (msg.type === messages.popup.to.stoped) { setStatus(AppState.READ); } }; @@ -29,40 +29,23 @@ const RecordeReplayPage = () => { return () => browser.runtime.onMessage.removeListener(handleMessage); }, []); - useEffect(() => { - const checkStatus = async () => { - const tab = await getActiveTab(); - if (tab?.id) { - try { - chrome.tabs.sendMessage(tab.id, { command: 'CHECK_STATUS' }, (response) => { - // 如果 content script 没加载，这里会报错，需要 catch - if (chrome.runtime.lastError) { - console.log('Content script not ready'); - return; - } - if (response?.isRecording) { - setIsRecording(true); - setStatus(AppState.RECORDING); - console.log(status); - } - }); - } catch (e) { - console.error(e); - } - } - }; - checkStatus(); - }, [status]); - const toggleRecording = async () => { - const tab = await getActiveTab(); - if (!tab?.id) return; + try { + const actionType = isRecording ? messages.popup.from.stop : messages.popup.from.start; + await browser.runtime.sendMessage({ type: actionType }); + } catch (error) { + console.error('Error toggling recording:', error); + setStatus(AppState.READ); + } }; return (
-
diff --git a/utils/chromeUtils.tsx b/utils/chromeUtils.tsx deleted file mode 100644 index 688e73b..0000000 --- a/utils/chromeUtils.tsx +++ /dev/null @@ -1,41 +0,0 @@ -/** - * 使用Chrome扩展API复制文本到剪贴板 - * @param text 复制文本 - * @returns - * - false: 复制失败 - * - true: 复制成功 - */ -export const copyToClipboard = async (text: string) => { - console.log('尝试复制文本:', text); - if (chrome && chrome.runtime && chrome.runtime.sendMessage) { - console.log('使用Chrome扩展API复制'); - return new Promise((resolve, reject) => { - chrome.runtime.sendMessage( - { - action: 'copy', - text: text, - }, - (response) => { - console.log('收到background响应:', response, 'lastError:', chrome.runtime.lastError); - - // 检查是否有运行时错误 - if (chrome.runtime.lastError) { - console.error('Chrome运行时错误:', chrome.runtime.lastError.message); - return reject(false); - } - - // 检查响应 - if (response && response.success) { - console.log('通过background复制成功'); - return resolve(true); - } else { - console.error('通过background复制失败:', response?.error); - return reject(false); - } - } - ); - }); - } - - return Promise.reject(false); -}; diff --git a/utils/messages.tsx b/utils/messages.tsx index 21d92e5..f2676c9 100644 --- a/utils/messages.tsx +++ b/utils/messages.tsx @@ -2,6 +2,7 @@ export const messages = { popup: { from: { start: 'popup:start', + stop: 'popup:stop', }, to: { stoped: 'popup:stoped',