@openreplay/tracker 13.0.1 → 14.0.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (50) hide show
  1. package/CHANGELOG.md +14 -0
  2. package/bun.lockb +0 -0
  3. package/cjs/app/canvas.d.ts +2 -0
  4. package/cjs/app/canvas.js +6 -5
  5. package/cjs/app/index.d.ts +55 -16
  6. package/cjs/app/index.js +417 -236
  7. package/cjs/app/messages.gen.d.ts +6 -3
  8. package/cjs/app/messages.gen.js +44 -10
  9. package/cjs/app/nodes.d.ts +2 -0
  10. package/cjs/app/nodes.js +15 -1
  11. package/cjs/app/observer/iframe_observer.d.ts +1 -0
  12. package/cjs/app/observer/iframe_observer.js +9 -0
  13. package/cjs/app/observer/iframe_offsets.js +0 -1
  14. package/cjs/app/observer/top_observer.d.ts +1 -0
  15. package/cjs/app/observer/top_observer.js +14 -0
  16. package/cjs/common/messages.gen.d.ts +38 -10
  17. package/cjs/index.d.ts +1 -0
  18. package/cjs/index.js +17 -8
  19. package/cjs/modules/conditionsManager.js +2 -2
  20. package/cjs/modules/mouse.js +14 -1
  21. package/cjs/modules/scroll.d.ts +1 -1
  22. package/cjs/modules/scroll.js +9 -4
  23. package/cjs/modules/viewport.js +2 -2
  24. package/cjs/utils.d.ts +2 -1
  25. package/cjs/utils.js +33 -6
  26. package/lib/app/canvas.d.ts +2 -0
  27. package/lib/app/canvas.js +6 -5
  28. package/lib/app/index.d.ts +55 -16
  29. package/lib/app/index.js +399 -218
  30. package/lib/app/messages.gen.d.ts +6 -3
  31. package/lib/app/messages.gen.js +37 -6
  32. package/lib/app/nodes.d.ts +2 -0
  33. package/lib/app/nodes.js +15 -1
  34. package/lib/app/observer/iframe_observer.d.ts +1 -0
  35. package/lib/app/observer/iframe_observer.js +9 -0
  36. package/lib/app/observer/iframe_offsets.js +0 -1
  37. package/lib/app/observer/top_observer.d.ts +1 -0
  38. package/lib/app/observer/top_observer.js +14 -0
  39. package/lib/common/messages.gen.d.ts +38 -10
  40. package/lib/common/tsconfig.tsbuildinfo +1 -1
  41. package/lib/index.d.ts +1 -0
  42. package/lib/index.js +18 -9
  43. package/lib/modules/conditionsManager.js +2 -2
  44. package/lib/modules/mouse.js +14 -1
  45. package/lib/modules/scroll.d.ts +1 -1
  46. package/lib/modules/scroll.js +9 -4
  47. package/lib/modules/viewport.js +2 -2
  48. package/lib/utils.d.ts +2 -1
  49. package/lib/utils.js +31 -5
  50. package/package.json +1 -1
package/cjs/app/index.js CHANGED
@@ -27,27 +27,25 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
27
27
  };
28
28
  Object.defineProperty(exports, "__esModule", { value: true });
29
29
  exports.DEFAULT_INGEST_POINT = void 0;
30
+ const fflate_1 = require("fflate");
31
+ const attributeSender_js_1 = __importDefault(require("../modules/attributeSender.js"));
30
32
  const conditionsManager_js_1 = __importDefault(require("../modules/conditionsManager.js"));
31
33
  const featureFlags_js_1 = __importDefault(require("../modules/featureFlags.js"));
32
- const messages_gen_js_1 = require("./messages.gen.js");
33
- const messages_gen_js_2 = require("./messages.gen.js");
34
+ const performance_js_1 = require("../modules/performance.js");
35
+ const tagWatcher_js_1 = __importDefault(require("../modules/tagWatcher.js"));
36
+ const index_js_1 = __importDefault(require("../modules/userTesting/index.js"));
34
37
  const utils_js_1 = require("../utils.js");
38
+ const canvas_js_1 = __importDefault(require("./canvas.js"));
39
+ const logger_js_1 = __importStar(require("./logger.js"));
40
+ const messages_gen_js_1 = require("./messages.gen.js");
35
41
  const nodes_js_1 = __importDefault(require("./nodes.js"));
36
42
  const top_observer_js_1 = __importDefault(require("./observer/top_observer.js"));
37
43
  const sanitizer_js_1 = __importDefault(require("./sanitizer.js"));
38
- const ticker_js_1 = __importDefault(require("./ticker.js"));
39
- const logger_js_1 = __importStar(require("./logger.js"));
40
44
  const session_js_1 = __importDefault(require("./session.js"));
41
- const fflate_1 = require("fflate");
42
- const performance_js_1 = require("../modules/performance.js");
43
- const attributeSender_js_1 = __importDefault(require("../modules/attributeSender.js"));
44
- const canvas_js_1 = __importDefault(require("./canvas.js"));
45
- const index_js_1 = __importDefault(require("../modules/userTesting/index.js"));
46
- const tagWatcher_js_1 = __importDefault(require("../modules/tagWatcher.js"));
45
+ const ticker_js_1 = __importDefault(require("./ticker.js"));
47
46
  const CANCELED = 'canceled';
48
47
  const uxtStorageKey = 'or_uxt_active';
49
48
  const bufferStorageKey = 'or_buffer_1';
50
- const START_ERROR = ':(';
51
49
  const UnsuccessfulStart = (reason) => ({ reason, success: false });
52
50
  const SuccessfulStart = (body) => ({ ...body, success: true });
53
51
  var ActivityState;
@@ -66,9 +64,25 @@ function getTimezone() {
66
64
  const minutes = Math.abs(offset) % 60;
67
65
  return `UTC${sign}${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;
68
66
  }
67
+ const delay = (ms) => new Promise((res) => setTimeout(res, ms));
68
+ const proto = {
69
+ // ask if there are any tabs alive
70
+ ask: 'never-gonna-give-you-up',
71
+ // response from another tab
72
+ resp: 'never-gonna-let-you-down',
73
+ // regenerating id (copied other tab)
74
+ reg: 'never-gonna-run-around-and-desert-you',
75
+ // tracker inside a child iframe
76
+ iframeSignal: 'never-gonna-make-you-cry',
77
+ // getting node id for child iframe
78
+ iframeId: 'never-gonna-say-goodbye',
79
+ // batch of messages from an iframe window
80
+ iframeBatch: 'never-gonna-tell-a-lie-and-hurt-you',
81
+ };
69
82
  class App {
70
- constructor(projectKey, sessionToken, options, signalError) {
83
+ constructor(projectKey, sessionToken, options, signalError, insideIframe) {
71
84
  this.signalError = signalError;
85
+ this.insideIframe = insideIframe;
72
86
  this.messages = [];
73
87
  /**
74
88
  * we need 2 buffers, so we don't lose anything
@@ -80,14 +94,18 @@ class App {
80
94
  this.stopCallbacks = [];
81
95
  this.commitCallbacks = [];
82
96
  this.activityState = ActivityState.NotActive;
83
- this.version = '13.0.1'; // TODO: version compatability check inside each plugin.
97
+ this.version = '14.0.0'; // TODO: version compatability check inside each plugin.
84
98
  this.socketMode = false;
85
99
  this.compressionThreshold = 24 * 1000;
86
- this.restartAttempts = 0;
87
100
  this.bc = null;
88
101
  this.canvasRecorder = null;
89
102
  this.conditionsManager = null;
90
- this._usingOldFetchPlugin = false;
103
+ this.canStart = false;
104
+ this.rootId = null;
105
+ this.pageFrames = [];
106
+ this.frameOderNumber = 0;
107
+ this.initialHostName = location.hostname;
108
+ this.startTimeout = null;
91
109
  this.coldStartCommitN = 0;
92
110
  this.delay = 0;
93
111
  this.coldInterval = null;
@@ -118,6 +136,8 @@ class App {
118
136
  });
119
137
  };
120
138
  this.onUxtCb = [];
139
+ this.contextId = Math.random().toString(36).slice(2);
140
+ this.projectKey = projectKey;
121
141
  if (Object.keys(options).findIndex((k) => ['fixedCanvasScaling', 'disableCanvas'].includes(k)) !==
122
142
  -1) {
123
143
  console.warn('Openreplay: canvas options are moving to separate key "canvas" in next update. Please update your configuration.');
@@ -130,10 +150,8 @@ class App {
130
150
  },
131
151
  };
132
152
  }
133
- this.contextId = Math.random().toString(36).slice(2);
134
- this.projectKey = projectKey;
135
153
  this.networkOptions = options.network;
136
- this.options = Object.assign({
154
+ const defaultOptions = {
137
155
  revID: '',
138
156
  node_id: '__openreplay_id',
139
157
  session_token_key: '__openreplay_token',
@@ -154,17 +172,26 @@ class App {
154
172
  assistSocketHost: '',
155
173
  fixedCanvasScaling: false,
156
174
  disableCanvas: false,
157
- assistOnly: false,
175
+ captureIFrames: true,
176
+ obscureTextEmails: true,
177
+ obscureTextNumbers: false,
178
+ crossdomain: {
179
+ parentDomain: '*',
180
+ },
158
181
  canvas: {
159
182
  disableCanvas: false,
160
183
  fixedCanvasScaling: false,
161
184
  __save_canvas_locally: false,
162
185
  useAnimationFrame: false,
163
186
  },
164
- }, options);
165
- if (!this.options.forceSingleTab && globalThis && 'BroadcastChannel' in globalThis) {
187
+ };
188
+ this.options = (0, utils_js_1.simpleMerge)(defaultOptions, options);
189
+ if (!this.insideIframe &&
190
+ !this.options.forceSingleTab &&
191
+ globalThis &&
192
+ 'BroadcastChannel' in globalThis) {
166
193
  const host = location.hostname.split('.').slice(-2).join('_');
167
- this.bc = (0, utils_js_1.inIframe)() ? null : new BroadcastChannel(`rick_${host}`);
194
+ this.bc = new BroadcastChannel(`rick_${host}`);
168
195
  }
169
196
  this.revID = this.options.revID;
170
197
  this.localStorage = this.options.localStorage ?? window.localStorage;
@@ -184,90 +211,150 @@ class App {
184
211
  this.session.attachUpdateCallback(({ userID, metadata }) => {
185
212
  if (userID != null) {
186
213
  // TODO: nullable userID
187
- this.send((0, messages_gen_js_2.UserID)(userID));
214
+ this.send((0, messages_gen_js_1.UserID)(userID));
188
215
  }
189
216
  if (metadata != null) {
190
- Object.entries(metadata).forEach(([key, value]) => this.send((0, messages_gen_js_2.Metadata)(key, value)));
217
+ Object.entries(metadata).forEach(([key, value]) => this.send((0, messages_gen_js_1.Metadata)(key, value)));
191
218
  }
192
219
  });
193
220
  // @deprecated (use sessionHash on start instead)
194
221
  if (sessionToken != null) {
195
222
  this.session.applySessionHash(sessionToken);
196
223
  }
197
- try {
198
- this.worker = new Worker(URL.createObjectURL(new Blob(['"use strict";class t{constructor(t,s,i,e=10,n=250,h,r){this.onUnauthorised=s,this.onFailure=i,this.MAX_ATTEMPTS_COUNT=e,this.ATTEMPT_TIMEOUT=n,this.onCompress=h,this.pageNo=r,this.attemptsCount=0,this.busy=!1,this.queue=[],this.token=null,this.lastBatchNum=0,this.ingestURL=t+"/v1/web/i",this.isCompressing=void 0!==h}getQueueStatus(){return 0===this.queue.length&&!this.busy}authorise(t){this.token=t,this.busy||this.sendNext()}push(t){if(this.busy||!this.token)this.queue.push(t);else if(this.busy=!0,this.isCompressing&&this.onCompress)this.onCompress(t);else{const s=++this.lastBatchNum;this.sendBatch(t,!1,s)}}sendNext(){const t=this.queue.shift();if(t)if(this.busy=!0,this.isCompressing&&this.onCompress)this.onCompress(t);else{const s=++this.lastBatchNum;this.sendBatch(t,!1,s)}else this.busy=!1}retry(t,s,i){this.attemptsCount>=this.MAX_ATTEMPTS_COUNT?this.onFailure(`Failed to send batch after ${this.attemptsCount} attempts.`):(this.attemptsCount++,setTimeout((()=>this.sendBatch(t,s,i)),this.ATTEMPT_TIMEOUT*this.attemptsCount))}sendBatch(t,s,i){const e=i?.toString().replace(/^([^_]+)_([^_]+).*/,"$1_$2_$3");this.busy=!0;const n={Authorization:`Bearer ${this.token}`};s&&(n["Content-Encoding"]="gzip"),null!==this.token?fetch(`${this.ingestURL}?batch=${this.pageNo??"noPageNum"}_${e??"noBatchNum"}`,{body:t,method:"POST",headers:n,keepalive:t.length<65536}).then((e=>{if(401===e.status)return this.busy=!1,void this.onUnauthorised();e.status>=400?this.retry(t,s,`${i??"noBatchNum"}_network:${e.status}`):(this.attemptsCount=0,this.sendNext())})).catch((e=>{console.warn("OpenReplay:",e),this.retry(t,s,`${i??"noBatchNum"}_reject:${e.message}`)})):setTimeout((()=>{this.sendBatch(t,s,`${i??"noBatchNum"}_newToken`)}),500)}sendCompressed(t){const s=++this.lastBatchNum;this.sendBatch(t,!0,s)}sendUncompressed(t){const s=++this.lastBatchNum;this.sendBatch(t,!1,s)}clean(){this.sendNext(),setTimeout((()=>{this.token=null,this.queue.length=0}),10)}}const s="function"==typeof TextEncoder?new TextEncoder:{encode(t){const s=t.length,i=new Uint8Array(3*s);let e=-1;for(let n=0,h=0,r=0;r!==s;){if(n=t.charCodeAt(r),r+=1,n>=55296&&n<=56319){if(r===s){i[e+=1]=239,i[e+=1]=191,i[e+=1]=189;break}if(h=t.charCodeAt(r),!(h>=56320&&h<=57343)){i[e+=1]=239,i[e+=1]=191,i[e+=1]=189;continue}if(n=1024*(n-55296)+h-56320+65536,r+=1,n>65535){i[e+=1]=240|n>>>18,i[e+=1]=128|n>>>12&63,i[e+=1]=128|n>>>6&63,i[e+=1]=128|63&n;continue}}n<=127?i[e+=1]=0|n:n<=2047?(i[e+=1]=192|n>>>6,i[e+=1]=128|63&n):(i[e+=1]=224|n>>>12,i[e+=1]=128|n>>>6&63,i[e+=1]=128|63&n)}return i.subarray(0,e+1)}};class i{constructor(t){this.size=t,this.offset=0,this.checkpointOffset=0,this.data=new Uint8Array(t)}getCurrentOffset(){return this.offset}checkpoint(){this.checkpointOffset=this.offset}get isEmpty(){return 0===this.offset}skip(t){return this.offset+=t,this.offset<=this.size}set(t,s){this.data.set(t,s)}boolean(t){return this.data[this.offset++]=+t,this.offset<=this.size}uint(t){for((t<0||t>Number.MAX_SAFE_INTEGER)&&(t=0);t>=128;)this.data[this.offset++]=t%256|128,t=Math.floor(t/128);return this.data[this.offset++]=t,this.offset<=this.size}int(t){return t=Math.round(t),this.uint(t>=0?2*t:-2*t-1)}string(t){const i=s.encode(t),e=i.byteLength;return!(!this.uint(e)||this.offset+e>this.size)&&(this.data.set(i,this.offset),this.offset+=e,!0)}reset(){this.offset=0,this.checkpointOffset=0}flush(){const t=this.data.slice(0,this.checkpointOffset);return this.reset(),t}}class e extends i{encode(t){switch(t[0]){case 0:case 11:case 114:case 115:return this.uint(t[1]);case 4:case 44:case 47:return this.string(t[1])&&this.string(t[2])&&this.uint(t[3]);case 5:case 20:case 38:case 70:case 75:case 76:case 77:case 82:return this.uint(t[1])&&this.uint(t[2]);case 6:return this.int(t[1])&&this.int(t[2]);case 7:return!0;case 8:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.string(t[4])&&this.boolean(t[5]);case 9:case 10:case 24:case 51:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3]);case 12:case 61:case 71:return this.uint(t[1])&&this.string(t[2])&&this.string(t[3]);case 13:case 14:case 17:case 50:case 54:return this.uint(t[1])&&this.string(t[2]);case 16:return this.uint(t[1])&&this.int(t[2])&&this.int(t[3]);case 18:return this.uint(t[1])&&this.string(t[2])&&this.int(t[3]);case 19:return this.uint(t[1])&&this.boolean(t[2]);case 21:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.string(t[5])&&this.uint(t[6])&&this.uint(t[7])&&this.uint(t[8]);case 22:case 27:case 30:case 41:case 45:case 46:case 63:case 64:case 79:return this.string(t[1])&&this.string(t[2]);case 23:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.uint(t[7])&&this.uint(t[8])&&this.uint(t[9]);case 28:case 29:case 42:case 117:case 118:return this.string(t[1]);case 37:return this.uint(t[1])&&this.string(t[2])&&this.uint(t[3]);case 39:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.uint(t[7]);case 40:return this.string(t[1])&&this.uint(t[2])&&this.string(t[3])&&this.string(t[4]);case 48:case 78:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4]);case 49:return this.int(t[1])&&this.int(t[2])&&this.uint(t[3])&&this.uint(t[4]);case 53:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.string(t[7])&&this.string(t[8]);case 55:return this.boolean(t[1]);case 57:case 60:return this.uint(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4]);case 58:case 120:return this.int(t[1]);case 59:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.string(t[5])&&this.string(t[6])&&this.string(t[7]);case 67:case 73:return this.uint(t[1])&&this.string(t[2])&&this.uint(t[3])&&this.string(t[4]);case 69:return this.uint(t[1])&&this.uint(t[2])&&this.string(t[3])&&this.string(t[4]);case 81:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.int(t[4])&&this.string(t[5]);case 83:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.string(t[5])&&this.uint(t[6])&&this.uint(t[7])&&this.uint(t[8])&&this.uint(t[9]);case 84:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.uint(t[4])&&this.string(t[5])&&this.string(t[6]);case 112:return this.uint(t[1])&&this.string(t[2])&&this.boolean(t[3])&&this.string(t[4])&&this.int(t[5])&&this.int(t[6]);case 113:return this.uint(t[1])&&this.uint(t[2])&&this.string(t[3]);case 116:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.string(t[7])&&this.string(t[8])&&this.uint(t[9])&&this.boolean(t[10]);case 119:return this.string(t[1])&&this.uint(t[2]);case 121:return this.string(t[1])&&this.string(t[2])&&this.uint(t[3])&&this.uint(t[4])}}}class n{constructor(t,s,i,n,h,r){this.pageNo=t,this.timestamp=s,this.url=i,this.onBatch=n,this.tabId=h,this.onOfflineEnd=r,this.nextIndex=0,this.beaconSize=2e5,this.encoder=new e(this.beaconSize),this.sizeBuffer=new Uint8Array(3),this.isEmpty=!0,this.beaconSizeLimit=1e6,this.prepare()}writeType(t){return this.encoder.uint(t[0])}writeFields(t){return this.encoder.encode(t)}writeSizeAt(t,s){for(let s=0;s<3;s++)this.sizeBuffer[s]=t>>8*s;this.encoder.set(this.sizeBuffer,s)}prepare(){if(!this.encoder.isEmpty)return;const t=[81,1,this.pageNo,this.nextIndex,this.timestamp,this.url],s=[118,this.tabId];this.writeType(t),this.writeFields(t),this.writeWithSize(s),this.isEmpty=!0}writeWithSize(t){const s=this.encoder;if(!this.writeType(t)||!s.skip(3))return!1;const i=s.getCurrentOffset(),e=this.writeFields(t);if(e){const e=s.getCurrentOffset()-i;if(e>16777215)return console.warn("OpenReplay: max message size overflow."),!1;this.writeSizeAt(e,i-3),s.checkpoint(),this.isEmpty=this.isEmpty&&0===t[0],this.nextIndex++}return e}setBeaconSizeLimit(t){this.beaconSizeLimit=t}writeMessage(t){if("q_end"===t[0])return this.finaliseBatch(),this.onOfflineEnd();0===t[0]&&(this.timestamp=t[1]),4===t[0]&&(this.url=t[1]),this.writeWithSize(t)||(this.finaliseBatch(),this.writeWithSize(t)||(this.encoder=new e(this.beaconSizeLimit),this.prepare(),this.writeWithSize(t)?this.finaliseBatch():console.warn("OpenReplay: beacon size overflow. Skipping large message.",t,this),this.encoder=new e(this.beaconSize),this.prepare()))}finaliseBatch(){if(this.isEmpty)return;const t=this.encoder.flush();this.onBatch(t),this.prepare()}clean(){this.encoder.reset()}}var h;!function(t){t[t.NotActive=0]="NotActive",t[t.Starting=1]="Starting",t[t.Stopping=2]="Stopping",t[t.Active=3]="Active",t[t.Stopped=4]="Stopped"}(h||(h={}));let r=null,a=null,u=h.NotActive;function o(){a&&a.finaliseBatch()}function c(){return new Promise((t=>{u=h.Stopping,null!==l&&(clearInterval(l),l=null),a&&(a.clean(),a=null),r&&(r.clean(),setTimeout((()=>{r=null}),20)),setTimeout((()=>{u=h.NotActive,t(null)}),100)}))}function p(){u!==h.Stopped&&(postMessage("a_stop"),c().then((()=>{postMessage("a_start")})))}let g,l=null;self.onmessage=({data:s})=>{if(null!=s){if("stop"===s)return o(),void c().then((()=>{u=h.Stopped}));if("forceFlushBatch"!==s){if(!Array.isArray(s)){if("compressed"===s.type){if(!r)return console.debug("OR WebWorker: sender not initialised. Compressed batch."),void p();s.batch&&r.sendCompressed(s.batch)}if("uncompressed"===s.type){if(!r)return console.debug("OR WebWorker: sender not initialised. Uncompressed batch."),void p();s.batch&&r.sendUncompressed(s.batch)}return"start"===s.type?(u=h.Starting,r=new t(s.ingestPoint,(()=>{p()}),(t=>{!function(t){postMessage({type:"failure",reason:t}),c()}(t)}),s.connAttemptCount,s.connAttemptGap,(t=>{postMessage({type:"compress",batch:t},[t.buffer])}),s.pageNo),a=new n(s.pageNo,s.timestamp,s.url,(t=>{r&&r.push(t)}),s.tabId,(()=>postMessage({type:"queue_empty"}))),null===l&&(l=setInterval(o,1e4)),u=h.Active):"auth"===s.type?r?a?(r.authorise(s.token),void(s.beaconSizeLimit&&a.setBeaconSizeLimit(s.beaconSizeLimit))):(console.debug("OR WebWorker: writer not initialised. Received auth."),void p()):(console.debug("OR WebWorker: sender not initialised. Received auth."),void p()):void 0}if(a){const t=a;s.forEach((s=>{55===s[0]&&(s[1]?g=setTimeout((()=>p()),18e5):clearTimeout(g)),t.writeMessage(s)}))}else postMessage("not_init"),p()}else o()}else o()};'], { type: 'text/javascript' })));
199
- this.worker.onerror = (e) => {
200
- this._debug('webworker_error', e);
201
- };
202
- this.worker.onmessage = ({ data }) => {
203
- // handling 401 auth restart (new token assignment)
204
- if (data === 'a_stop') {
205
- this.stop(false);
206
- }
207
- else if (data === 'a_start') {
208
- void this.start({}, true);
209
- }
210
- else if (data === 'not_init') {
211
- this.debug.warn('OR WebWorker: writer not initialised. Restarting tracker');
212
- }
213
- else if (data.type === 'failure') {
214
- this.stop(false);
215
- this.debug.error('worker_failed', data.reason);
216
- this._debug('worker_failed', data.reason);
217
- }
218
- else if (data.type === 'compress') {
219
- const batch = data.batch;
220
- const batchSize = batch.byteLength;
221
- if (batchSize > this.compressionThreshold) {
222
- (0, fflate_1.gzip)(data.batch, { mtime: 0 }, (err, result) => {
223
- if (err) {
224
- this.debug.error('Openreplay compression error:', err);
225
- this.worker?.postMessage({ type: 'uncompressed', batch: batch });
226
- }
227
- else {
228
- this.worker?.postMessage({ type: 'compressed', batch: result });
224
+ this.initWorker();
225
+ const thisTab = this.session.getTabId();
226
+ if (!this.insideIframe) {
227
+ /**
228
+ * if we get a signal from child iframes, we check for their node_id and send it back,
229
+ * so they can act as if it was just a same-domain iframe
230
+ * */
231
+ let crossdomainFrameCount = 0;
232
+ const catchIframeMessage = (event) => {
233
+ const { data } = event;
234
+ if (data.line === proto.iframeSignal) {
235
+ const childIframeDomain = data.domain;
236
+ const pageIframes = Array.from(document.querySelectorAll('iframe'));
237
+ this.pageFrames = pageIframes;
238
+ const signalId = async () => {
239
+ let tries = 0;
240
+ while (tries < 10) {
241
+ const id = this.checkNodeId(pageIframes, childIframeDomain);
242
+ if (id) {
243
+ this.waitStarted()
244
+ .then(() => {
245
+ crossdomainFrameCount++;
246
+ const token = this.session.getSessionToken();
247
+ const iframeData = {
248
+ line: proto.iframeId,
249
+ context: this.contextId,
250
+ domain: childIframeDomain,
251
+ id,
252
+ token,
253
+ frameOrderNumber: crossdomainFrameCount,
254
+ };
255
+ this.debug.log('iframe_data', iframeData);
256
+ // @ts-ignore
257
+ event.source?.postMessage(iframeData, '*');
258
+ })
259
+ .catch(console.error);
260
+ tries = 10;
261
+ break;
229
262
  }
230
- });
231
- }
232
- else {
233
- this.worker?.postMessage({ type: 'uncompressed', batch: batch });
234
- }
263
+ tries++;
264
+ await delay(100);
265
+ }
266
+ };
267
+ void signalId();
235
268
  }
236
- else if (data.type === 'queue_empty') {
237
- this.onSessionSent();
269
+ /**
270
+ * proxying messages from iframe to main body, so they can be in one batch (same indexes, etc)
271
+ * plus we rewrite some of the messages to be relative to the main context/window
272
+ * */
273
+ if (data.line === proto.iframeBatch) {
274
+ const msgBatch = data.messages;
275
+ const mappedMessages = msgBatch.map((msg) => {
276
+ if (msg[0] === 20 /* MType.MouseMove */) {
277
+ let fixedMessage = msg;
278
+ this.pageFrames.forEach((frame) => {
279
+ if (frame.dataset.domain === event.data.domain) {
280
+ const [type, x, y] = msg;
281
+ const { left, top } = frame.getBoundingClientRect();
282
+ fixedMessage = [type, x + left, y + top];
283
+ }
284
+ });
285
+ return fixedMessage;
286
+ }
287
+ if (msg[0] === 68 /* MType.MouseClick */) {
288
+ let fixedMessage = msg;
289
+ this.pageFrames.forEach((frame) => {
290
+ if (frame.dataset.domain === event.data.domain) {
291
+ const [type, id, hesitationTime, label, selector, normX, normY] = msg;
292
+ const { left, top, width, height } = frame.getBoundingClientRect();
293
+ const contentWidth = document.documentElement.scrollWidth;
294
+ const contentHeight = document.documentElement.scrollHeight;
295
+ // (normalizedX * frameWidth + frameLeftOffset)/docSize
296
+ const fullX = (normX / 100) * width + left;
297
+ const fullY = (normY / 100) * height + top;
298
+ const fixedX = fullX / contentWidth;
299
+ const fixedY = fullY / contentHeight;
300
+ fixedMessage = [
301
+ type,
302
+ id,
303
+ hesitationTime,
304
+ label,
305
+ selector,
306
+ Math.round(fixedX * 1e3) / 1e1,
307
+ Math.round(fixedY * 1e3) / 1e1,
308
+ ];
309
+ }
310
+ });
311
+ return fixedMessage;
312
+ }
313
+ return msg;
314
+ });
315
+ this.messages.push(...mappedMessages);
238
316
  }
239
317
  };
240
- const alertWorker = () => {
241
- if (this.worker) {
242
- this.worker.postMessage(null);
318
+ window.addEventListener('message', catchIframeMessage);
319
+ this.attachStopCallback(() => {
320
+ window.removeEventListener('message', catchIframeMessage);
321
+ });
322
+ }
323
+ else {
324
+ const catchParentMessage = (event) => {
325
+ const { data } = event;
326
+ if (data.line !== proto.iframeId) {
327
+ return;
243
328
  }
329
+ this.rootId = data.id;
330
+ this.session.setSessionToken(data.token);
331
+ this.frameOderNumber = data.frameOrderNumber;
332
+ this.debug.log('starting iframe tracking', data);
333
+ this.allowAppStart();
244
334
  };
245
- // keep better tactics, discard others?
246
- this.attachEventListener(window, 'beforeunload', alertWorker, false);
247
- this.attachEventListener(document.body, 'mouseleave', alertWorker, false, false);
248
- // TODO: stop session after inactivity timeout (make configurable)
249
- this.attachEventListener(document, 'visibilitychange', alertWorker, false);
250
- }
251
- catch (e) {
252
- this._debug('worker_start', e);
335
+ window.addEventListener('message', catchParentMessage);
336
+ this.attachStopCallback(() => {
337
+ window.removeEventListener('message', catchParentMessage);
338
+ });
339
+ // communicating with parent window,
340
+ // even if its crossdomain is possible via postMessage api
341
+ const domain = this.initialHostName;
342
+ window.parent.postMessage({
343
+ line: proto.iframeSignal,
344
+ source: thisTab,
345
+ context: this.contextId,
346
+ domain,
347
+ }, '*');
253
348
  }
254
- const thisTab = this.session.getTabId();
255
- const proto = {
256
- // ask if there are any tabs alive
257
- ask: 'never-gonna-give-you-up',
258
- // yes, there are someone out there
259
- resp: 'never-gonna-let-you-down',
260
- // you stole someone's identity
261
- reg: 'never-gonna-run-around-and-desert-you',
262
- };
263
- if (this.bc) {
349
+ if (this.bc !== null) {
264
350
  this.bc.postMessage({
265
351
  line: proto.ask,
266
352
  source: thisTab,
267
353
  context: this.contextId,
268
354
  });
269
- }
270
- if (this.bc !== null) {
355
+ this.startTimeout = setTimeout(() => {
356
+ this.allowAppStart();
357
+ }, 500);
271
358
  this.bc.onmessage = (ev) => {
272
359
  if (ev.data.context === this.contextId) {
273
360
  return;
@@ -275,11 +362,13 @@ class App {
275
362
  if (ev.data.line === proto.resp) {
276
363
  const sessionToken = ev.data.token;
277
364
  this.session.setSessionToken(sessionToken);
365
+ this.allowAppStart();
278
366
  }
279
367
  if (ev.data.line === proto.reg) {
280
368
  const sessionToken = ev.data.token;
281
369
  this.session.regenerateTabId();
282
370
  this.session.setSessionToken(sessionToken);
371
+ this.allowAppStart();
283
372
  }
284
373
  if (ev.data.line === proto.ask) {
285
374
  const token = this.session.getSessionToken();
@@ -295,6 +384,84 @@ class App {
295
384
  };
296
385
  }
297
386
  }
387
+ allowAppStart() {
388
+ this.canStart = true;
389
+ if (this.startTimeout) {
390
+ clearTimeout(this.startTimeout);
391
+ this.startTimeout = null;
392
+ }
393
+ }
394
+ checkNodeId(iframes, domain) {
395
+ for (const iframe of iframes) {
396
+ if (iframe.dataset.domain === domain) {
397
+ // @ts-ignore
398
+ return iframe[this.options.node_id];
399
+ }
400
+ }
401
+ return null;
402
+ }
403
+ initWorker() {
404
+ try {
405
+ this.worker = new Worker(URL.createObjectURL(new Blob(['"use strict";class t{constructor(t,s,i,e=10,n=250,h,r){this.onUnauthorised=s,this.onFailure=i,this.MAX_ATTEMPTS_COUNT=e,this.ATTEMPT_TIMEOUT=n,this.onCompress=h,this.pageNo=r,this.attemptsCount=0,this.busy=!1,this.queue=[],this.token=null,this.lastBatchNum=0,this.ingestURL=t+"/v1/web/i",this.isCompressing=void 0!==h}getQueueStatus(){return 0===this.queue.length&&!this.busy}authorise(t){this.token=t,this.busy||this.sendNext()}push(t){if(this.busy||!this.token)this.queue.push(t);else if(this.busy=!0,this.isCompressing&&this.onCompress)this.onCompress(t);else{const s=++this.lastBatchNum;this.sendBatch(t,!1,s)}}sendNext(){const t=this.queue.shift();if(t)if(this.busy=!0,this.isCompressing&&this.onCompress)this.onCompress(t);else{const s=++this.lastBatchNum;this.sendBatch(t,!1,s)}else this.busy=!1}retry(t,s,i){this.attemptsCount>=this.MAX_ATTEMPTS_COUNT?this.onFailure(`Failed to send batch after ${this.attemptsCount} attempts.`):(this.attemptsCount++,setTimeout((()=>this.sendBatch(t,s,i)),this.ATTEMPT_TIMEOUT*this.attemptsCount))}sendBatch(t,s,i){const e=i?.toString().replace(/^([^_]+)_([^_]+).*/,"$1_$2_$3");this.busy=!0;const n={Authorization:`Bearer ${this.token}`};s&&(n["Content-Encoding"]="gzip"),null!==this.token?fetch(`${this.ingestURL}?batch=${this.pageNo??"noPageNum"}_${e??"noBatchNum"}`,{body:t,method:"POST",headers:n,keepalive:t.length<65536}).then((e=>{if(401===e.status)return this.busy=!1,void this.onUnauthorised();e.status>=400?this.retry(t,s,`${i??"noBatchNum"}_network:${e.status}`):(this.attemptsCount=0,this.sendNext())})).catch((e=>{console.warn("OpenReplay:",e),this.retry(t,s,`${i??"noBatchNum"}_reject:${e.message}`)})):setTimeout((()=>{this.sendBatch(t,s,`${i??"noBatchNum"}_newToken`)}),500)}sendCompressed(t){const s=++this.lastBatchNum;this.sendBatch(t,!0,s)}sendUncompressed(t){const s=++this.lastBatchNum;this.sendBatch(t,!1,s)}clean(){this.sendNext(),setTimeout((()=>{this.token=null,this.queue.length=0}),10)}}const s="function"==typeof TextEncoder?new TextEncoder:{encode(t){const s=t.length,i=new Uint8Array(3*s);let e=-1;for(let n=0,h=0,r=0;r!==s;){if(n=t.charCodeAt(r),r+=1,n>=55296&&n<=56319){if(r===s){i[e+=1]=239,i[e+=1]=191,i[e+=1]=189;break}if(h=t.charCodeAt(r),!(h>=56320&&h<=57343)){i[e+=1]=239,i[e+=1]=191,i[e+=1]=189;continue}if(n=1024*(n-55296)+h-56320+65536,r+=1,n>65535){i[e+=1]=240|n>>>18,i[e+=1]=128|n>>>12&63,i[e+=1]=128|n>>>6&63,i[e+=1]=128|63&n;continue}}n<=127?i[e+=1]=0|n:n<=2047?(i[e+=1]=192|n>>>6,i[e+=1]=128|63&n):(i[e+=1]=224|n>>>12,i[e+=1]=128|n>>>6&63,i[e+=1]=128|63&n)}return i.subarray(0,e+1)}};class i{constructor(t){this.size=t,this.offset=0,this.checkpointOffset=0,this.data=new Uint8Array(t)}getCurrentOffset(){return this.offset}checkpoint(){this.checkpointOffset=this.offset}get isEmpty(){return 0===this.offset}skip(t){return this.offset+=t,this.offset<=this.size}set(t,s){this.data.set(t,s)}boolean(t){return this.data[this.offset++]=+t,this.offset<=this.size}uint(t){for((t<0||t>Number.MAX_SAFE_INTEGER)&&(t=0);t>=128;)this.data[this.offset++]=t%256|128,t=Math.floor(t/128);return this.data[this.offset++]=t,this.offset<=this.size}int(t){return t=Math.round(t),this.uint(t>=0?2*t:-2*t-1)}string(t){const i=s.encode(t),e=i.byteLength;return!(!this.uint(e)||this.offset+e>this.size)&&(this.data.set(i,this.offset),this.offset+=e,!0)}reset(){this.offset=0,this.checkpointOffset=0}flush(){const t=this.data.slice(0,this.checkpointOffset);return this.reset(),t}}class e extends i{encode(t){switch(t[0]){case 0:case 11:case 114:case 115:return this.uint(t[1]);case 4:case 44:case 47:return this.string(t[1])&&this.string(t[2])&&this.uint(t[3]);case 5:case 20:case 38:case 70:case 75:case 76:case 77:case 82:return this.uint(t[1])&&this.uint(t[2]);case 6:return this.int(t[1])&&this.int(t[2]);case 7:return!0;case 8:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.string(t[4])&&this.boolean(t[5]);case 9:case 10:case 24:case 51:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3]);case 12:case 61:case 71:return this.uint(t[1])&&this.string(t[2])&&this.string(t[3]);case 13:case 14:case 17:case 50:case 54:return this.uint(t[1])&&this.string(t[2]);case 16:return this.uint(t[1])&&this.int(t[2])&&this.int(t[3]);case 18:return this.uint(t[1])&&this.string(t[2])&&this.int(t[3]);case 19:return this.uint(t[1])&&this.boolean(t[2]);case 21:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.string(t[5])&&this.uint(t[6])&&this.uint(t[7])&&this.uint(t[8]);case 22:case 27:case 30:case 41:case 45:case 46:case 63:case 64:case 79:return this.string(t[1])&&this.string(t[2]);case 23:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.uint(t[7])&&this.uint(t[8])&&this.uint(t[9]);case 28:case 29:case 42:case 117:case 118:return this.string(t[1]);case 37:return this.uint(t[1])&&this.string(t[2])&&this.uint(t[3]);case 39:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.uint(t[7]);case 40:return this.string(t[1])&&this.uint(t[2])&&this.string(t[3])&&this.string(t[4]);case 48:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.int(t[5]);case 49:return this.int(t[1])&&this.int(t[2])&&this.uint(t[3])&&this.uint(t[4]);case 53:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.string(t[7])&&this.string(t[8]);case 55:return this.boolean(t[1]);case 57:case 60:return this.uint(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4]);case 58:case 120:return this.int(t[1]);case 59:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.string(t[5])&&this.string(t[6])&&this.string(t[7]);case 67:case 73:return this.uint(t[1])&&this.string(t[2])&&this.uint(t[3])&&this.string(t[4]);case 68:return this.uint(t[1])&&this.uint(t[2])&&this.string(t[3])&&this.string(t[4])&&this.uint(t[5])&&this.uint(t[6]);case 69:return this.uint(t[1])&&this.uint(t[2])&&this.string(t[3])&&this.string(t[4]);case 78:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4]);case 81:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.int(t[4])&&this.string(t[5]);case 83:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.string(t[5])&&this.uint(t[6])&&this.uint(t[7])&&this.uint(t[8])&&this.uint(t[9]);case 84:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.uint(t[4])&&this.string(t[5])&&this.string(t[6]);case 112:return this.uint(t[1])&&this.string(t[2])&&this.boolean(t[3])&&this.string(t[4])&&this.int(t[5])&&this.int(t[6]);case 113:return this.uint(t[1])&&this.uint(t[2])&&this.string(t[3]);case 116:return this.uint(t[1])&&this.uint(t[2])&&this.uint(t[3])&&this.uint(t[4])&&this.uint(t[5])&&this.uint(t[6])&&this.string(t[7])&&this.string(t[8])&&this.uint(t[9])&&this.boolean(t[10]);case 119:return this.string(t[1])&&this.uint(t[2]);case 121:return this.string(t[1])&&this.string(t[2])&&this.uint(t[3])&&this.uint(t[4]);case 122:return this.string(t[1])&&this.string(t[2])&&this.uint(t[3])&&this.string(t[4]);case 123:return this.string(t[1])&&this.string(t[2])&&this.string(t[3])&&this.string(t[4])&&this.uint(t[5])}}}class n{constructor(t,s,i,n,h,r){this.pageNo=t,this.timestamp=s,this.url=i,this.onBatch=n,this.tabId=h,this.onOfflineEnd=r,this.nextIndex=0,this.beaconSize=2e5,this.encoder=new e(this.beaconSize),this.sizeBuffer=new Uint8Array(3),this.isEmpty=!0,this.beaconSizeLimit=1e6,this.prepare()}writeType(t){return this.encoder.uint(t[0])}writeFields(t){return this.encoder.encode(t)}writeSizeAt(t,s){for(let s=0;s<3;s++)this.sizeBuffer[s]=t>>8*s;this.encoder.set(this.sizeBuffer,s)}prepare(){if(!this.encoder.isEmpty)return;const t=[81,1,this.pageNo,this.nextIndex,this.timestamp,this.url],s=[118,this.tabId];this.writeType(t),this.writeFields(t),this.writeWithSize(s),this.isEmpty=!0}writeWithSize(t){const s=this.encoder;if(!this.writeType(t)||!s.skip(3))return!1;const i=s.getCurrentOffset(),e=this.writeFields(t);if(e){const e=s.getCurrentOffset()-i;if(e>16777215)return console.warn("OpenReplay: max message size overflow."),!1;this.writeSizeAt(e,i-3),s.checkpoint(),this.isEmpty=this.isEmpty&&0===t[0],this.nextIndex++}return e}setBeaconSizeLimit(t){this.beaconSizeLimit=t}writeMessage(t){if("q_end"===t[0])return this.finaliseBatch(),this.onOfflineEnd();0===t[0]&&(this.timestamp=t[1]),122===t[0]&&(this.url=t[1]),this.writeWithSize(t)||(this.finaliseBatch(),this.writeWithSize(t)||(this.encoder=new e(this.beaconSizeLimit),this.prepare(),this.writeWithSize(t)?this.finaliseBatch():console.warn("OpenReplay: beacon size overflow. Skipping large message.",t,this),this.encoder=new e(this.beaconSize),this.prepare()))}finaliseBatch(){if(this.isEmpty)return;const t=this.encoder.flush();this.onBatch(t),this.prepare()}clean(){this.encoder.reset()}}var h;!function(t){t[t.NotActive=0]="NotActive",t[t.Starting=1]="Starting",t[t.Stopping=2]="Stopping",t[t.Active=3]="Active",t[t.Stopped=4]="Stopped"}(h||(h={}));let r=null,a=null,u=h.NotActive;function o(){a&&a.finaliseBatch()}function c(){return new Promise((t=>{u=h.Stopping,null!==l&&(clearInterval(l),l=null),a&&(a.clean(),a=null),r&&(r.clean(),setTimeout((()=>{r=null}),20)),setTimeout((()=>{u=h.NotActive,t(null)}),100)}))}function g(){u!==h.Stopped&&(postMessage("a_stop"),c().then((()=>{postMessage("a_start")})))}let p,l=null;self.onmessage=({data:s})=>{if(null!=s){if("stop"===s)return o(),void c().then((()=>{u=h.Stopped}));if("forceFlushBatch"!==s){if(!Array.isArray(s)){if("compressed"===s.type){if(!r)return console.debug("OR WebWorker: sender not initialised. Compressed batch."),void g();s.batch&&r.sendCompressed(s.batch)}if("uncompressed"===s.type){if(!r)return console.debug("OR WebWorker: sender not initialised. Uncompressed batch."),void g();s.batch&&r.sendUncompressed(s.batch)}return"start"===s.type?(u=h.Starting,r=new t(s.ingestPoint,(()=>{g()}),(t=>{!function(t){postMessage({type:"failure",reason:t}),c()}(t)}),s.connAttemptCount,s.connAttemptGap,(t=>{postMessage({type:"compress",batch:t},[t.buffer])}),s.pageNo),a=new n(s.pageNo,s.timestamp,s.url,(t=>{r&&r.push(t)}),s.tabId,(()=>postMessage({type:"queue_empty"}))),null===l&&(l=setInterval(o,1e4)),u=h.Active):"auth"===s.type?r?a?(r.authorise(s.token),void(s.beaconSizeLimit&&a.setBeaconSizeLimit(s.beaconSizeLimit))):(console.debug("OR WebWorker: writer not initialised. Received auth."),void g()):(console.debug("OR WebWorker: sender not initialised. Received auth."),void g()):void 0}if(a){const t=a;s.forEach((s=>{55===s[0]&&(s[1]?p=setTimeout((()=>g()),18e5):clearTimeout(p)),t.writeMessage(s)}))}else postMessage("not_init"),g()}else o()}else o()};'], { type: 'text/javascript' })));
406
+ this.worker.onerror = (e) => {
407
+ this._debug('webworker_error', e);
408
+ };
409
+ this.worker.onmessage = ({ data }) => {
410
+ this.handleWorkerMsg(data);
411
+ };
412
+ const alertWorker = () => {
413
+ if (this.worker) {
414
+ this.worker.postMessage(null);
415
+ }
416
+ };
417
+ // keep better tactics, discard others?
418
+ this.attachEventListener(window, 'beforeunload', alertWorker, false);
419
+ this.attachEventListener(document.body, 'mouseleave', alertWorker, false, false);
420
+ // TODO: stop session after inactivity timeout (make configurable)
421
+ this.attachEventListener(document, 'visibilitychange', alertWorker, false);
422
+ }
423
+ catch (e) {
424
+ this._debug('worker_start', e);
425
+ }
426
+ }
427
+ handleWorkerMsg(data) {
428
+ // handling 401 auth restart (new token assignment)
429
+ if (data === 'a_stop') {
430
+ this.stop(false);
431
+ }
432
+ else if (data === 'a_start') {
433
+ void this.start({}, true);
434
+ }
435
+ else if (data === 'not_init') {
436
+ this.debug.warn('OR WebWorker: writer not initialised. Restarting tracker');
437
+ }
438
+ else if (data.type === 'failure') {
439
+ this.stop(false);
440
+ this.debug.error('worker_failed', data.reason);
441
+ this._debug('worker_failed', data.reason);
442
+ }
443
+ else if (data.type === 'compress') {
444
+ const batch = data.batch;
445
+ const batchSize = batch.byteLength;
446
+ if (batchSize > this.compressionThreshold) {
447
+ (0, fflate_1.gzip)(data.batch, { mtime: 0 }, (err, result) => {
448
+ if (err) {
449
+ this.debug.error('Openreplay compression error:', err);
450
+ this.worker?.postMessage({ type: 'uncompressed', batch: batch });
451
+ }
452
+ else {
453
+ this.worker?.postMessage({ type: 'compressed', batch: result });
454
+ }
455
+ });
456
+ }
457
+ else {
458
+ this.worker?.postMessage({ type: 'uncompressed', batch: batch });
459
+ }
460
+ }
461
+ else if (data.type === 'queue_empty') {
462
+ this.onSessionSent();
463
+ }
464
+ }
298
465
  _debug(context, e) {
299
466
  if (this.options.__debug_report_edp !== null) {
300
467
  void fetch(this.options.__debug_report_edp, {
@@ -313,15 +480,6 @@ class App {
313
480
  if (this.activityState === ActivityState.NotActive) {
314
481
  return;
315
482
  }
316
- // === Back compatibility with Fetch/Axios plugins ===
317
- if (message[0] === 39 /* MType.Fetch */) {
318
- this._usingOldFetchPlugin = true;
319
- (0, utils_js_1.deprecationWarn)('Fetch plugin', "'network' init option", '/installation/network-options');
320
- (0, utils_js_1.deprecationWarn)('Axios plugin', "'network' init option", '/installation/network-options');
321
- }
322
- if (this._usingOldFetchPlugin && message[0] === 83 /* MType.NetworkRequest */) {
323
- return;
324
- }
325
483
  // ====================================================
326
484
  if (this.activityState === ActivityState.ColdStart) {
327
485
  this.bufferedMessages1.push(message);
@@ -348,30 +506,41 @@ class App {
348
506
  * */
349
507
  _nCommit() {
350
508
  if (this.socketMode) {
351
- this.messages.unshift((0, messages_gen_js_2.TabData)(this.session.getTabId()));
352
- this.messages.unshift((0, messages_gen_js_2.Timestamp)(this.timestamp()));
509
+ this.messages.unshift((0, messages_gen_js_1.TabData)(this.session.getTabId()));
510
+ this.messages.unshift((0, messages_gen_js_1.Timestamp)(this.timestamp()));
353
511
  this.commitCallbacks.forEach((cb) => cb(this.messages));
354
512
  this.messages.length = 0;
355
513
  return;
356
514
  }
357
- if (this.worker !== undefined && this.messages.length) {
358
- try {
359
- (0, utils_js_1.requestIdleCb)(() => {
360
- this.messages.unshift((0, messages_gen_js_2.TabData)(this.session.getTabId()));
361
- this.messages.unshift((0, messages_gen_js_2.Timestamp)(this.timestamp()));
362
- // why I need to add opt chaining?
363
- this.worker?.postMessage(this.messages);
364
- this.commitCallbacks.forEach((cb) => cb(this.messages));
365
- this.messages.length = 0;
366
- });
367
- }
368
- catch (e) {
369
- this._debug('worker_commit', e);
370
- this.stop(true);
371
- setTimeout(() => {
372
- void this.start();
373
- }, 500);
374
- }
515
+ if (this.worker === undefined || !this.messages.length) {
516
+ return;
517
+ }
518
+ if (this.insideIframe) {
519
+ window.parent.postMessage({
520
+ line: proto.iframeBatch,
521
+ messages: this.messages,
522
+ domain: this.initialHostName,
523
+ }, '*');
524
+ this.commitCallbacks.forEach((cb) => cb(this.messages));
525
+ this.messages.length = 0;
526
+ return;
527
+ }
528
+ try {
529
+ (0, utils_js_1.requestIdleCb)(() => {
530
+ this.messages.unshift((0, messages_gen_js_1.TabData)(this.session.getTabId()));
531
+ this.messages.unshift((0, messages_gen_js_1.Timestamp)(this.timestamp()));
532
+ // why I need to add opt chaining?
533
+ this.worker?.postMessage(this.messages);
534
+ this.commitCallbacks.forEach((cb) => cb(this.messages));
535
+ this.messages.length = 0;
536
+ });
537
+ }
538
+ catch (e) {
539
+ this._debug('worker_commit', e);
540
+ this.stop(true);
541
+ setTimeout(() => {
542
+ void this.start();
543
+ }, 500);
375
544
  }
376
545
  }
377
546
  /**
@@ -383,10 +552,10 @@ class App {
383
552
  _cStartCommit() {
384
553
  this.coldStartCommitN += 1;
385
554
  if (this.coldStartCommitN === 2) {
386
- this.bufferedMessages1.push((0, messages_gen_js_2.Timestamp)(this.timestamp()));
387
- this.bufferedMessages1.push((0, messages_gen_js_2.TabData)(this.session.getTabId()));
388
- this.bufferedMessages2.push((0, messages_gen_js_2.Timestamp)(this.timestamp()));
389
- this.bufferedMessages2.push((0, messages_gen_js_2.TabData)(this.session.getTabId()));
555
+ this.bufferedMessages1.push((0, messages_gen_js_1.Timestamp)(this.timestamp()));
556
+ this.bufferedMessages1.push((0, messages_gen_js_1.TabData)(this.session.getTabId()));
557
+ this.bufferedMessages2.push((0, messages_gen_js_1.Timestamp)(this.timestamp()));
558
+ this.bufferedMessages2.push((0, messages_gen_js_1.TabData)(this.session.getTabId()));
390
559
  this.coldStartCommitN = 0;
391
560
  }
392
561
  }
@@ -441,8 +610,10 @@ class App {
441
610
  if (useSafe) {
442
611
  listener = this.safe(listener);
443
612
  }
444
- this.attachStartCallback(() => (target ? (0, utils_js_1.createEventListener)(target, type, listener, useCapture) : null), useSafe);
445
- this.attachStopCallback(() => (target ? (0, utils_js_1.deleteEventListener)(target, type, listener, useCapture) : null), useSafe);
613
+ const createListener = () => target ? (0, utils_js_1.createEventListener)(target, type, listener, useCapture) : null;
614
+ const deleteListener = () => target ? (0, utils_js_1.deleteEventListener)(target, type, listener, useCapture) : null;
615
+ this.attachStartCallback(createListener, useSafe);
616
+ this.attachStopCallback(deleteListener, useSafe);
446
617
  }
447
618
  // TODO: full correct semantic
448
619
  checkRequiredVersion(version) {
@@ -546,55 +717,15 @@ class App {
546
717
  }
547
718
  /**
548
719
  * start buffering messages without starting the actual session, which gives
549
- * user 30 seconds to "activate" and record session by calling `start()` on conditional trigger
720
+ * user 30 seconds to "activate" and record session by calling `start()` on conditional trigger,
550
721
  * and we will then send buffered batch, so it won't get lost
551
722
  * */
552
723
  async coldStart(startOpts = {}, conditional) {
553
724
  this.singleBuffer = false;
554
725
  const second = 1000;
555
- if (conditional) {
556
- this.conditionsManager = new conditionsManager_js_1.default(this, startOpts);
557
- }
558
726
  const isNewSession = this.checkSessionToken(startOpts.forceNew);
559
727
  if (conditional) {
560
- const r = await fetch(this.options.ingestPoint + '/v1/web/start', {
561
- method: 'POST',
562
- headers: {
563
- 'Content-Type': 'application/json',
564
- },
565
- body: JSON.stringify({
566
- ...this.getTrackerInfo(),
567
- timestamp: (0, utils_js_1.now)(),
568
- doNotRecord: true,
569
- bufferDiff: 0,
570
- userID: this.session.getInfo().userID,
571
- token: undefined,
572
- deviceMemory: performance_js_1.deviceMemory,
573
- jsHeapSizeLimit: performance_js_1.jsHeapSizeLimit,
574
- timezone: getTimezone(),
575
- width: window.innerWidth,
576
- height: window.innerHeight,
577
- }),
578
- });
579
- const {
580
- // this token is needed to fetch conditions and flags,
581
- // but it can't be used to record a session
582
- token, userBrowser, userCity, userCountry, userDevice, userOS, userState, projectID, } = await r.json();
583
- this.session.assign({ projectID });
584
- this.session.setUserInfo({
585
- userBrowser,
586
- userCity,
587
- userCountry,
588
- userDevice,
589
- userOS,
590
- userState,
591
- });
592
- const onStartInfo = { sessionToken: token, userUUID: '', sessionID: '' };
593
- this.startCallbacks.forEach((cb) => cb(onStartInfo));
594
- await this.conditionsManager?.fetchConditions(projectID, token);
595
- await this.featureFlags.reloadFlags(token);
596
- await this.tagWatcher.fetchTags(this.options.ingestPoint, token);
597
- this.conditionsManager?.processFlags(this.featureFlags.flags);
728
+ await this.setupConditionalStart(startOpts);
598
729
  }
599
730
  const cycle = () => {
600
731
  this.orderNumber += 1;
@@ -602,13 +733,13 @@ class App {
602
733
  this.coldStartTs = (0, utils_js_1.now)();
603
734
  if (this.orderNumber % 2 === 0) {
604
735
  this.bufferedMessages1.length = 0;
605
- this.bufferedMessages1.push((0, messages_gen_js_2.Timestamp)(this.timestamp()));
606
- this.bufferedMessages1.push((0, messages_gen_js_2.TabData)(this.session.getTabId()));
736
+ this.bufferedMessages1.push((0, messages_gen_js_1.Timestamp)(this.timestamp()));
737
+ this.bufferedMessages1.push((0, messages_gen_js_1.TabData)(this.session.getTabId()));
607
738
  }
608
739
  else {
609
740
  this.bufferedMessages2.length = 0;
610
- this.bufferedMessages2.push((0, messages_gen_js_2.Timestamp)(this.timestamp()));
611
- this.bufferedMessages2.push((0, messages_gen_js_2.TabData)(this.session.getTabId()));
741
+ this.bufferedMessages2.push((0, messages_gen_js_1.Timestamp)(this.timestamp()));
742
+ this.bufferedMessages2.push((0, messages_gen_js_1.TabData)(this.session.getTabId()));
612
743
  }
613
744
  this.stop(false);
614
745
  this.activityState = ActivityState.ColdStart;
@@ -625,7 +756,7 @@ class App {
625
756
  if (!isNewSession) {
626
757
  this.debug.log('continuing session on new tab', this.session.getTabId());
627
758
  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
628
- this.send((0, messages_gen_js_2.TabChange)(this.session.getTabId()));
759
+ this.send((0, messages_gen_js_1.TabChange)(this.session.getTabId()));
629
760
  }
630
761
  this.observer.observe();
631
762
  this.ticker.start();
@@ -635,6 +766,47 @@ class App {
635
766
  }, 30 * second);
636
767
  cycle();
637
768
  }
769
+ async setupConditionalStart(startOpts) {
770
+ this.conditionsManager = new conditionsManager_js_1.default(this, startOpts);
771
+ const r = await fetch(this.options.ingestPoint + '/v1/web/start', {
772
+ method: 'POST',
773
+ headers: {
774
+ 'Content-Type': 'application/json',
775
+ },
776
+ body: JSON.stringify({
777
+ ...this.getTrackerInfo(),
778
+ timestamp: (0, utils_js_1.now)(),
779
+ doNotRecord: true,
780
+ bufferDiff: 0,
781
+ userID: this.session.getInfo().userID,
782
+ token: undefined,
783
+ deviceMemory: performance_js_1.deviceMemory,
784
+ jsHeapSizeLimit: performance_js_1.jsHeapSizeLimit,
785
+ timezone: getTimezone(),
786
+ width: window.innerWidth,
787
+ height: window.innerHeight,
788
+ }),
789
+ });
790
+ const {
791
+ // this token is needed to fetch conditions and flags,
792
+ // but it can't be used to record a session
793
+ token, userBrowser, userCity, userCountry, userDevice, userOS, userState, projectID, } = await r.json();
794
+ this.session.assign({ projectID });
795
+ this.session.setUserInfo({
796
+ userBrowser,
797
+ userCity,
798
+ userCountry,
799
+ userDevice,
800
+ userOS,
801
+ userState,
802
+ });
803
+ const onStartInfo = { sessionToken: token, userUUID: '', sessionID: '' };
804
+ this.startCallbacks.forEach((cb) => cb(onStartInfo));
805
+ await this.conditionsManager?.fetchConditions(projectID, token);
806
+ await this.featureFlags.reloadFlags(token);
807
+ await this.tagWatcher.fetchTags(this.options.ingestPoint, token);
808
+ this.conditionsManager?.processFlags(this.featureFlags.flags);
809
+ }
638
810
  /**
639
811
  * Starts offline session recording
640
812
  * @param {Object} startOpts - options for session start, same as .start()
@@ -652,8 +824,8 @@ class App {
652
824
  this.bufferedMessages1 = Array.isArray(data) ? data : this.bufferedMessages1;
653
825
  this.localStorage.removeItem(bufferStorageKey);
654
826
  }
655
- this.bufferedMessages1.push((0, messages_gen_js_2.Timestamp)(this.timestamp()));
656
- this.bufferedMessages1.push((0, messages_gen_js_2.TabData)(this.session.getTabId()));
827
+ this.bufferedMessages1.push((0, messages_gen_js_1.Timestamp)(this.timestamp()));
828
+ this.bufferedMessages1.push((0, messages_gen_js_1.TabData)(this.session.getTabId()));
657
829
  this.activityState = ActivityState.ColdStart;
658
830
  if (startOpts.sessionHash) {
659
831
  this.session.applySessionHash(startOpts.sessionHash);
@@ -669,7 +841,7 @@ class App {
669
841
  this.startCallbacks.forEach((cb) => cb(onStartInfo));
670
842
  if (!isNewSession) {
671
843
  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
672
- this.send((0, messages_gen_js_2.TabChange)(this.session.getTabId()));
844
+ this.send((0, messages_gen_js_1.TabChange)(this.session.getTabId()));
673
845
  }
674
846
  this.observer.observe();
675
847
  this.ticker.start();
@@ -682,7 +854,7 @@ class App {
682
854
  /**
683
855
  * Saves the captured messages in localStorage (or whatever is used in its place)
684
856
  *
685
- * Then when this.offlineRecording is called, it will preload this messages and clear the storage item
857
+ * Then, when this.offlineRecording is called, it will preload this messages and clear the storage item
686
858
  *
687
859
  * Keeping the size of local storage reasonable is up to the end users of this library
688
860
  * */
@@ -759,7 +931,7 @@ class App {
759
931
  this.postToWorker([['q_end']]);
760
932
  this.clearBuffers();
761
933
  }
762
- _start(startOpts = {}, resetByWorker = false, conditionName) {
934
+ async _start(startOpts = {}, resetByWorker = false, conditionName) {
763
935
  const isColdStart = this.activityState === ActivityState.ColdStart;
764
936
  if (isColdStart && this.coldInterval) {
765
937
  clearInterval(this.coldInterval);
@@ -805,54 +977,41 @@ class App {
805
977
  const isNewSession = this.checkSessionToken(startOpts.forceNew);
806
978
  this.sessionStorage.removeItem(this.options.session_reset_key);
807
979
  this.debug.log('OpenReplay: starting session; need new session id?', isNewSession, 'session token: ', sessionToken);
808
- return window
809
- .fetch(this.options.ingestPoint + '/v1/web/start', {
810
- method: 'POST',
811
- headers: {
812
- 'Content-Type': 'application/json',
813
- },
814
- body: JSON.stringify({
815
- ...this.getTrackerInfo(),
816
- timestamp,
817
- doNotRecord: false,
818
- bufferDiff: timestamp - this.coldStartTs,
819
- userID: this.session.getInfo().userID,
820
- token: isNewSession ? undefined : sessionToken,
821
- deviceMemory: performance_js_1.deviceMemory,
822
- jsHeapSizeLimit: performance_js_1.jsHeapSizeLimit,
823
- timezone: getTimezone(),
824
- condition: conditionName,
825
- assistOnly: startOpts.assistOnly ?? this.socketMode,
826
- }),
827
- })
828
- .then((r) => {
829
- if (r.status === 200) {
830
- return r.json();
831
- }
832
- else {
833
- return r
834
- .text()
835
- .then((text) => text === CANCELED
836
- ? Promise.reject(CANCELED)
837
- : Promise.reject(`Server error: ${r.status}. ${text}`));
980
+ try {
981
+ const r = await window.fetch(this.options.ingestPoint + '/v1/web/start', {
982
+ method: 'POST',
983
+ headers: {
984
+ 'Content-Type': 'application/json',
985
+ },
986
+ body: JSON.stringify({
987
+ ...this.getTrackerInfo(),
988
+ timestamp,
989
+ doNotRecord: false,
990
+ bufferDiff: timestamp - this.coldStartTs,
991
+ userID: this.session.getInfo().userID,
992
+ token: isNewSession ? undefined : sessionToken,
993
+ deviceMemory: performance_js_1.deviceMemory,
994
+ jsHeapSizeLimit: performance_js_1.jsHeapSizeLimit,
995
+ timezone: getTimezone(),
996
+ condition: conditionName,
997
+ assistOnly: startOpts.assistOnly ?? this.socketMode,
998
+ }),
999
+ });
1000
+ if (r.status !== 200) {
1001
+ const error = await r.text();
1002
+ const reason = error === CANCELED ? CANCELED : `Server error: ${r.status}. ${error}`;
1003
+ return Promise.reject(reason);
838
1004
  }
839
- })
840
- .then(async (r) => {
841
1005
  if (!this.worker) {
842
1006
  const reason = 'no worker found after start request (this might not happen)';
843
1007
  this.signalError(reason, []);
844
1008
  return Promise.reject(reason);
845
1009
  }
846
- if (this.activityState === ActivityState.NotActive) {
847
- const reason = 'Tracker stopped during authorization';
848
- this.signalError(reason, []);
849
- return Promise.reject(reason);
850
- }
851
1010
  const { token, userUUID, projectID, beaconSizeLimit, compressionThreshold, // how big the batch should be before we decide to compress it
852
1011
  delay, // derived from token
853
1012
  sessionID, // derived from token
854
1013
  startTimestamp, // real startTS (server time), derived from sessionID
855
- userBrowser, userCity, userCountry, userDevice, userOS, userState, canvasEnabled, canvasQuality, canvasFPS, assistOnly: socketOnly, } = r;
1014
+ userBrowser, userCity, userCountry, userDevice, userOS, userState, canvasEnabled, canvasQuality, canvasFPS, assistOnly: socketOnly, } = await r.json();
856
1015
  if (typeof token !== 'string' ||
857
1016
  typeof userUUID !== 'string' ||
858
1017
  (typeof startTimestamp !== 'number' && typeof startTimestamp !== 'undefined') ||
@@ -892,10 +1051,10 @@ class App {
892
1051
  if (!isNewSession && token === sessionToken) {
893
1052
  this.debug.log('continuing session on new tab', this.session.getTabId());
894
1053
  // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
895
- this.send((0, messages_gen_js_2.TabChange)(this.session.getTabId()));
1054
+ this.send((0, messages_gen_js_1.TabChange)(this.session.getTabId()));
896
1055
  }
897
1056
  // (Re)send Metadata for the case of a new session
898
- Object.entries(this.session.getInfo().metadata).forEach(([key, value]) => this.send((0, messages_gen_js_2.Metadata)(key, value)));
1057
+ Object.entries(this.session.getInfo().metadata).forEach(([key, value]) => this.send((0, messages_gen_js_1.Metadata)(key, value)));
899
1058
  this.localStorage.setItem(this.options.local_uuid_key, userUUID);
900
1059
  this.compressionThreshold = compressionThreshold;
901
1060
  const onStartInfo = { sessionToken: token, userUUID, sessionID };
@@ -930,17 +1089,15 @@ class App {
930
1089
  /** --------------- COLD START BUFFER ------------------*/
931
1090
  }
932
1091
  else {
933
- this.observer.observe();
1092
+ if (this.insideIframe && this.rootId) {
1093
+ this.observer.crossdomainObserve(this.rootId, this.frameOderNumber);
1094
+ }
1095
+ else {
1096
+ this.observer.observe();
1097
+ }
934
1098
  this.ticker.start();
935
1099
  }
936
- // get rid of onStart ?
937
- if (typeof this.options.onStart === 'function') {
938
- this.options.onStart(onStartInfo);
939
- }
940
- this.restartAttempts = 0;
941
- this.uxtManager = this.uxtManager
942
- ? this.uxtManager
943
- : new index_js_1.default(this, uxtStorageKey);
1100
+ this.uxtManager = this.uxtManager ? this.uxtManager : new index_js_1.default(this, uxtStorageKey);
944
1101
  let uxtId;
945
1102
  const savedUxtTag = this.localStorage.getItem(uxtStorageKey);
946
1103
  if (savedUxtTag) {
@@ -968,8 +1125,8 @@ class App {
968
1125
  }
969
1126
  }
970
1127
  return SuccessfulStart(onStartInfo);
971
- })
972
- .catch((reason) => {
1128
+ }
1129
+ catch (reason) {
973
1130
  this.stop();
974
1131
  this.session.reset();
975
1132
  if (reason === CANCELED) {
@@ -980,7 +1137,7 @@ class App {
980
1137
  const errorMessage = reason instanceof Error ? reason.message : reason.toString();
981
1138
  this.signalError(errorMessage, []);
982
1139
  return UnsuccessfulStart(errorMessage);
983
- });
1140
+ }
984
1141
  }
985
1142
  addOnUxtCb(cb) {
986
1143
  // @ts-ignore
@@ -989,33 +1146,57 @@ class App {
989
1146
  getUxtId() {
990
1147
  return this.uxtManager?.getTestId();
991
1148
  }
1149
+ async waitStart() {
1150
+ return new Promise((resolve) => {
1151
+ const check = () => {
1152
+ if (this.canStart) {
1153
+ resolve(true);
1154
+ }
1155
+ else {
1156
+ setTimeout(check, 25);
1157
+ }
1158
+ };
1159
+ check();
1160
+ });
1161
+ }
1162
+ async waitStarted() {
1163
+ return new Promise((resolve) => {
1164
+ const check = () => {
1165
+ if (this.activityState === ActivityState.Active) {
1166
+ resolve(true);
1167
+ }
1168
+ else {
1169
+ setTimeout(check, 25);
1170
+ }
1171
+ };
1172
+ check();
1173
+ });
1174
+ }
992
1175
  /**
993
1176
  * basically we ask other tabs during constructor
994
1177
  * and here we just apply 10ms delay just in case
995
1178
  * */
996
- start(...args) {
1179
+ async start(...args) {
997
1180
  if (this.activityState === ActivityState.Active ||
998
1181
  this.activityState === ActivityState.Starting) {
999
1182
  const reason = 'OpenReplay: trying to call `start()` on the instance that has been started already.';
1000
1183
  return Promise.resolve(UnsuccessfulStart(reason));
1001
1184
  }
1002
1185
  if (!document.hidden) {
1003
- return new Promise((resolve) => {
1004
- setTimeout(() => {
1005
- resolve(this._start(...args));
1006
- }, 25);
1007
- });
1186
+ await this.waitStart();
1187
+ return this._start(...args);
1008
1188
  }
1009
1189
  else {
1010
1190
  return new Promise((resolve) => {
1011
- const onVisibilityChange = () => {
1191
+ const onVisibilityChange = async () => {
1012
1192
  if (!document.hidden) {
1193
+ await this.waitStart();
1194
+ // eslint-disable-next-line
1013
1195
  document.removeEventListener('visibilitychange', onVisibilityChange);
1014
- setTimeout(() => {
1015
- resolve(this._start(...args));
1016
- }, 25);
1196
+ resolve(this._start(...args));
1017
1197
  }
1018
1198
  };
1199
+ // eslint-disable-next-line
1019
1200
  document.addEventListener('visibilitychange', onVisibilityChange);
1020
1201
  });
1021
1202
  }
@@ -1044,7 +1225,7 @@ class App {
1044
1225
  msgType.length > 255) {
1045
1226
  return;
1046
1227
  }
1047
- this.send((0, messages_gen_js_2.WSChannel)('websocket', channel, data, this.timestamp(), dir, msgType));
1228
+ this.send((0, messages_gen_js_1.WSChannel)('websocket', channel, data, this.timestamp(), dir, msgType));
1048
1229
  };
1049
1230
  }
1050
1231
  stop(stopWorker = true) {