@openreplay/tracker 11.0.6 → 12.0.0

package/lib/app/index.js

@@ -1,4 +1,7 @@
-import { Timestamp, Metadata, UserID, TabChange, TabData } from './messages.gen.js';
+import ConditionsManager from '../modules/conditionsManager.js';
+import FeatureFlags from '../modules/featureFlags.js';
+import { TagTrigger } from './messages.gen.js';
+import { Timestamp, Metadata, UserID, TabChange, TabData, WSChannel, } from './messages.gen.js';
 import { now, adjustTimeOrigin, deprecationWarn, inIframe, createEventListener, deleteEventListener, requestIdleCb, } from '../utils.js';
 import Nodes from './nodes.js';
 import Observer from './observer/top_observer.js';
@@ -11,8 +14,10 @@ import { deviceMemory, jsHeapSizeLimit } from '../modules/performance.js';
 import AttributeSender from '../modules/attributeSender.js';
 import CanvasRecorder from './canvas.js';
 import UserTestManager from '../modules/userTesting/index.js';
+import TagWatcher from '../modules/tagWatcher.js';
 const CANCELED = 'canceled';
 const uxtStorageKey = 'or_uxt_active';
+const bufferStorageKey = 'or_buffer_1';
 const START_ERROR = ':(';
 const UnsuccessfulStart = (reason) => ({ reason, success: false });
 const SuccessfulStart = (body) => (Object.assign(Object.assign({}, body), { success: true }));
@@ -21,6 +26,7 @@ var ActivityState;
     ActivityState[ActivityState["NotActive"] = 0] = "NotActive";
     ActivityState[ActivityState["Starting"] = 1] = "Starting";
     ActivityState[ActivityState["Active"] = 2] = "Active";
+    ActivityState[ActivityState["ColdStart"] = 3] = "ColdStart";
 })(ActivityState || (ActivityState = {}));
 // TODO: use backendHost only
 export const DEFAULT_INGEST_POINT = 'https://api.openreplay.com/ingest';
@@ -32,28 +38,58 @@ function getTimezone() {
     return `UTC${sign}${String(hours).padStart(2, '0')}:${String(minutes).padStart(2, '0')}`;
 }
 export default class App {
-    constructor(projectKey, sessionToken, options) {
+    constructor(projectKey, sessionToken, options, signalError) {
         var _a, _b;
+        this.signalError = signalError;
         this.messages = [];
+        /**
+         * we need 2 buffers, so we don't lose anything
+         * @read coldStart implementation
+         * */
+        this.bufferedMessages1 = [];
+        this.bufferedMessages2 = [];
         this.startCallbacks = [];
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '11.0.6'; // TODO: version compatability check inside each plugin.
+        this.version = '12.0.0'; // TODO: version compatability check inside each plugin.
         this.compressionThreshold = 24 * 1000;
         this.restartAttempts = 0;
         this.bc = null;
         this.canvasRecorder = null;
+        this.conditionsManager = null;
         this._usingOldFetchPlugin = false;
+        this.coldStartCommitN = 0;
         this.delay = 0;
+        this.coldInterval = null;
+        this.orderNumber = 0;
+        this.coldStartTs = 0;
+        this.singleBuffer = false;
+        this.onSessionSent = () => {
+            return;
+        };
         this.restartCanvasTracking = () => {
             var _a;
             (_a = this.canvasRecorder) === null || _a === void 0 ? void 0 : _a.restartTracking();
         };
+        this.flushBuffer = async (buffer) => {
+            return new Promise((res) => {
+                let ended = false;
+                const messagesBatch = [buffer.shift()];
+                while (!ended) {
+                    const nextMsg = buffer[0];
+                    if (!nextMsg || nextMsg[0] === 0 /* MType.Timestamp */) {
+                        ended = true;
+                    }
+                    else {
+                        messagesBatch.push(buffer.shift());
+                    }
+                }
+                this.postToWorker(messagesBatch);
+                res(null);
+            });
+        };
         this.onUxtCb = [];
-        // if (options.onStart !== undefined) {
-        //   deprecationWarn("'onStart' option", "tracker.start().then(/* handle session info */)")
-        // } ?? maybe onStart is good
         this.contextId = Math.random().toString(36).slice(2);
         this.projectKey = projectKey;
         this.networkOptions = options.network;
@@ -67,9 +103,9 @@ export default class App {
             local_uuid_key: '__openreplay_uuid',
             ingestPoint: DEFAULT_INGEST_POINT,
             resourceBaseHref: null,
-            verbose: false,
             __is_snippet: false,
             __debug_report_edp: null,
+            __debug__: LogLevel.Silent,
             __save_canvas_locally: false,
             localStorage: null,
             sessionStorage: null,
@@ -90,9 +126,12 @@ export default class App {
         this.ticker = new Ticker(this);
         this.ticker.attach(() => this.commit());
         this.debug = new Logger(this.options.__debug__);
-        this.notify = new Logger(this.options.verbose ? LogLevel.Warnings : LogLevel.Silent);
         this.session = new Session(this, this.options);
         this.attributeSender = new AttributeSender(this, Boolean(this.options.disableStringDict));
+        this.featureFlags = new FeatureFlags(this);
+        this.tagWatcher = new TagWatcher(this.sessionStorage, this.debug.error, (tag) => {
+            this.send(TagTrigger(tag));
+        });
         this.session.attachUpdateCallback(({ userID, metadata }) => {
             if (userID != null) {
                 // TODO: nullable userID
@@ -107,7 +146,7 @@ export default class App {
             this.session.applySessionHash(sessionToken);
         }
         try {
-            this.worker = new Worker(URL.createObjectURL(new Blob(['"use strict";class t{constructor(t,s,i,e=10,n=1e3,h){this.onUnauthorised=s,this.onFailure=i,this.MAX_ATTEMPTS_COUNT=e,this.ATTEMPT_TIMEOUT=n,this.onCompress=h,this.attemptsCount=0,this.busy=!1,this.queue=[],this.token=null,this.ingestURL=t+"/v1/web/i",this.isCompressing=void 0!==h}authorise(t){this.token=t,this.busy||this.sendNext()}push(t){this.busy||!this.token?this.queue.push(t):(this.busy=!0,this.isCompressing&&this.onCompress?this.onCompress(t):this.sendBatch(t))}sendNext(){const t=this.queue.shift();t?(this.busy=!0,this.isCompressing&&this.onCompress?this.onCompress(t):this.sendBatch(t)):this.busy=!1}retry(t,s){this.attemptsCount>=this.MAX_ATTEMPTS_COUNT?this.onFailure(`Failed to send batch after ${this.attemptsCount} attempts.`):(this.attemptsCount++,setTimeout((()=>this.sendBatch(t,s)),this.ATTEMPT_TIMEOUT*this.attemptsCount))}sendBatch(t,s){this.busy=!0;const i={Authorization:`Bearer ${this.token}`};s&&(i["Content-Encoding"]="gzip"),null!==this.token?fetch(this.ingestURL,{body:t,method:"POST",headers:i,keepalive:t.length<65536}).then((i=>{if(401===i.status)return this.busy=!1,void this.onUnauthorised();i.status>=400?this.retry(t,s):(this.attemptsCount=0,this.sendNext())})).catch((i=>{console.warn("OpenReplay:",i),this.retry(t,s)})):setTimeout((()=>{this.sendBatch(t,s)}),500)}sendCompressed(t){this.sendBatch(t,!0)}sendUncompressed(t){this.sendBatch(t,!1)}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: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 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])}}}class n{constructor(t,s,i,n,h){this.pageNo=t,this.timestamp=s,this.url=i,this.onBatch=n,this.tabId=h,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){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(){u=h.Stopping,null!==d&&(clearInterval(d),d=null),a&&(a.clean(),a=null),r&&(r.clean(),setTimeout((()=>{r=null}),20)),setTimeout((()=>{u=h.NotActive}),100)}function p(){u!==h.Stopped&&(postMessage("restart"),c())}let f,d=null;self.onmessage=({data:s})=>{if(null!=s){if("stop"===s)return o(),c(),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();r.sendCompressed(s.batch)}if("uncompressed"===s.type){if(!r)return console.debug("OR WebWorker: sender not initialised. Uncompressed batch."),void p();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])})),a=new n(s.pageNo,s.timestamp,s.url,(t=>r&&r.push(t)),s.tabId),null===d&&(d=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(null!==a){const t=a;s.forEach((s=>{55===s[0]&&(s[1]?f=setTimeout((()=>p()),18e5):clearTimeout(f)),t.writeMessage(s)}))}a||(postMessage("not_init"),p())}else o()}else o()};'], { type: 'text/javascript' })));
+            this.worker = new Worker(URL.createObjectURL(new Blob(['"use strict";class t{constructor(t,s,i,e=10,n=1e3,h){this.onUnauthorised=s,this.onFailure=i,this.MAX_ATTEMPTS_COUNT=e,this.ATTEMPT_TIMEOUT=n,this.onCompress=h,this.attemptsCount=0,this.busy=!1,this.queue=[],this.token=null,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){this.busy||!this.token?this.queue.push(t):(this.busy=!0,this.isCompressing&&this.onCompress?this.onCompress(t):this.sendBatch(t))}sendNext(){const t=this.queue.shift();t?(this.busy=!0,this.isCompressing&&this.onCompress?this.onCompress(t):this.sendBatch(t)):this.busy=!1}retry(t,s){this.attemptsCount>=this.MAX_ATTEMPTS_COUNT?this.onFailure(`Failed to send batch after ${this.attemptsCount} attempts.`):(this.attemptsCount++,setTimeout((()=>this.sendBatch(t,s)),this.ATTEMPT_TIMEOUT*this.attemptsCount))}sendBatch(t,s){this.busy=!0;const i={Authorization:`Bearer ${this.token}`};s&&(i["Content-Encoding"]="gzip"),null!==this.token?fetch(this.ingestURL,{body:t,method:"POST",headers:i,keepalive:t.length<65536}).then((i=>{if(401===i.status)return this.busy=!1,void this.onUnauthorised();i.status>=400?this.retry(t,s):(this.attemptsCount=0,this.sendNext())})).catch((i=>{console.warn("OpenReplay:",i),this.retry(t,s)})):setTimeout((()=>{this.sendBatch(t,s)}),500)}sendCompressed(t){this.sendBatch(t,!0)}sendUncompressed(t){this.sendBatch(t,!1)}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])}}}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,u=null,a=h.NotActive;function o(){u&&u.finaliseBatch()}function c(){a=h.Stopping,null!==g&&(clearInterval(g),g=null),u&&(u.clean(),u=null),r&&(r.clean(),setTimeout((()=>{r=null}),20)),setTimeout((()=>{a=h.NotActive}),100)}function p(){a!==h.Stopped&&(postMessage("restart"),c())}let f,g=null;self.onmessage=({data:s})=>{if(null!=s){if("stop"===s)return o(),c(),a=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?(a=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])})),u=new n(s.pageNo,s.timestamp,s.url,(t=>{r&&r.push(t)}),s.tabId,(()=>postMessage({type:"queue_empty"}))),null===g&&(g=setInterval(o,1e4)),a=h.Active):"auth"===s.type?r?u?(r.authorise(s.token),void(s.beaconSizeLimit&&u.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(u){const t=u;s.forEach((s=>{55===s[0]&&(s[1]?f=setTimeout((()=>p()),18e5):clearTimeout(f)),t.writeMessage(s)}))}else postMessage("not_init"),p()}else o()}else o()};'], { type: 'text/javascript' })));
             this.worker.onerror = (e) => {
                 this._debug('webworker_error', e);
             };
@@ -139,14 +178,18 @@ export default class App {
                                     void this.start({}, true);
                                 }
                             }
-                            // @ts-ignore
-                            (_a = this.worker) === null || _a === void 0 ? void 0 : _a.postMessage({ type: 'compressed', batch: result });
+                            else {
+                                (_a = this.worker) === null || _a === void 0 ? void 0 : _a.postMessage({ type: 'compressed', batch: result });
+                            }
                         });
                     }
                     else {
                         (_a = this.worker) === null || _a === void 0 ? void 0 : _a.postMessage({ type: 'uncompressed', batch: batch });
                     }
                 }
+                else if (data.type === 'queue_empty') {
+                    this.onSessionSent();
+                }
             };
             const alertWorker = () => {
                 if (this.worker) {
@@ -221,6 +264,7 @@ export default class App {
         this.debug.error('OpenReplay error: ', context, e);
     }
     send(message, urgent = false) {
+        var _a;
         if (this.activityState === ActivityState.NotActive) {
             return;
         }
@@ -234,17 +278,30 @@ export default class App {
             return;
         }
         // ====================================================
-        this.messages.push(message);
+        if (this.activityState === ActivityState.ColdStart) {
+            this.bufferedMessages1.push(message);
+            if (!this.singleBuffer) {
+                this.bufferedMessages2.push(message);
+            }
+            (_a = this.conditionsManager) === null || _a === void 0 ? void 0 : _a.processMessage(message);
+        }
+        else {
+            this.messages.push(message);
+        }
         // TODO: commit on start if there were `urgent` sends;
         // Clarify where urgent can be used for;
         // Clarify workflow for each type of message in case it was sent before start
         //      (like Fetch before start; maybe add an option "preCapture: boolean" or sth alike)
-        // Careful: `this.delay` is equal to zero before start hense all Timestamp-s will have to be updated on start
+        // Careful: `this.delay` is equal to zero before start so all Timestamp-s will have to be updated on start
         if (this.activityState === ActivityState.Active && urgent) {
             this.commit();
         }
     }
-    commit() {
+    /**
+     * Normal workflow: add timestamp and tab data to batch, then commit it
+     * every ~30ms
+     * */
+    _nCommit() {
         if (this.worker !== undefined && this.messages.length) {
             requestIdleCb(() => {
                 var _a;
@@ -257,6 +314,36 @@ export default class App {
             });
         }
     }
+    /**
+     * Cold start: add timestamp and tab data to both batches
+     * every 2nd tick, ~60ms
+     * this will make batches a bit larger and replay will work with bigger jumps every frame
+     * but in turn we don't overload batch writer on session start with 1000 batches
+     * */
+    _cStartCommit() {
+        this.coldStartCommitN += 1;
+        if (this.coldStartCommitN === 2) {
+            this.bufferedMessages1.push(Timestamp(this.timestamp()));
+            this.bufferedMessages1.push(TabData(this.session.getTabId()));
+            this.bufferedMessages2.push(Timestamp(this.timestamp()));
+            this.bufferedMessages2.push(TabData(this.session.getTabId()));
+            this.coldStartCommitN = 0;
+        }
+    }
+    commit() {
+        if (this.activityState === ActivityState.ColdStart) {
+            this._cStartCommit();
+        }
+        else {
+            this._nCommit();
+        }
+    }
+    postToWorker(messages) {
+        var _a;
+        (_a = this.worker) === null || _a === void 0 ? void 0 : _a.postMessage(messages);
+        this.commitCallbacks.forEach((cb) => cb(messages));
+        messages.length = 0;
+    }
     timestamp() {
         return now() + this.delay;
     }
@@ -390,15 +477,228 @@ export default class App {
             this.sessionStorage.removeItem(this.options.session_reset_key);
         }
     }
-    _start(startOpts = {}, resetByWorker = false) {
+    checkSessionToken(forceNew) {
+        const lsReset = this.sessionStorage.getItem(this.options.session_reset_key) !== null;
+        const needNewSessionID = forceNew || lsReset;
+        const sessionToken = this.session.getSessionToken();
+        return needNewSessionID || !sessionToken;
+    }
+    /**
+     * start buffering messages without starting the actual session, which gives
+     * user 30 seconds to "activate" and record session by calling `start()` on conditional trigger
+     * and we will then send buffered batch, so it won't get lost
+     * */
+    async coldStart(startOpts = {}, conditional) {
+        var _a, _b;
+        this.singleBuffer = false;
+        const second = 1000;
+        if (conditional) {
+            this.conditionsManager = new ConditionsManager(this, startOpts);
+        }
+        const isNewSession = this.checkSessionToken(startOpts.forceNew);
+        if (conditional) {
+            const r = await fetch(this.options.ingestPoint + '/v1/web/start', {
+                method: 'POST',
+                headers: {
+                    'Content-Type': 'application/json',
+                },
+                body: JSON.stringify(Object.assign(Object.assign({}, this.getTrackerInfo()), { timestamp: now(), doNotRecord: true, bufferDiff: 0, userID: this.session.getInfo().userID, token: undefined, deviceMemory,
+                    jsHeapSizeLimit, timezone: getTimezone() })),
+            });
+            const { 
+            // this token is needed to fetch conditions and flags,
+            // but it can't be used to record a session
+            token, userBrowser, userCity, userCountry, userDevice, userOS, userState, projectID, } = await r.json();
+            this.session.assign({ projectID });
+            this.session.setUserInfo({
+                userBrowser,
+                userCity,
+                userCountry,
+                userDevice,
+                userOS,
+                userState,
+            });
+            const onStartInfo = { sessionToken: token, userUUID: '', sessionID: '' };
+            this.startCallbacks.forEach((cb) => cb(onStartInfo));
+            await ((_a = this.conditionsManager) === null || _a === void 0 ? void 0 : _a.fetchConditions(projectID, token));
+            await this.featureFlags.reloadFlags(token);
+            await this.tagWatcher.fetchTags(this.options.ingestPoint, token);
+            (_b = this.conditionsManager) === null || _b === void 0 ? void 0 : _b.processFlags(this.featureFlags.flags);
+        }
+        const cycle = () => {
+            this.orderNumber += 1;
+            adjustTimeOrigin();
+            this.coldStartTs = now();
+            if (this.orderNumber % 2 === 0) {
+                this.bufferedMessages1.length = 0;
+                this.bufferedMessages1.push(Timestamp(this.timestamp()));
+                this.bufferedMessages1.push(TabData(this.session.getTabId()));
+            }
+            else {
+                this.bufferedMessages2.length = 0;
+                this.bufferedMessages2.push(Timestamp(this.timestamp()));
+                this.bufferedMessages2.push(TabData(this.session.getTabId()));
+            }
+            this.stop(false);
+            this.activityState = ActivityState.ColdStart;
+            if (startOpts.sessionHash) {
+                this.session.applySessionHash(startOpts.sessionHash);
+            }
+            if (startOpts.forceNew) {
+                this.session.reset();
+            }
+            this.session.assign({
+                userID: startOpts.userID,
+                metadata: startOpts.metadata,
+            });
+            if (!isNewSession) {
+                this.debug.log('continuing session on new tab', this.session.getTabId());
+                // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+                this.send(TabChange(this.session.getTabId()));
+            }
+            this.observer.observe();
+            this.ticker.start();
+        };
+        this.coldInterval = setInterval(() => {
+            cycle();
+        }, 30 * second);
+        cycle();
+    }
+    /**
+     * Starts offline session recording
+     * @param {Object} startOpts - options for session start, same as .start()
+     * @param {Function} onSessionSent - callback that will be called once session is fully sent
+     * */
+    offlineRecording(startOpts = {}, onSessionSent) {
+        this.onSessionSent = onSessionSent;
+        this.singleBuffer = true;
+        const isNewSession = this.checkSessionToken(startOpts.forceNew);
+        adjustTimeOrigin();
+        this.coldStartTs = now();
+        const saverBuffer = this.localStorage.getItem(bufferStorageKey);
+        if (saverBuffer) {
+            const data = JSON.parse(saverBuffer);
+            this.bufferedMessages1 = Array.isArray(data) ? data : this.bufferedMessages1;
+            this.localStorage.removeItem(bufferStorageKey);
+        }
+        this.bufferedMessages1.push(Timestamp(this.timestamp()));
+        this.bufferedMessages1.push(TabData(this.session.getTabId()));
+        this.activityState = ActivityState.ColdStart;
+        if (startOpts.sessionHash) {
+            this.session.applySessionHash(startOpts.sessionHash);
+        }
+        if (startOpts.forceNew) {
+            this.session.reset();
+        }
+        this.session.assign({
+            userID: startOpts.userID,
+            metadata: startOpts.metadata,
+        });
+        const onStartInfo = { sessionToken: '', userUUID: '', sessionID: '' };
+        this.startCallbacks.forEach((cb) => cb(onStartInfo));
+        if (!isNewSession) {
+            // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
+            this.send(TabChange(this.session.getTabId()));
+        }
+        this.observer.observe();
+        this.ticker.start();
+        return {
+            saveBuffer: this.saveBuffer,
+            getBuffer: this.getBuffer,
+            setBuffer: this.setBuffer,
+        };
+    }
+    /**
+     * Saves the captured messages in localStorage (or whatever is used in its place)
+     *
+     * Then when this.offlineRecording is called, it will preload this messages and clear the storage item
+     *
+     * Keeping the size of local storage reasonable is up to the end users of this library
+     * */
+    saveBuffer() {
+        this.localStorage.setItem(bufferStorageKey, JSON.stringify(this.bufferedMessages1));
+    }
+    /**
+     * @returns buffer with stored messages for offline recording
+     * */
+    getBuffer() {
+        return this.bufferedMessages1;
+    }
+    /**
+     * Used to set a buffer with messages array
+     * */
+    setBuffer(buffer) {
+        this.bufferedMessages1 = buffer;
+    }
+    /**
+     * Uploads the stored session buffer to backend
+     * @returns promise that resolves once messages are loaded, it has to be awaited
+     * so the session can be uploaded properly
+     * @resolve - if messages were loaded in service worker successfully
+     * @reject {string} - error message
+     * */
+    async uploadOfflineRecording() {
+        var _a, _b;
+        this.stop(false);
+        const timestamp = now();
+        (_a = this.worker) === null || _a === void 0 ? void 0 : _a.postMessage({
+            type: 'start',
+            pageNo: this.session.incPageNo(),
+            ingestPoint: this.options.ingestPoint,
+            timestamp: this.coldStartTs,
+            url: document.URL,
+            connAttemptCount: this.options.connAttemptCount,
+            connAttemptGap: this.options.connAttemptGap,
+            tabId: this.session.getTabId(),
+        });
+        const r = await fetch(this.options.ingestPoint + '/v1/web/start', {
+            method: 'POST',
+            headers: {
+                'Content-Type': 'application/json',
+            },
+            body: JSON.stringify(Object.assign(Object.assign({}, this.getTrackerInfo()), { timestamp: timestamp, doNotRecord: false, bufferDiff: timestamp - this.coldStartTs, userID: this.session.getInfo().userID, token: undefined, deviceMemory,
+                jsHeapSizeLimit, timezone: getTimezone() })),
+        });
+        const { token, userBrowser, userCity, userCountry, userDevice, userOS, userState, beaconSizeLimit, projectID, } = await r.json();
+        (_b = this.worker) === null || _b === void 0 ? void 0 : _b.postMessage({
+            type: 'auth',
+            token,
+            beaconSizeLimit,
+        });
+        this.session.assign({ projectID });
+        this.session.setUserInfo({
+            userBrowser,
+            userCity,
+            userCountry,
+            userDevice,
+            userOS,
+            userState,
+        });
+        while (this.bufferedMessages1.length > 0) {
+            await this.flushBuffer(this.bufferedMessages1);
+        }
+        this.postToWorker([['q_end']]);
+        this.clearBuffers();
+    }
+    _start(startOpts = {}, resetByWorker = false, conditionName) {
+        const isColdStart = this.activityState === ActivityState.ColdStart;
+        if (isColdStart && this.coldInterval) {
+            clearInterval(this.coldInterval);
+        }
         if (!this.worker) {
-            return Promise.resolve(UnsuccessfulStart('No worker found: perhaps, CSP is not set.'));
+            const reason = 'No worker found: perhaps, CSP is not set.';
+            this.signalError(reason, []);
+            return Promise.resolve(UnsuccessfulStart(reason));
         }
-        if (this.activityState !== ActivityState.NotActive) {
-            return Promise.resolve(UnsuccessfulStart('OpenReplay: trying to call `start()` on the instance that has been started already.'));
+        if (this.activityState === ActivityState.Active ||
+            this.activityState === ActivityState.Starting) {
+            const reason = 'OpenReplay: trying to call `start()` on the instance that has been started already.';
+            return Promise.resolve(UnsuccessfulStart(reason));
         }
         this.activityState = ActivityState.Starting;
-        adjustTimeOrigin();
+        if (!isColdStart) {
+            adjustTimeOrigin();
+        }
         if (startOpts.sessionHash) {
             this.session.applySessionHash(startOpts.sessionHash);
         }
@@ -416,26 +716,24 @@ export default class App {
             type: 'start',
             pageNo: this.session.incPageNo(),
             ingestPoint: this.options.ingestPoint,
-            timestamp,
+            timestamp: isColdStart ? this.coldStartTs : timestamp,
             url: document.URL,
             connAttemptCount: this.options.connAttemptCount,
             connAttemptGap: this.options.connAttemptGap,
             tabId: this.session.getTabId(),
         });
-        const lsReset = this.sessionStorage.getItem(this.options.session_reset_key) !== null;
-        this.sessionStorage.removeItem(this.options.session_reset_key);
-        const needNewSessionID = startOpts.forceNew || lsReset || resetByWorker;
         const sessionToken = this.session.getSessionToken();
-        const isNewSession = needNewSessionID || !sessionToken;
-        this.debug.log('OpenReplay: starting session; need new session id?', needNewSessionID, 'session token: ', sessionToken);
+        const isNewSession = this.checkSessionToken(startOpts.forceNew);
+        this.sessionStorage.removeItem(this.options.session_reset_key);
+        this.debug.log('OpenReplay: starting session; need new session id?', isNewSession, 'session token: ', sessionToken);
         return window
             .fetch(this.options.ingestPoint + '/v1/web/start', {
             method: 'POST',
             headers: {
                 'Content-Type': 'application/json',
             },
-            body: JSON.stringify(Object.assign(Object.assign({}, this.getTrackerInfo()), { timestamp, userID: this.session.getInfo().userID, token: isNewSession ? undefined : sessionToken, deviceMemory,
-                jsHeapSizeLimit, timezone: getTimezone() })),
+            body: JSON.stringify(Object.assign(Object.assign({}, this.getTrackerInfo()), { timestamp, doNotRecord: false, bufferDiff: timestamp - this.coldStartTs, userID: this.session.getInfo().userID, token: isNewSession ? undefined : sessionToken, deviceMemory,
+                jsHeapSizeLimit, timezone: getTimezone(), condition: conditionName })),
         })
             .then((r) => {
             if (r.status === 200) {
@@ -449,13 +747,17 @@ export default class App {
                     : Promise.reject(`Server error: ${r.status}. ${text}`));
             }
         })
-            .then((r) => {
+            .then(async (r) => {
             var _a;
             if (!this.worker) {
-                return Promise.reject('no worker found after start request (this might not happen)');
+                const reason = 'no worker found after start request (this might not happen)';
+                this.signalError(reason, []);
+                return Promise.reject(reason);
             }
             if (this.activityState === ActivityState.NotActive) {
-                return Promise.reject('Tracker stopped during authorization');
+                const reason = 'Tracker stopped during authorization';
+                this.signalError(reason, []);
+                return Promise.reject(reason);
             }
             const { token, userUUID, projectID, beaconSizeLimit, compressionThreshold, // how big the batch should be before we decide to compress it
             delay, //  derived from token
@@ -468,7 +770,9 @@ export default class App {
                 typeof sessionID !== 'string' ||
                 typeof delay !== 'number' ||
                 (typeof beaconSizeLimit !== 'number' && typeof beaconSizeLimit !== 'undefined')) {
-                return Promise.reject(`Incorrect server response: ${JSON.stringify(r)}`);
+                const reason = `Incorrect server response: ${JSON.stringify(r)}`;
+                this.signalError(reason, []);
+                return Promise.reject(reason);
             }
             this.delay = delay;
             this.session.setSessionToken(token);
@@ -485,6 +789,11 @@ export default class App {
                 timestamp: startTimestamp || timestamp,
                 projectID,
             });
+            this.worker.postMessage({
+                type: 'auth',
+                token,
+                beaconSizeLimit,
+            });
             if (!isNewSession && token === sessionToken) {
                 this.debug.log('continuing session on new tab', this.session.getTabId());
                 // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
@@ -493,13 +802,14 @@ export default class App {
             // (Re)send Metadata for the case of a new session
             Object.entries(this.session.getInfo().metadata).forEach(([key, value]) => this.send(Metadata(key, value)));
             this.localStorage.setItem(this.options.local_uuid_key, userUUID);
-            this.worker.postMessage({
-                type: 'auth',
-                token,
-                beaconSizeLimit,
-            });
             this.compressionThreshold = compressionThreshold;
             const onStartInfo = { sessionToken: token, userUUID, sessionID };
+            // TODO: start as early as possible (before receiving the token)
+            /** after start */
+            this.startCallbacks.forEach((cb) => cb(onStartInfo)); // MBTODO: callbacks after DOM "mounted" (observed)
+            void this.featureFlags.reloadFlags();
+            await this.tagWatcher.fetchTags(this.options.ingestPoint, token);
+            this.activityState = ActivityState.Active;
             if (canvasEnabled) {
                 this.canvasRecorder =
                     (_a = this.canvasRecorder) !== null && _a !== void 0 ? _a : new CanvasRecorder(this, {
@@ -509,12 +819,22 @@ export default class App {
                     });
                 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();
-            this.activityState = ActivityState.Active;
-            this.notify.log('OpenReplay tracking started.');
+            /** --------------- COLD START BUFFER ------------------*/
+            if (isColdStart) {
+                const biggestBuffer = this.bufferedMessages1.length > this.bufferedMessages2.length
+                    ? this.bufferedMessages1
+                    : this.bufferedMessages2;
+                while (biggestBuffer.length > 0) {
+                    await this.flushBuffer(biggestBuffer);
+                }
+                this.clearBuffers();
+                this.commit();
+                /** --------------- COLD START BUFFER ------------------*/
+            }
+            else {
+                this.observer.observe();
+                this.ticker.start();
+            }
             // get rid of onStart ?
             if (typeof this.options.onStart === 'function') {
                 this.options.onStart(onStartInfo);
@@ -555,10 +875,11 @@ export default class App {
             this.stop();
             this.session.reset();
             if (reason === CANCELED) {
+                this.signalError(CANCELED, []);
                 return UnsuccessfulStart(CANCELED);
             }
-            this.notify.log('OpenReplay was unable to start. ', reason);
             this._debug('session_start', reason);
+            this.signalError(START_ERROR, []);
             return UnsuccessfulStart(START_ERROR);
         });
     }
@@ -603,6 +924,27 @@ export default class App {
     getTabId() {
         return this.session.getTabId();
     }
+    clearBuffers() {
+        this.bufferedMessages1.length = 0;
+        this.bufferedMessages2.length = 0;
+    }
+    /**
+     * Creates a named hook that expects event name, data string and msg direction (up/down),
+     * it will skip any message bigger than 5 mb or event name bigger than 255 symbols
+     * @returns {(msgType: string, data: string, dir: "up" | "down") => void}
+     * */
+    trackWs(channelName) {
+        const channel = channelName;
+        return (msgType, data, dir = 'down') => {
+            if (typeof msgType !== 'string' ||
+                typeof data !== 'string' ||
+                data.length > 5 * 1024 * 1024 ||
+                msgType.length > 255) {
+                return;
+            }
+            this.send(WSChannel('websocket', channel, data, this.timestamp(), dir, msgType));
+        };
+    }
     stop(stopWorker = true) {
         var _a;
         if (this.activityState !== ActivityState.NotActive) {
@@ -613,7 +955,8 @@ export default class App {
                 this.nodes.clear();
                 this.ticker.stop();
                 this.stopCallbacks.forEach((cb) => cb());
-                this.notify.log('OpenReplay tracking stopped.');
+                this.debug.log('OpenReplay tracking stopped.');
+                this.tagWatcher.clear();
                 if (this.worker && stopWorker) {
                     this.worker.postMessage('stop');
                 }