diff --git a/tracker/tracker-assist/CHANGELOG.md b/tracker/tracker-assist/CHANGELOG.md index 4422b4446..464985ec8 100644 --- a/tracker/tracker-assist/CHANGELOG.md +++ b/tracker/tracker-assist/CHANGELOG.md @@ -1,3 +1,7 @@ +## 7.0.3 + +- small fix for canvas context tracking + ## 7.0.1 - mark live sessions with ux test active diff --git a/tracker/tracker-assist/bun.lockb b/tracker/tracker-assist/bun.lockb index 7136f43be..9f375c61a 100755 Binary files a/tracker/tracker-assist/bun.lockb and b/tracker/tracker-assist/bun.lockb differ diff --git a/tracker/tracker-assist/package.json b/tracker/tracker-assist/package.json index 363e9910c..e46b95669 100644 --- a/tracker/tracker-assist/package.json +++ b/tracker/tracker-assist/package.json @@ -1,7 +1,7 @@ { "name": "@openreplay/tracker-assist", "description": "Tracker plugin for screen assistance through the WebRTC", - "version": "7.0.4", + "version": "7.0.3", "keywords": [ "WebRTC", "assistance", @@ -34,7 +34,7 @@ "socket.io-client": "^4.7.2" }, "peerDependencies": { - "@openreplay/tracker": "^12.0.0" + "@openreplay/tracker": "^11.0.5" }, "devDependencies": { "@openreplay/tracker": "file:../tracker", diff --git a/tracker/tracker-assist/src/Canvas.ts b/tracker/tracker-assist/src/Canvas.ts index 068ecaa26..7d6c13c54 100644 --- a/tracker/tracker-assist/src/Canvas.ts +++ b/tracker/tracker-assist/src/Canvas.ts @@ -9,7 +9,6 @@ export default class CanvasRecorder { private readonly onStream: (stream: MediaStream) => void, private readonly logError: (...args: any[]) => void, ) { - this.canvas.getContext('2d', { alpha: true, }) const stream = this.canvas.captureStream(this.fps) this.emitStream(stream) } diff --git a/tracker/tracker-assist/src/version.ts b/tracker/tracker-assist/src/version.ts index 39847a820..f4abd5f6f 100644 --- a/tracker/tracker-assist/src/version.ts +++ b/tracker/tracker-assist/src/version.ts @@ -1 +1 @@ -export const pkgVersion = '7.0.4' +export const pkgVersion = '7.0.3' diff --git a/tracker/tracker/CHANGELOG.md b/tracker/tracker/CHANGELOG.md index 901521e4a..bd0491928 100644 --- a/tracker/tracker/CHANGELOG.md +++ b/tracker/tracker/CHANGELOG.md @@ -1,3 +1,8 @@ +# 11.0.5 + +- add method to restart canvas tracking (in case of context recreation) +- scan dom tree for canvas els on tracker start + # 11.0.4 - some additional security for canvas capture (check if canvas el itself is obscured/ignored) diff --git a/tracker/tracker/package.json b/tracker/tracker/package.json index 7cedd088c..8295276b0 100644 --- a/tracker/tracker/package.json +++ b/tracker/tracker/package.json @@ -1,7 +1,7 @@ { "name": "@openreplay/tracker", "description": "The OpenReplay tracker main package", - "version": "11.0.4", + "version": "11.0.5", "keywords": [ "logging", "replay" diff --git a/tracker/tracker/src/main/app/canvas.ts b/tracker/tracker/src/main/app/canvas.ts index 43c809155..fa54c6772 100644 --- a/tracker/tracker/src/main/app/canvas.ts +++ b/tracker/tracker/src/main/app/canvas.ts @@ -10,6 +10,7 @@ interface CanvasSnapshot { interface Options { fps: number quality: 'low' | 'medium' | 'high' + isDebug?: boolean } class CanvasRecorder { @@ -25,10 +26,17 @@ class CanvasRecorder { } startTracking() { + setTimeout(() => { + this.app.nodes.scanTree(this.handleCanvasEl) + this.app.nodes.attachNodeCallback((node: Node): void => { + this.handleCanvasEl(node) + }) + }, 500) + } + + restartTracking = () => { + this.clear() this.app.nodes.scanTree(this.handleCanvasEl) - this.app.nodes.attachNodeCallback((node: Node): void => { - this.handleCanvasEl(node) - }) } handleCanvasEl = (node: Node) => { @@ -74,7 +82,9 @@ class CanvasRecorder { images.forEach((snapshot) => { const blob = dataUrlToBlob(snapshot.data)[0] formData.append('snapshot', blob, `${createdAt}_${canvasId}_${snapshot.id}.jpeg`) - // saveImageData(snapshot.data, `${createdAt}_${canvasId}_${snapshot.id}.jpeg`) + if (this.options.isDebug) { + saveImageData(snapshot.data, `${createdAt}_${canvasId}_${snapshot.id}.jpeg`) + } }) fetch(this.app.options.ingestPoint + '/v1/web/images', { diff --git a/tracker/tracker/src/main/app/index.ts b/tracker/tracker/src/main/app/index.ts index 8565b2696..5cae53b74 100644 --- a/tracker/tracker/src/main/app/index.ts +++ b/tracker/tracker/src/main/app/index.ts @@ -106,6 +106,7 @@ type AppOptions = { __is_snippet: boolean __debug_report_edp: string | null __debug__?: LoggerOptions + __save_canvas_locally?: boolean localStorage: Storage | null sessionStorage: Storage | null forceSingleTab?: boolean @@ -183,6 +184,7 @@ export default class App { verbose: false, __is_snippet: false, __debug_report_edp: null, + __save_canvas_locally: false, localStorage: null, sessionStorage: null, disableStringDict: false, @@ -702,17 +704,21 @@ export default class App { this.compressionThreshold = compressionThreshold const onStartInfo = { sessionToken: token, userUUID, sessionID } + if (canvasEnabled) { + this.canvasRecorder = + this.canvasRecorder ?? + new CanvasRecorder(this, { + fps: canvasFPS, + quality: canvasQuality, + isDebug: this.options.__save_canvas_locally, + }) + this.canvasRecorder.startTracking() + } // TODO: start as early as possible (before receiving the token) this.startCallbacks.forEach((cb) => cb(onStartInfo)) // MBTODO: callbacks after DOM "mounted" (observed) this.observer.observe() this.ticker.start() - if (canvasEnabled) { - this.canvasRecorder = - this.canvasRecorder ?? - new CanvasRecorder(this, { fps: canvasFPS, quality: canvasQuality }) - this.canvasRecorder.startTracking() - } this.activityState = ActivityState.Active this.notify.log('OpenReplay tracking started.') @@ -767,6 +773,10 @@ export default class App { }) } + restartCanvasTracking = () => { + this.canvasRecorder?.restartTracking() + } + onUxtCb = [] addOnUxtCb(cb: (id: number) => void) { diff --git a/tracker/tracker/src/main/index.ts b/tracker/tracker/src/main/index.ts index 3c70078a3..ef91071a3 100644 --- a/tracker/tracker/src/main/index.ts +++ b/tracker/tracker/src/main/index.ts @@ -223,6 +223,13 @@ export default class API { return this.featureFlags.flags } + public restartCanvasTracking = () => { + if (this.app === null) { + return + } + this.app.restartCanvasTracking() + } + use(fn: (app: App | null, options?: Options) => T): T { return fn(this.app, this.options) }