Chore: Make inject script more robust on repl & stream (#1429)

* try/catch injection of recording script in rrweb repl and stream

* Add empty changesets
This commit is contained in:
Justin Halsall
2026-04-01 12:00:00 +08:00
committed by GitHub
parent fb2d921180
commit 169e10e94a
3 changed files with 83 additions and 74 deletions

View File

@@ -22,40 +22,44 @@ void (async () => {
let events = [];
async function injectRecording(frame) {
await frame.evaluate((rrwebCode) => {
const win = window;
if (win.__IS_RECORDING__) return;
win.__IS_RECORDING__ = true;
try {
await frame.evaluate((rrwebCode) => {
const win = window;
if (win.__IS_RECORDING__) return;
win.__IS_RECORDING__ = true;
(async () => {
function loadScript(code) {
const s = document.createElement('script');
let r = false;
s.type = 'text/javascript';
s.innerHTML = code;
if (document.head) {
document.head.append(s);
} else {
requestAnimationFrame(() => {
(async () => {
function loadScript(code) {
const s = document.createElement('script');
let r = false;
s.type = 'text/javascript';
s.innerHTML = code;
if (document.head) {
document.head.append(s);
});
} else {
requestAnimationFrame(() => {
document.head.append(s);
});
}
}
}
loadScript(rrwebCode);
loadScript(rrwebCode);
win.events = [];
rrweb.record({
emit: (event) => {
win.events.push(event);
win._replLog(event);
},
plugins: [],
recordCanvas: true,
recordCrossOriginIframes: true,
collectFonts: true,
});
})();
}, code);
win.events = [];
rrweb.record({
emit: (event) => {
win.events.push(event);
win._replLog(event);
},
plugins: [],
recordCanvas: true,
recordCrossOriginIframes: true,
collectFonts: true,
});
})();
}, code);
} catch (e) {
console.error('failed to inject recording script:', e);
}
}
await start('https://react-redux.realworld.io');

View File

@@ -24,55 +24,58 @@ const pluginCode = fs.readFileSync(
);
async function injectRecording(frame) {
await frame.evaluate(
(rrwebCode, pluginCode) => {
const win = window;
if (win.__IS_RECORDING__) return;
win.__IS_RECORDING__ = true;
try {
await frame.evaluate(
(rrwebCode, pluginCode) => {
const win = window;
if (win.__IS_RECORDING__) return;
win.__IS_RECORDING__ = true;
(async () => {
function loadScript(code) {
const s = document.createElement('script');
s.type = 'text/javascript';
s.innerHTML = code;
if (document.head) {
document.head.append(s);
} else {
requestAnimationFrame(() => {
(async () => {
function loadScript(code) {
const s = document.createElement('script');
s.type = 'text/javascript';
s.innerHTML = code;
if (document.head) {
document.head.append(s);
});
} else {
requestAnimationFrame(() => {
document.head.append(s);
});
}
}
}
loadScript(rrwebCode);
loadScript(pluginCode);
loadScript(rrwebCode);
loadScript(pluginCode);
win.events = [];
window.record = win.rrweb.record;
window.plugin = new rrwebCanvasWebRTCRecord.RRWebPluginCanvasWebRTCRecord(
{
signalSendCallback: (msg) => {
// [record#callback] provides canvas id, stream, and webrtc sdpOffer signal & connect message
_signal(msg);
win.events = [];
window.record = win.rrweb.record;
window.plugin =
new rrwebCanvasWebRTCRecord.RRWebPluginCanvasWebRTCRecord({
signalSendCallback: (msg) => {
// [record#callback] provides canvas id, stream, and webrtc sdpOffer signal & connect message
_signal(msg);
},
});
window.record({
emit: (event) => {
win.events.push(event);
win._captureEvent(event);
},
},
);
window.record({
emit: (event) => {
win.events.push(event);
win._captureEvent(event);
},
plugins: [window.plugin.initPlugin()],
recordCanvas: false,
recordCrossOriginIframes: true,
collectFonts: true,
inlineImages: true,
});
})();
},
code,
pluginCode,
);
plugins: [window.plugin.initPlugin()],
recordCanvas: false,
recordCrossOriginIframes: true,
collectFonts: true,
inlineImages: true,
});
})();
},
code,
pluginCode,
);
} catch (e) {
console.error('failed to inject script, error:', e);
}
}
async function startReplay(page, serverURL, recordedPage) {