@openreplay/tracker 16.4.9 → 16.4.10

package/dist/lib/index.js

@@ -56,12 +56,12 @@ fl[28] = 258, revfl[258] = 28;
 var _b = freb(fdeb, 0), revfd = _b.r;
 // map of value to reverse (assuming 16 bits)
 var rev = new u16(32768);
-for (var i = 0; i < 32768; ++i) {
+for (var i$1 = 0; i$1 < 32768; ++i$1) {
     // reverse table algorithm from SO
-    var x$1 = ((i & 0xAAAA) >> 1) | ((i & 0x5555) << 1);
+    var x$1 = ((i$1 & 0xAAAA) >> 1) | ((i$1 & 0x5555) << 1);
     x$1 = ((x$1 & 0xCCCC) >> 2) | ((x$1 & 0x3333) << 2);
     x$1 = ((x$1 & 0xF0F0) >> 4) | ((x$1 & 0x0F0F) << 4);
-    rev[i] = (((x$1 & 0xFF00) >> 8) | ((x$1 & 0x00FF) << 8)) >> 1;
+    rev[i$1] = (((x$1 & 0xFF00) >> 8) | ((x$1 & 0x00FF) << 8)) >> 1;
 }
 // create huffman tree from u8 "map": index -> code length for code index
 // mb (max bits) must be at most 15
@@ -117,18 +117,18 @@ var hMap = (function (cd, mb, r) {
 });
 // fixed length tree
 var flt = new u8(288);
-for (var i = 0; i < 144; ++i)
-    flt[i] = 8;
-for (var i = 144; i < 256; ++i)
-    flt[i] = 9;
-for (var i = 256; i < 280; ++i)
-    flt[i] = 7;
-for (var i = 280; i < 288; ++i)
-    flt[i] = 8;
+for (var i$1 = 0; i$1 < 144; ++i$1)
+    flt[i$1] = 8;
+for (var i$1 = 144; i$1 < 256; ++i$1)
+    flt[i$1] = 9;
+for (var i$1 = 256; i$1 < 280; ++i$1)
+    flt[i$1] = 7;
+for (var i$1 = 280; i$1 < 288; ++i$1)
+    flt[i$1] = 8;
 // fixed distance tree
 var fdt = new u8(32);
-for (var i = 0; i < 32; ++i)
-    fdt[i] = 5;
+for (var i$1 = 0; i$1 < 32; ++i$1)
+    fdt[i$1] = 5;
 // fixed length map
 var flm = /*#__PURE__*/ hMap(flt, 9, 0);
 // fixed distance map
@@ -3645,6 +3645,27 @@ class Maintainer {
     }
 }
 
+// 4 levels, 128 frames between each level, 8_388_608 nodes per page
+// lets hope no one will need more :D
+const BITS_LEVEL = 2; // 4
+const BITS_ORDER = 7; // 128
+const BITS_NODE = 22; // 8_388_608
+const SHIFT_ORDER = BITS_NODE;
+const SHIFT_LEVEL = BITS_NODE + BITS_ORDER;
+const MASK_NODE = (1 << BITS_NODE) - 1;
+const MASK_ORDER = (1 << BITS_ORDER) - 1;
+const MASK_LEVEL = (1 << BITS_LEVEL) - 1;
+function pack(level, order, nodeId) {
+    if (level < 0 || level > MASK_LEVEL)
+        throw new RangeError('OR: nesting level overflow, max 4');
+    if (order < 0 || order > MASK_ORDER)
+        throw new RangeError('OR: frame order overflow, max 128');
+    const v = ((level & MASK_LEVEL) << SHIFT_LEVEL) |
+        ((order & MASK_ORDER) << SHIFT_ORDER) |
+        (nodeId & MASK_NODE);
+    return v >>> 0;
+}
+
 class Nodes {
     constructor(params) {
         this.nodes = new Map();
@@ -3672,6 +3693,9 @@ class Nodes {
             }
             listeners.push([type, listener, useCapture]);
         };
+        this.createFrameId = (level, frameOrder) => {
+            return pack(level, frameOrder, 0);
+        };
         this.unregisterNode = (node) => {
             const id = node[this.node_id];
             if (id !== undefined) {
@@ -3692,16 +3716,8 @@ class Nodes {
         this.maintainer = new Maintainer(this.nodes, this.unregisterNode, params.maintainer);
         this.maintainer.start();
     }
-    syntheticMode(frameOrder) {
-        const maxSafeNumber = Number.MAX_SAFE_INTEGER;
-        const placeholderSize = 99999999;
-        const nextFrameId = placeholderSize * frameOrder;
-        // I highly doubt that this will ever happen,
-        // but it will be easier to debug if it does
-        if (nextFrameId > maxSafeNumber) {
-            throw new Error('Placeholder id overflow');
-        }
-        this.nextNodeId = nextFrameId;
+    crossdomainMode(level, frameOrder) {
+        this.nextNodeId = this.createFrameId(level, frameOrder);
     }
     registerNode(node) {
         let id = node[this.node_id];
@@ -4909,7 +4925,7 @@ class TopObserver extends Observer {
             this.app.nodes.callNodeCallbacks(document, true);
         }, window.document.documentElement);
     }
-    crossdomainObserve(rootNodeId, frameOder) {
+    crossdomainObserve(rootNodeId, frameOder, frameLevel) {
         const observer = this;
         Element.prototype.attachShadow = function () {
             // eslint-disable-next-line
@@ -4918,7 +4934,7 @@ class TopObserver extends Observer {
             return shadow;
         };
         this.app.nodes.clear();
-        this.app.nodes.syntheticMode(frameOder);
+        this.app.nodes.crossdomainMode(frameLevel, frameOder);
         const iframeObserver = new IFrameObserver(this.app);
         this.iframeObservers.set(window.document, iframeObserver);
         iframeObserver.syntheticObserve(rootNodeId, window.document);
@@ -5272,7 +5288,7 @@ class App {
         this.stopCallbacks = [];
         this.commitCallbacks = [];
         this.activityState = ActivityState.NotActive;
-        this.version = '16.4.9'; // TODO: version compatability check inside each plugin.
+        this.version = '16.4.10'; // TODO: version compatability check inside each plugin.
         this.socketMode = false;
         this.compressionThreshold = 24 * 1000;
         this.bc = null;
@@ -5282,10 +5298,8 @@ class App {
         this.rootId = null;
         this.pageFrames = [];
         this.frameOderNumber = 0;
-        this.features = {
-            'feature-flags': true,
-            'usability-test': true,
-        };
+        this.frameLevel = 0;
+        this.features = {};
         this.emptyBatchCounter = 0;
         /** used by child iframes for crossdomain only */
         this.parentActive = false;
@@ -5315,6 +5329,7 @@ class App {
                 this.rootId = data.id;
                 this.session.setSessionToken(data.token, this.projectKey);
                 this.frameOderNumber = data.frameOrderNumber;
+                this.frameLevel = data.frameLevel;
                 this.debug.log('starting iframe tracking', data);
                 this.allowAppStart();
             }
@@ -5364,8 +5379,8 @@ class App {
                             line: proto.iframeId,
                             id,
                             token,
-                            // since indexes go from 0 we +1
                             frameOrderNumber: order,
+                            frameLevel: this.frameLevel + 1,
                         };
                         this.debug.log('Got child frame signal; nodeId', id, event.source, iframeData);
                         // @ts-ignore
@@ -5852,6 +5867,7 @@ class App {
              * listen for messages from parent window, so we can signal that we're alive
              * */
             window.addEventListener('message', this.parentCrossDomainFrameListener);
+            window.addEventListener('message', this.crossDomainIframeListener);
             setInterval(() => {
                 if (document.hidden) {
                     return;
@@ -6445,7 +6461,7 @@ class App {
             }
             await this.tagWatcher.fetchTags(this.options.ingestPoint, token);
             this.activityState = ActivityState.Active;
-            if (this.options.crossdomain?.enabled && !this.insideIframe) {
+            if (this.options.crossdomain?.enabled) {
                 void this.bootChildrenFrames();
             }
             if (canvasEnabled && !this.options.canvas.disableCanvas) {
@@ -6473,7 +6489,7 @@ class App {
             }
             else {
                 if (this.insideIframe && this.rootId) {
-                    this.observer.crossdomainObserve(this.rootId, this.frameOderNumber);
+                    this.observer.crossdomainObserve(this.rootId, this.frameOderNumber, this.frameLevel);
                 }
                 else {
                     this.observer.observe();
@@ -6627,7 +6643,7 @@ class App {
     stop(stopWorker = true) {
         if (this.activityState !== ActivityState.NotActive) {
             try {
-                if (!this.insideIframe && this.options.crossdomain?.enabled) {
+                if (this.options.crossdomain?.enabled) {
                     this.killChildrenFrames();
                 }
                 this.attributeSender.clear();
@@ -7601,7 +7617,7 @@ function getUniqueSiblingClass(el) {
     return null;
 }
 
-var e,o=-1,a=function(e){addEventListener("pageshow",(function(n){n.persisted&&(o=n.timeStamp,e(n));}),true);},c=function(){var e=self.performance&&performance.getEntriesByType&&performance.getEntriesByType("navigation")[0];if(e&&e.responseStart>0&&e.responseStart<performance.now())return e},u=function(){var e=c();return e&&e.activationStart||0},f=function(e,n){var t=c(),r="navigate";o>=0?r="back-forward-cache":t&&(document.prerendering||u()>0?r="prerender":document.wasDiscarded?r="restore":t.type&&(r=t.type.replace(/_/g,"-")));return {name:e,value:void 0===n?-1:n,rating:"good",delta:0,entries:[],id:"v4-".concat(Date.now(),"-").concat(Math.floor(8999999999999*Math.random())+1e12),navigationType:r}},s=function(e,n,t){try{if(PerformanceObserver.supportedEntryTypes.includes(e)){var r=new PerformanceObserver((function(e){Promise.resolve().then((function(){n(e.getEntries());}));}));return r.observe(Object.assign({type:e,buffered:!0},t||{})),r}}catch(e){}},d=function(e,n,t,r){var i,o;return function(a){n.value>=0&&(a||r)&&((o=n.value-(i||0))||void 0===i)&&(i=n.value,n.delta=o,n.rating=function(e,n){return e>n[1]?"poor":e>n[0]?"needs-improvement":"good"}(n.value,t),e(n));}},l=function(e){requestAnimationFrame((function(){return requestAnimationFrame((function(){return e()}))}));},p=function(e){document.addEventListener("visibilitychange",(function(){"hidden"===document.visibilityState&&e();}));},v=function(e){var n=false;return function(){n||(e(),n=true);}},m=-1,h=function(){return "hidden"!==document.visibilityState||document.prerendering?1/0:0},g=function(e){"hidden"===document.visibilityState&&m>-1&&(m="visibilitychange"===e.type?e.timeStamp:0,T());},y=function(){addEventListener("visibilitychange",g,true),addEventListener("prerenderingchange",g,true);},T=function(){removeEventListener("visibilitychange",g,true),removeEventListener("prerenderingchange",g,true);},E=function(){return m<0&&(m=h(),y(),a((function(){setTimeout((function(){m=h(),y();}),0);}))),{get firstHiddenTime(){return m}}},C=function(e){document.prerendering?addEventListener("prerenderingchange",(function(){return e()}),true):e();},b=[1800,3e3],S=function(e,n){n=n||{},C((function(){var t,r=E(),i=f("FCP"),o=s("paint",(function(e){e.forEach((function(e){"first-contentful-paint"===e.name&&(o.disconnect(),e.startTime<r.firstHiddenTime&&(i.value=Math.max(e.startTime-u(),0),i.entries.push(e),t(true)));}));}));o&&(t=d(e,i,b,n.reportAllChanges),a((function(r){i=f("FCP"),t=d(e,i,b,n.reportAllChanges),l((function(){i.value=performance.now()-r.timeStamp,t(true);}));})));}));},L=[.1,.25],w=function(e,n){n=n||{},S(v((function(){var t,r=f("CLS",0),i=0,o=[],c=function(e){e.forEach((function(e){if(!e.hadRecentInput){var n=o[0],t=o[o.length-1];i&&e.startTime-t.startTime<1e3&&e.startTime-n.startTime<5e3?(i+=e.value,o.push(e)):(i=e.value,o=[e]);}})),i>r.value&&(r.value=i,r.entries=o,t());},u=s("layout-shift",c);u&&(t=d(e,r,L,n.reportAllChanges),p((function(){c(u.takeRecords()),t(true);})),a((function(){i=0,r=f("CLS",0),t=d(e,r,L,n.reportAllChanges),l((function(){return t()}));})),setTimeout(t,0));})));},A=0,I=1/0,P=0,M=function(e){e.forEach((function(e){e.interactionId&&(I=Math.min(I,e.interactionId),P=Math.max(P,e.interactionId),A=P?(P-I)/7+1:0);}));},k=function(){return e?A:performance.interactionCount||0},F=function(){"interactionCount"in performance||e||(e=s("event",M,{type:"event",buffered:true,durationThreshold:0}));},D=[],x=new Map,R=0,B=function(){var e=Math.min(D.length-1,Math.floor((k()-R)/50));return D[e]},H=[],q=function(e){if(H.forEach((function(n){return n(e)})),e.interactionId||"first-input"===e.entryType){var n=D[D.length-1],t=x.get(e.interactionId);if(t||D.length<10||e.duration>n.latency){if(t)e.duration>t.latency?(t.entries=[e],t.latency=e.duration):e.duration===t.latency&&e.startTime===t.entries[0].startTime&&t.entries.push(e);else {var r={id:e.interactionId,latency:e.duration,entries:[e]};x.set(r.id,r),D.push(r);}D.sort((function(e,n){return n.latency-e.latency})),D.length>10&&D.splice(10).forEach((function(e){return x.delete(e.id)}));}}},O=function(e){var n=self.requestIdleCallback||self.setTimeout,t=-1;return e=v(e),"hidden"===document.visibilityState?e():(t=n(e),p(e)),t},N=[200,500],j=function(e,n){"PerformanceEventTiming"in self&&"interactionId"in PerformanceEventTiming.prototype&&(n=n||{},C((function(){var t;F();var r,i=f("INP"),o=function(e){O((function(){e.forEach(q);var n=B();n&&n.latency!==i.value&&(i.value=n.latency,i.entries=n.entries,r());}));},c=s("event",o,{durationThreshold:null!==(t=n.durationThreshold)&&void 0!==t?t:40});r=d(e,i,N,n.reportAllChanges),c&&(c.observe({type:"first-input",buffered:true}),p((function(){o(c.takeRecords()),r(true);})),a((function(){R=k(),D.length=0,x.clear(),i=f("INP"),r=d(e,i,N,n.reportAllChanges);})));})));},_=[2500,4e3],z={},G=function(e,n){n=n||{},C((function(){var t,r=E(),i=f("LCP"),o=function(e){n.reportAllChanges||(e=e.slice(-1)),e.forEach((function(e){e.startTime<r.firstHiddenTime&&(i.value=Math.max(e.startTime-u(),0),i.entries=[e],t());}));},c=s("largest-contentful-paint",o);if(c){t=d(e,i,_,n.reportAllChanges);var m=v((function(){z[i.id]||(o(c.takeRecords()),c.disconnect(),z[i.id]=true,t(true));}));["keydown","click"].forEach((function(e){addEventListener(e,(function(){return O(m)}),{once:true,capture:true});})),p(m),a((function(r){i=f("LCP"),t=d(e,i,_,n.reportAllChanges),l((function(){i.value=performance.now()-r.timeStamp,z[i.id]=true,t(true);}));}));}}));},J=[800,1800],K=function e(n){document.prerendering?C((function(){return e(n)})):"complete"!==document.readyState?addEventListener("load",(function(){return e(n)}),true):setTimeout(n,0);},Q=function(e,n){n=n||{};var t=f("TTFB"),r=d(e,t,J,n.reportAllChanges);K((function(){var i=c();i&&(t.value=Math.max(i.responseStart-u(),0),t.entries=[i],r(true),a((function(){t=f("TTFB",0),(r=d(e,t,J,n.reportAllChanges))(true);})));}));};
+let e=-1;const t=t=>{addEventListener("pageshow",(n=>{n.persisted&&(e=n.timeStamp,t(n));}),true);},n=(e,t,n,i)=>{let s,o;return r=>{t.value>=0&&(r||i)&&(o=t.value-(s??0),(o||void 0===s)&&(s=t.value,t.delta=o,t.rating=((e,t)=>e>t[1]?"poor":e>t[0]?"needs-improvement":"good")(t.value,n),e(t)));}},i=e=>{requestAnimationFrame((()=>requestAnimationFrame((()=>e()))));},s=()=>{const e=performance.getEntriesByType("navigation")[0];if(e&&e.responseStart>0&&e.responseStart<performance.now())return e},o=()=>{const e=s();return e?.activationStart??0},r=(t,n=-1)=>{const i=s();let r="navigate";e>=0?r="back-forward-cache":i&&(document.prerendering||o()>0?r="prerender":document.wasDiscarded?r="restore":i.type&&(r=i.type.replace(/_/g,"-")));return {name:t,value:n,rating:"good",delta:0,entries:[],id:`v5-${Date.now()}-${Math.floor(8999999999999*Math.random())+1e12}`,navigationType:r}},c=new WeakMap;function a(e,t){return c.get(e)||c.set(e,new t),c.get(e)}class d{t;i=0;o=[];h(e){if(e.hadRecentInput)return;const t=this.o[0],n=this.o.at(-1);this.i&&t&&n&&e.startTime-n.startTime<1e3&&e.startTime-t.startTime<5e3?(this.i+=e.value,this.o.push(e)):(this.i=e.value,this.o=[e]),this.t?.(e);}}const h=(e,t,n={})=>{try{if(PerformanceObserver.supportedEntryTypes.includes(e)){const i=new PerformanceObserver((e=>{Promise.resolve().then((()=>{t(e.getEntries());}));}));return i.observe({type:e,buffered:!0,...n}),i}}catch{}},f=e=>{let t=false;return ()=>{t||(e(),t=true);}};let u=-1;const l=new Set,m=()=>"hidden"!==document.visibilityState||document.prerendering?1/0:0,p=e=>{if("hidden"===document.visibilityState){if("visibilitychange"===e.type)for(const e of l)e();isFinite(u)||(u="visibilitychange"===e.type?e.timeStamp:0,removeEventListener("prerenderingchange",p,true));}},v=()=>{if(u<0){const e=o(),n=document.prerendering?void 0:globalThis.performance.getEntriesByType("visibility-state").filter((t=>"hidden"===t.name&&t.startTime>e))[0]?.startTime;u=n??m(),addEventListener("visibilitychange",p,true),addEventListener("prerenderingchange",p,true),t((()=>{setTimeout((()=>{u=m();}));}));}return {get firstHiddenTime(){return u},onHidden(e){l.add(e);}}},g=e=>{document.prerendering?addEventListener("prerenderingchange",(()=>e()),true):e();},y=[1800,3e3],E=(e,s={})=>{g((()=>{const c=v();let a,d=r("FCP");const f=h("paint",(e=>{for(const t of e)"first-contentful-paint"===t.name&&(f.disconnect(),t.startTime<c.firstHiddenTime&&(d.value=Math.max(t.startTime-o(),0),d.entries.push(t),a(true)));}));f&&(a=n(e,d,y,s.reportAllChanges),t((t=>{d=r("FCP"),a=n(e,d,y,s.reportAllChanges),i((()=>{d.value=performance.now()-t.timeStamp,a(true);}));})));}));},b=[.1,.25],L=(e,s={})=>{const o=v();E(f((()=>{let c,f=r("CLS",0);const u=a(s,d),l=e=>{for(const t of e)u.h(t);u.i>f.value&&(f.value=u.i,f.entries=u.o,c());},m=h("layout-shift",l);m&&(c=n(e,f,b,s.reportAllChanges),o.onHidden((()=>{l(m.takeRecords()),c(true);})),t((()=>{u.i=0,f=r("CLS",0),c=n(e,f,b,s.reportAllChanges),i((()=>c()));})),setTimeout(c));})));};let P=0,T=1/0,_=0;const M=e=>{for(const t of e)t.interactionId&&(T=Math.min(T,t.interactionId),_=Math.max(_,t.interactionId),P=_?(_-T)/7+1:0);};let w;const C=()=>w?P:performance.interactionCount??0,I=()=>{"interactionCount"in performance||w||(w=h("event",M,{type:"event",buffered:true,durationThreshold:0}));};let F=0;class k{u=[];l=new Map;m;p;v(){F=C(),this.u.length=0,this.l.clear();}L(){const e=Math.min(this.u.length-1,Math.floor((C()-F)/50));return this.u[e]}h(e){if(this.m?.(e),!e.interactionId&&"first-input"!==e.entryType)return;const t=this.u.at(-1);let n=this.l.get(e.interactionId);if(n||this.u.length<10||e.duration>t.P){if(n?e.duration>n.P?(n.entries=[e],n.P=e.duration):e.duration===n.P&&e.startTime===n.entries[0].startTime&&n.entries.push(e):(n={id:e.interactionId,entries:[e],P:e.duration},this.l.set(n.id,n),this.u.push(n)),this.u.sort(((e,t)=>t.P-e.P)),this.u.length>10){const e=this.u.splice(10);for(const t of e)this.l.delete(t.id);}this.p?.(n);}}}const A=e=>{const t=globalThis.requestIdleCallback||setTimeout;"hidden"===document.visibilityState?e():(e=f(e),addEventListener("visibilitychange",e,{once:true,capture:true}),t((()=>{e(),removeEventListener("visibilitychange",e,{capture:true});})));},B=[200,500],S=(e,i={})=>{if(!globalThis.PerformanceEventTiming||!("interactionId"in PerformanceEventTiming.prototype))return;const s=v();g((()=>{I();let o,c=r("INP");const d=a(i,k),f=e=>{A((()=>{for(const t of e)d.h(t);const t=d.L();t&&t.P!==c.value&&(c.value=t.P,c.entries=t.entries,o());}));},u=h("event",f,{durationThreshold:i.durationThreshold??40});o=n(e,c,B,i.reportAllChanges),u&&(u.observe({type:"first-input",buffered:true}),s.onHidden((()=>{f(u.takeRecords()),o(true);})),t((()=>{d.v(),c=r("INP"),o=n(e,c,B,i.reportAllChanges);})));}));};class N{m;h(e){this.m?.(e);}}const q=[2500,4e3],x=(e,s={})=>{g((()=>{const c=v();let d,u=r("LCP");const l=a(s,N),m=e=>{s.reportAllChanges||(e=e.slice(-1));for(const t of e)l.h(t),t.startTime<c.firstHiddenTime&&(u.value=Math.max(t.startTime-o(),0),u.entries=[t],d());},p=h("largest-contentful-paint",m);if(p){d=n(e,u,q,s.reportAllChanges);const o=f((()=>{m(p.takeRecords()),p.disconnect(),d(true);})),c=e=>{e.isTrusted&&(A(o),removeEventListener(e.type,c,{capture:true}));};for(const e of ["keydown","click","visibilitychange"])addEventListener(e,c,{capture:true});t((t=>{u=r("LCP"),d=n(e,u,q,s.reportAllChanges),i((()=>{u.value=performance.now()-t.timeStamp,d(true);}));}));}}));},H=[800,1800],O=e=>{document.prerendering?g((()=>O(e))):"complete"!==document.readyState?addEventListener("load",(()=>O(e)),true):setTimeout(e);},$=(e,i={})=>{let c=r("TTFB"),a=n(e,c,H,i.reportAllChanges);O((()=>{const d=s();d&&(c.value=Math.max(d.responseStart-o(),0),c.entries=[d],a(true),t((()=>{c=r("TTFB",0),a=n(e,c,H,i.reportAllChanges),a(true);})));}));};
 
 function getPaintBlocks(resources) {
     const paintBlocks = [];
@@ -7714,10 +7730,10 @@ function Timing (app, opts) {
         // onINP(): Chromium
         // onLCP(): Chromium, Firefox
         // onTTFB(): Chromium, Firefox, Safari
-        w(onVitalsSignal);
-        j(onVitalsSignal);
-        G(onVitalsSignal);
-        Q(onVitalsSignal);
+        L(onVitalsSignal);
+        S(onVitalsSignal);
+        x(onVitalsSignal);
+        $(onVitalsSignal);
     });
     app.attachStopCallback(function () {
         observer.disconnect();
@@ -8508,7 +8524,9 @@ class NetworkMessage {
         });
         if (!messageInfo)
             return null;
-        const isGraphql = messageInfo.url.includes("/graphql");
+        const gqlHeader = "application/graphql-response";
+        const isGraphql = messageInfo.url.includes("/graphql")
+            || Object.values(messageInfo.request.headers).some(v => v.includes(gqlHeader));
         if (isGraphql && messageInfo.response.body && typeof messageInfo.response.body === 'string') {
             const isError = messageInfo.response.body.includes("errors");
             messageInfo.status = isError ? 400 : 200;
@@ -8763,15 +8781,6 @@ class BeaconProxy {
     }
 }
 
-var RequestState;
-(function (RequestState) {
-    RequestState[RequestState["UNSENT"] = 0] = "UNSENT";
-    RequestState[RequestState["OPENED"] = 1] = "OPENED";
-    RequestState[RequestState["HEADERS_RECEIVED"] = 2] = "HEADERS_RECEIVED";
-    RequestState[RequestState["LOADING"] = 3] = "LOADING";
-    RequestState[RequestState["DONE"] = 4] = "DONE";
-})(RequestState || (RequestState = {}));
-
 /**
  * I took inspiration in few stack exchange posts
  * and Tencent vConsole library (MIT)
@@ -8783,19 +8792,19 @@ class ResponseProxyHandler {
     constructor(resp, item) {
         this.resp = resp;
         this.item = item;
-        this.mockReader();
     }
     set(target, key, value) {
         return Reflect.set(target, key, value);
     }
     get(target, key) {
         const value = Reflect.get(target, key);
+        if (key === "arrayBuffer" || key === "blob") {
+            return typeof value === "function" ? value.bind(target) : value;
+        }
         switch (key) {
-            case 'arrayBuffer':
-            case 'blob':
-            case 'formData':
-            case 'json':
-            case 'text':
+            case "formData":
+            case "json":
+            case "text":
                 return () => {
                     this.item.responseType = key.toLowerCase();
                     // @ts-ignore
@@ -8805,74 +8814,13 @@ class ResponseProxyHandler {
                     });
                 };
         }
-        if (typeof value === 'function') {
+        if (typeof value === "function") {
             return value.bind(target);
         }
         else {
             return value;
         }
     }
-    mockReader() {
-        let readerReceivedValue;
-        if (!this.resp.body) {
-            // some browsers do not return `body` in some cases, like `OPTIONS` method
-            return;
-        }
-        if (typeof this.resp.body.getReader !== 'function') {
-            return;
-        }
-        const clonedResp = this.resp.clone();
-        const _getReader = clonedResp.body.getReader;
-        // @ts-ignore
-        clonedResp.body.getReader = () => {
-            const reader = _getReader.apply(this.resp.body);
-            // when readyState is already 4,
-            // it's not a chunked stream, or it had already been read.
-            // so should not update status.
-            if (this.item.readyState === RequestState.DONE) {
-                return reader;
-            }
-            const _read = reader.read;
-            const _cancel = reader.cancel;
-            this.item.responseType = 'arraybuffer';
-            // @ts-ignore
-            reader.read = () => {
-                return _read.apply(reader).then((result) => {
-                    if (!readerReceivedValue) {
-                        // @ts-ignore
-                        readerReceivedValue = new Uint8Array(result.value);
-                    }
-                    else {
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        const newValue = new Uint8Array(readerReceivedValue.length + result.value.length);
-                        newValue.set(readerReceivedValue);
-                        // eslint-disable-next-line @typescript-eslint/no-non-null-assertion
-                        newValue.set(result.value, readerReceivedValue.length);
-                        readerReceivedValue = newValue;
-                    }
-                    this.item.endTime = performance.now();
-                    this.item.duration = this.item.endTime - (this.item.startTime || this.item.endTime);
-                    this.item.readyState = result.done ? 4 : 3;
-                    this.item.statusText = result.done ? String(this.item.status) : 'Loading';
-                    this.item.responseSize = readerReceivedValue.length;
-                    this.item.responseSizeText = formatByteSize(this.item.responseSize);
-                    if (result.done) {
-                        this.item.response = getStringResponseByType(this.item.responseType, readerReceivedValue);
-                    }
-                    return result;
-                });
-            };
-            reader.cancel = (...args) => {
-                this.item.cancelState = 2;
-                this.item.statusText = 'Cancel';
-                this.item.endTime = performance.now();
-                this.item.duration = this.item.endTime - (this.item.startTime || this.item.endTime);
-                this.item.response = getStringResponseByType(this.item.responseType, readerReceivedValue);
-                return _cancel.apply(reader, args);
-            };
-            return reader;
-        };
-    }
 }
 class FetchProxyHandler {
     constructor(ignoredHeaders, setSessionTokenHeader, sanitize, sendMessage, isServiceUrl, tokenUrlMatcher) {
@@ -8884,14 +8832,15 @@ class FetchProxyHandler {
         this.tokenUrlMatcher = tokenUrlMatcher;
     }
     apply(target, _, argsList) {
+        var _a;
         const input = argsList[0];
         const init = argsList[1];
         if (!input ||
             // @ts-ignore
-            (typeof input !== 'string' && !(input === null || input === void 0 ? void 0 : input.url))) {
+            (typeof input !== "string" && !(input === null || input === void 0 ? void 0 : input.url))) {
             return target.apply(window, argsList);
         }
-        const isORUrl = input instanceof URL || typeof input === 'string'
+        const isORUrl = input instanceof URL || typeof input === "string"
             ? this.isServiceUrl(String(input))
             : this.isServiceUrl(String(input.url));
         if (isORUrl) {
@@ -8899,6 +8848,31 @@ class FetchProxyHandler {
         }
         const item = new NetworkMessage(this.ignoredHeaders, this.setSessionTokenHeader, this.sanitize);
         this.beforeFetch(item, input, init);
+        const signal = (argsList[0] instanceof Request ? argsList[0].signal : undefined) ||
+            ((_a = argsList[1]) === null || _a === void 0 ? void 0 : _a.signal);
+        // guard to avoid double-send
+        let abortedNotified = false;
+        const notifyAbort = () => {
+            if (abortedNotified)
+                return;
+            abortedNotified = true;
+            item.endTime = performance.now();
+            item.duration = item.endTime - (item.startTime || item.endTime);
+            item.status = 0;
+            item.statusText = "Aborted";
+            item.readyState = 0;
+            const msg = item.getMessage();
+            if (msg)
+                this.sendMessage(msg);
+        };
+        if (signal) {
+            if (signal.aborted) {
+                notifyAbort();
+            }
+            else {
+                signal.addEventListener("abort", notifyAbort, { once: true });
+            }
+        }
         this.setSessionTokenHeader((name, value) => {
             if (this.tokenUrlMatcher !== undefined) {
                 if (!this.tokenUrlMatcher(item.url)) {
@@ -8927,42 +8901,53 @@ class FetchProxyHandler {
             }
         });
         return target.apply(window, argsList)
-            .then(this.afterFetch(item))
+            .then(this.afterFetch(item, () => {
+            abortedNotified = true;
+        }))
             .catch((e) => {
-            // mock finally
             item.endTime = performance.now();
             item.duration = item.endTime - (item.startTime || item.endTime);
+            if (e && e.name === "AbortError") {
+                item.status = 0;
+                item.statusText = "Aborted";
+                item.readyState = 0;
+                if (!abortedNotified) {
+                    const msg = item.getMessage();
+                    if (msg)
+                        this.sendMessage(msg);
+                }
+            }
             throw e;
         });
     }
     beforeFetch(item, input, init) {
-        let url, method = 'GET', requestHeader = {};
+        let url, method = "GET", requestHeader = {};
         // handle `input` content
-        if (typeof input === 'string') {
+        if (typeof input === "string") {
             // when `input` is a string
-            method = (init === null || init === void 0 ? void 0 : init.method) || 'GET';
+            method = (init === null || init === void 0 ? void 0 : init.method) || "GET";
             url = getURL(input);
             requestHeader = (init === null || init === void 0 ? void 0 : init.headers) || {};
         }
         else {
             // when `input` is a `Request` object
-            method = input.method || 'GET';
+            method = input.method || "GET";
             url = getURL(input.url);
             requestHeader = input.headers;
         }
         item.method = method;
-        item.requestType = 'fetch';
+        item.requestType = "fetch";
         item.requestHeader = requestHeader;
         item.url = url.toString();
-        item.name = (url.pathname.split('/').pop() || '') + url.search;
+        item.name = (url.pathname.split("/").pop() || "") + url.search;
         item.status = 0;
-        item.statusText = 'Pending';
+        item.statusText = "Pending";
         item.readyState = 1;
         if (!item.startTime) {
             // UNSENT
             item.startTime = performance.now();
         }
-        if (Object.prototype.toString.call(requestHeader) === '[object Headers]') {
+        if (Object.prototype.toString.call(requestHeader) === "[object Headers]") {
             item.requestHeader = {};
             for (const [key, value] of requestHeader) {
                 item.requestHeader[key] = value;
@@ -8983,8 +8968,10 @@ class FetchProxyHandler {
             item.requestData = genStringBody(init.body);
         }
     }
-    afterFetch(item) {
+    afterFetch(item, onResolved) {
         return (resp) => {
+            if (onResolved)
+                onResolved === null || onResolved === void 0 ? void 0 : onResolved();
             item.endTime = performance.now();
             item.duration = item.endTime - (item.startTime || item.endTime);
             item.status = resp.status;
@@ -8993,7 +8980,8 @@ class FetchProxyHandler {
             item.header = {};
             for (const [key, value] of resp.headers) {
                 item.header[key] = value;
-                isChunked = value.toLowerCase().indexOf('chunked') > -1 ? true : isChunked;
+                isChunked =
+                    value.toLowerCase().indexOf("chunked") > -1 ? true : isChunked;
             }
             if (isChunked) {
                 // when `transfer-encoding` is chunked, the response is a stream which is under loading,
@@ -9008,7 +8996,9 @@ class FetchProxyHandler {
                 this.handleResponseBody(resp.clone(), item)
                     .then((responseValue) => {
                     item.responseSize =
-                        typeof responseValue === 'string' ? responseValue.length : responseValue.byteLength;
+                        typeof responseValue === "string"
+                            ? responseValue.length
+                            : responseValue.byteLength;
                     item.responseSizeText = formatByteSize(item.responseSize);
                     item.response = getStringResponseByType(item.responseType, responseValue);
                     const msg = item.getMessage();
@@ -9017,28 +9007,40 @@ class FetchProxyHandler {
                     }
                 })
                     .catch((e) => {
-                    if (e.name !== 'AbortError') {
+                    if (e.name === "AbortError") {
+                        item.status = 0;
+                        item.statusText = "Aborted";
+                        item.readyState = 0;
+                        const msg = item.getMessage();
+                        if (msg)
+                            this.sendMessage(msg);
+                    }
+                    else {
                         throw e;
                     }
                 });
             }
-            return new Proxy(resp, new ResponseProxyHandler(resp, item));
+            const ct = (resp.headers.get("content-type") || "").toLowerCase();
+            const isTextLike = ct.includes("application/json") || ct.startsWith("text/");
+            return isTextLike
+                ? new Proxy(resp, new ResponseProxyHandler(resp, item))
+                : resp;
         };
     }
     handleResponseBody(resp, item) {
         // parse response body by Content-Type
-        const contentType = resp.headers.get('content-type');
-        if (contentType && contentType.includes('application/json')) {
-            item.responseType = 'json';
+        const contentType = resp.headers.get("content-type");
+        if (contentType && contentType.includes("application/json")) {
+            item.responseType = "json";
             return resp.text();
         }
         else if (contentType &&
-            (contentType.includes('text/html') || contentType.includes('text/plain'))) {
-            item.responseType = 'text';
+            (contentType.includes("text/html") || contentType.includes("text/plain"))) {
+            item.responseType = "text";
             return resp.text();
         }
         else {
-            item.responseType = 'arraybuffer';
+            item.responseType = "arraybuffer";
             return resp.arrayBuffer();
         }
     }
@@ -9049,6 +9051,15 @@ class FetchProxy {
     }
 }
 
+var RequestState;
+(function (RequestState) {
+    RequestState[RequestState["UNSENT"] = 0] = "UNSENT";
+    RequestState[RequestState["OPENED"] = 1] = "OPENED";
+    RequestState[RequestState["HEADERS_RECEIVED"] = 2] = "HEADERS_RECEIVED";
+    RequestState[RequestState["LOADING"] = 3] = "LOADING";
+    RequestState[RequestState["DONE"] = 4] = "DONE";
+})(RequestState || (RequestState = {}));
+
 /**
  * I took inspiration in few stack exchange posts
  * and Tencent vConsole library (MIT)
@@ -9075,28 +9086,29 @@ class XHRProxyHandler {
             this.onTimeout();
         };
         this.item = new NetworkMessage(ignoredHeaders, setSessionTokenHeader, sanitize);
-        this.item.requestType = 'xhr';
+        this.item.requestType = "xhr";
     }
     get(target, key) {
         switch (key) {
-            case 'open':
+            case "open":
                 return this.getOpen(target);
-            case 'send':
+            case "send":
                 this.setSessionTokenHeader((name, value) => {
                     if (this.tokenUrlMatcher !== undefined) {
                         if (!this.tokenUrlMatcher(this.item.url)) {
                             return;
                         }
                     }
-                    target.setRequestHeader(name, value);
+                    if (target.readyState === 1)
+                        target.setRequestHeader(name, value);
                 });
                 return this.getSend(target);
-            case 'setRequestHeader':
+            case "setRequestHeader":
                 return this.getSetRequestHeader(target);
             default:
                 // eslint-disable-next-line no-case-declarations
                 const value = Reflect.get(target, key);
-                if (typeof value === 'function') {
+                if (typeof value === "function") {
                     return value.bind(target);
                 }
                 else {
@@ -9106,11 +9118,11 @@ class XHRProxyHandler {
     }
     set(target, key, value) {
         switch (key) {
-            case 'onreadystatechange':
+            case "onreadystatechange":
                 return this.setOnReadyStateChange(target, key, value);
-            case 'onabort':
+            case "onabort":
                 return this.setOnAbort(target, key, value);
-            case 'ontimeout':
+            case "ontimeout":
                 return this.setOnTimeout(target, key, value);
             // not tracked methods
         }
@@ -9124,9 +9136,12 @@ class XHRProxyHandler {
         this.item.endTime = performance.now();
         this.item.duration = this.item.endTime - this.item.startTime;
         this.updateItemByReadyState();
-        setTimeout(() => {
-            this.item.response = getStringResponseByType(this.item.responseType, this.item.response);
-        }, 0);
+        const rt = this.item.responseType || "";
+        if (rt === "" || rt === "text" || rt === "json") {
+            setTimeout(() => {
+                this.item.response = getStringResponseByType(rt, this.XMLReq.response);
+            }, 0);
+        }
         if (this.XMLReq.readyState === RequestState.DONE) {
             const msg = this.item.getMessage();
             if (msg) {
@@ -9136,7 +9151,7 @@ class XHRProxyHandler {
     }
     onAbort() {
         this.item.cancelState = 1;
-        this.item.statusText = 'Abort';
+        this.item.statusText = "Abort";
         const msg = this.item.getMessage();
         if (msg) {
             this.sendMessage(msg);
@@ -9144,27 +9159,28 @@ class XHRProxyHandler {
     }
     onTimeout() {
         this.item.cancelState = 3;
-        this.item.statusText = 'Timeout';
+        this.item.statusText = "Timeout";
         const msg = this.item.getMessage();
         if (msg) {
             this.sendMessage(msg);
         }
     }
     getOpen(target) {
-        const targetFunction = Reflect.get(target, 'open');
+        const targetFunction = Reflect.get(target, "open");
         return (...args) => {
             var _a, _b, _c;
             const method = args[0];
             const url = args[1];
-            this.item.method = method ? method.toUpperCase() : 'GET';
-            this.item.url = ((_a = url.toString) === null || _a === void 0 ? void 0 : _a.call(url)) || '';
-            this.item.name = (_c = (_b = this.item.url) === null || _b === void 0 ? void 0 : _b.replace(new RegExp('/*$'), '').split('/').pop()) !== null && _c !== void 0 ? _c : '';
+            this.item.method = method ? method.toUpperCase() : "GET";
+            this.item.url = ((_a = url.toString) === null || _a === void 0 ? void 0 : _a.call(url)) || "";
+            this.item.name =
+                (_c = (_b = this.item.url) === null || _b === void 0 ? void 0 : _b.replace(new RegExp("/*$"), "").split("/").pop()) !== null && _c !== void 0 ? _c : "";
             this.item.getData = genGetDataByUrl(this.item.url, {});
             return targetFunction.apply(target, args);
         };
     }
     getSend(target) {
-        const targetFunction = Reflect.get(target, 'send');
+        const targetFunction = Reflect.get(target, "send");
         return (...args) => {
             const data = args[0];
             this.item.requestData = genStringBody(data);
@@ -9172,7 +9188,7 @@ class XHRProxyHandler {
         };
     }
     getSetRequestHeader(target) {
-        const targetFunction = Reflect.get(target, 'setRequestHeader');
+        const targetFunction = Reflect.get(target, "setRequestHeader");
         return (...args) => {
             if (!this.item.requestHeader) {
                 this.item.requestHeader = {};
@@ -9208,34 +9224,44 @@ class XHRProxyHandler {
             case RequestState.UNSENT:
             case RequestState.OPENED:
                 this.item.status = RequestState.UNSENT;
-                this.item.statusText = 'Pending';
+                this.item.statusText = "Pending";
                 if (!this.item.startTime) {
                     this.item.startTime = performance.now();
                 }
                 break;
             case RequestState.HEADERS_RECEIVED:
                 this.item.status = this.XMLReq.status;
-                this.item.statusText = 'Loading';
+                this.item.statusText = "Loading";
                 this.item.header = {};
                 // eslint-disable-next-line no-case-declarations
-                const header = this.XMLReq.getAllResponseHeaders() || '', headerArr = header.split('\n');
+                const header = this.XMLReq.getAllResponseHeaders() || "", headerArr = header.split("\n");
                 // extract plain text to key-value format
                 for (let i = 0; i < headerArr.length; i++) {
                     const line = headerArr[i];
                     if (!line) {
                         continue;
                     }
-                    const arr = line.split(': ');
+                    const arr = line.split(": ");
                     const key = arr[0];
-                    this.item.header[key] = arr.slice(1).join(': ');
+                    this.item.header[key] = arr.slice(1).join(": ");
                 }
                 break;
             case RequestState.LOADING:
                 this.item.status = this.XMLReq.status;
-                this.item.statusText = 'Loading';
-                if (!!this.XMLReq.response && this.XMLReq.response.length) {
-                    this.item.responseSize = this.XMLReq.response.length;
-                    this.item.responseSizeText = formatByteSize(this.item.responseSize);
+                this.item.statusText = "Loading";
+                const response = this.XMLReq.response;
+                if (response) {
+                    const respSize = typeof response === "string"
+                        ? response.length
+                        : response instanceof ArrayBuffer
+                            ? response.byteLength
+                            : typeof Blob !== "undefined" && response instanceof Blob
+                                ? response.size
+                                : 0;
+                    if (respSize) {
+                        this.item.responseSize = respSize;
+                        this.item.responseSizeText = formatByteSize(this.item.responseSize);
+                    }
                 }
                 break;
             case RequestState.DONE:
@@ -9244,16 +9270,30 @@ class XHRProxyHandler {
                 // show status code when request completed
                 this.item.statusText = String(this.item.status);
                 this.item.endTime = performance.now();
-                this.item.duration = this.item.endTime - (this.item.startTime || this.item.endTime);
-                this.item.response = this.XMLReq.response;
-                if (!!this.XMLReq.response && this.XMLReq.response.length) {
-                    this.item.responseSize = this.XMLReq.response.length;
-                    this.item.responseSizeText = formatByteSize(this.item.responseSize);
+                this.item.duration =
+                    this.item.endTime - (this.item.startTime || this.item.endTime);
+                const resp = this.XMLReq.response;
+                const respType = this.XMLReq.responseType || "";
+                if (respType === "" || respType === "text" || respType === "json") {
+                    this.item.response = resp;
+                }
+                if (resp) {
+                    const respSize = typeof resp === "string"
+                        ? resp.length
+                        : resp instanceof ArrayBuffer
+                            ? resp.byteLength
+                            : typeof Blob !== "undefined" && resp instanceof Blob
+                                ? resp.size
+                                : 0;
+                    if (respSize) {
+                        this.item.responseSize = respSize;
+                        this.item.responseSizeText = formatByteSize(respSize);
+                    }
                 }
                 break;
             default:
                 this.item.status = this.XMLReq.status;
-                this.item.statusText = 'Unknown';
+                this.item.statusText = "Unknown";
                 break;
         }
     }
@@ -9671,7 +9711,7 @@ class API {
         this.signalStartIssue = (reason, missingApi) => {
             const doNotTrack = this.checkDoNotTrack();
             console.log("Tracker couldn't start due to:", JSON.stringify({
-                trackerVersion: '16.4.9',
+                trackerVersion: '16.4.10',
                 projectKey: this.options.projectKey,
                 doNotTrack,
                 reason: missingApi.length ? `missing api: ${missingApi.join(',')}` : reason,