Files
testing-tool/hooks/useRecorder.tsx
T

40 lines
900 B
TypeScript

import { useRef, useState, useCallback } from 'react';
import { record } from 'rrweb';
export const useRecorder = () => {
// 存储停止录制函数
const stopFnRef = useRef<(() => void) | null>(null);
const [isRecording, setIsRecording] = useState(false);
const startRecord = useCallback(async () => {
if (isRecording) return;
try {
// await chrome.runtime.sendMessage({ type: 'CREATE_OFFSCREEN' });
setIsRecording(true);
console.log('[content] rrweb started');
} catch (error) {}
}, [isRecording]);
const stopRecord = () => {
if (!isRecording) return;
setIsRecording(false);
// 停止录制
if (stopFnRef.current) {
chrome.runtime.sendMessage({ type: 'SAVE_EVENTS' });
stopFnRef.current?.();
console.log('[content] rrweb stopped');
}
};
return {
startRecord,
stopRecord,
isRecording,
};
};