@openreplay/tracker 3.6.1 → 3.6.2

package/cjs/modules/img.js

@@ -1,7 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 const utils_js_1 = require("../utils.js");
-const messages_gen_js_1 = require("../app/messages.gen.js");
+const messages_js_1 = require("../common/messages.js");
 const guards_js_1 = require("../app/guards.js");
 function resolveURL(url, location = document.location) {
     url = url.trim();
@@ -18,34 +18,19 @@ function resolveURL(url, location = document.location) {
         return location.origin + location.pathname + url;
     }
 }
-const PLACEHOLDER_SRC = 'https://static.openreplay.com/tracker/placeholder.jpeg';
+const PLACEHOLDER_SRC = "https://static.openreplay.com/tracker/placeholder.jpeg";
 function default_1(app) {
     function sendPlaceholder(id, node) {
-        app.send((0, messages_gen_js_1.SetNodeAttribute)(id, 'src', PLACEHOLDER_SRC));
+        app.send(new messages_js_1.SetNodeAttribute(id, "src", PLACEHOLDER_SRC));
         const { width, height } = node.getBoundingClientRect();
-        if (!node.hasAttribute('width')) {
-            app.send((0, messages_gen_js_1.SetNodeAttribute)(id, 'width', String(width)));
+        if (!node.hasAttribute("width")) {
+            app.send(new messages_js_1.SetNodeAttribute(id, "width", String(width)));
         }
-        if (!node.hasAttribute('height')) {
-            app.send((0, messages_gen_js_1.SetNodeAttribute)(id, 'height', String(height)));
+        if (!node.hasAttribute("height")) {
+            app.send(new messages_js_1.SetNodeAttribute(id, "height", String(height)));
         }
     }
-    const sendSrcset = function (id, img) {
-        const { srcset } = img;
-        if (!srcset) {
-            return;
-        }
-        const resolvedSrcset = srcset
-            .split(',')
-            .map((str) => resolveURL(str))
-            .join(',');
-        app.send((0, messages_gen_js_1.SetNodeAttribute)(id, 'srcset', resolvedSrcset));
-    };
-    const sendSrc = function (id, img) {
-        const src = img.src;
-        app.send((0, messages_gen_js_1.SetNodeAttributeURLBased)(id, 'src', src, app.getBaseHref()));
-    };
-    const sendImgAttrs = app.safe(function () {
+    const sendImgSrc = app.safe(function () {
         const id = app.nodes.getID(this);
         if (id === undefined) {
             return;
@@ -57,45 +42,47 @@ function default_1(app) {
         const resolvedSrc = resolveURL(src || ''); // Src type is null sometimes. - is it true?
         if (naturalWidth === 0 && naturalHeight === 0) {
             if ((0, utils_js_1.isURL)(resolvedSrc)) {
-                app.send((0, messages_gen_js_1.ResourceTiming)((0, utils_js_1.timestamp)(), 0, 0, 0, 0, 0, resolvedSrc, 'img'));
+                app.send(new messages_js_1.ResourceTiming((0, utils_js_1.timestamp)(), 0, 0, 0, 0, 0, resolvedSrc, 'img'));
             }
         }
         else if (resolvedSrc.length >= 1e5 || app.sanitizer.isMasked(id)) {
             sendPlaceholder(id, this);
         }
         else {
-            sendSrc(id, this);
-            sendSrcset(id, this);
+            app.send(new messages_js_1.SetNodeAttribute(id, 'src', resolvedSrc));
+            if (srcset) {
+                const resolvedSrcset = srcset.split(',').map(str => resolveURL(str)).join(',');
+                app.send(new messages_js_1.SetNodeAttribute(id, 'srcset', resolvedSrcset));
+            }
         }
     });
     const observer = new MutationObserver((mutations) => {
         for (const mutation of mutations) {
-            if (mutation.type === 'attributes') {
+            if (mutation.type === "attributes") {
                 const target = mutation.target;
                 const id = app.nodes.getID(target);
                 if (id === undefined) {
                     return;
                 }
-                if (mutation.attributeName === 'src') {
-                    sendSrc(id, target);
+                if (mutation.attributeName === "src") {
+                    const src = target.src;
+                    app.send(new messages_js_1.SetNodeAttributeURLBased(id, 'src', src, app.getBaseHref()));
                 }
-                if (mutation.attributeName === 'srcset') {
-                    sendSrcset(id, target);
+                if (mutation.attributeName === "srcset") {
+                    const srcset = target.srcset;
+                    app.send(new messages_js_1.SetNodeAttribute(id, 'srcset', srcset));
                 }
             }
         }
     });
-    app.attachStopCallback(() => {
-        observer.disconnect();
-    });
     app.nodes.attachNodeCallback((node) => {
-        if (!(0, guards_js_1.hasTag)(node, 'IMG')) {
+        if (!(0, guards_js_1.hasTag)(node, "IMG")) {
             return;
         }
-        app.nodes.attachElementListener('error', node, sendImgAttrs.bind(node));
-        app.nodes.attachElementListener('load', node, sendImgAttrs.bind(node));
-        sendImgAttrs.call(node);
-        observer.observe(node, { attributes: true, attributeFilter: ['src', 'srcset'] });
+        app.nodes.attachElementListener('error', node, sendImgSrc);
+        app.nodes.attachElementListener('load', node, sendImgSrc);
+        sendImgSrc.call(node);
+        observer.observe(node, { attributes: true, attributeFilter: ["src", "srcset"] });
     });
 }
 exports.default = default_1;

package/cjs/modules/input.d.ts

@@ -1,4 +1,4 @@
-import type App from '../app/index.js';
+import type App from "../app/index.js";
 declare type TextEditableElement = HTMLInputElement | HTMLTextAreaElement;
 export declare function getInputLabel(node: TextEditableElement): string;
 export declare const enum InputMode {

package/cjs/modules/input.js

@@ -3,19 +3,19 @@ Object.defineProperty(exports, "__esModule", { value: true });
 exports.getInputLabel = void 0;
 const utils_js_1 = require("../utils.js");
 const guards_js_1 = require("../app/guards.js");
-const messages_gen_js_1 = require("../app/messages.gen.js");
+const messages_js_1 = require("../common/messages.js");
 const INPUT_TYPES = ['text', 'password', 'email', 'search', 'number', 'range', 'date'];
 function isTextEditable(node) {
-    if ((0, guards_js_1.hasTag)(node, 'TEXTAREA')) {
+    if ((0, guards_js_1.hasTag)(node, "TEXTAREA")) {
         return true;
     }
-    if (!(0, guards_js_1.hasTag)(node, 'INPUT')) {
+    if (!(0, guards_js_1.hasTag)(node, "INPUT")) {
         return false;
     }
     return INPUT_TYPES.includes(node.type);
 }
 function isCheckable(node) {
-    if (!(0, guards_js_1.hasTag)(node, 'INPUT')) {
+    if (!(0, guards_js_1.hasTag)(node, "INPUT")) {
         return false;
     }
     const type = node.type;
@@ -25,7 +25,7 @@ const labelElementFor = utils_js_1.IN_BROWSER && 'labels' in HTMLInputElement.pr
     ? (node) => {
         let p = node;
         while ((p = p.parentNode) !== null) {
-            if ((0, guards_js_1.hasTag)(p, 'LABEL')) {
+            if ((0, guards_js_1.hasTag)(p, "LABEL")) {
                 return p;
             }
         }
@@ -37,13 +37,13 @@ const labelElementFor = utils_js_1.IN_BROWSER && 'labels' in HTMLInputElement.pr
     : (node) => {
         let p = node;
         while ((p = p.parentNode) !== null) {
-            if ((0, guards_js_1.hasTag)(p, 'LABEL')) {
+            if ((0, guards_js_1.hasTag)(p, "LABEL")) {
                 return p;
             }
         }
         const id = node.id;
         if (id) {
-            const labels = node.ownerDocument.querySelectorAll('label[for="' + id + '"]');
+            const labels = document.querySelectorAll('label[for="' + id + '"]');
             if (labels !== null && labels.length === 1) {
                 return labels[0];
             }
@@ -53,13 +53,12 @@ function getInputLabel(node) {
     let label = (0, utils_js_1.getLabelAttribute)(node);
     if (label === null) {
         const labelElement = labelElementFor(node);
-        label =
-            (labelElement && labelElement.innerText) ||
-                node.placeholder ||
-                node.name ||
-                node.id ||
-                node.className ||
-                node.type;
+        label = (labelElement && labelElement.innerText)
+            || node.placeholder
+            || node.name
+            || node.id
+            || node.className
+            || node.type;
     }
     return (0, utils_js_1.normSpaces)(label).slice(0, 100);
 }
@@ -74,7 +73,7 @@ function default_1(app, opts) {
     function sendInputTarget(id, node) {
         const label = getInputLabel(node);
         if (label !== '') {
-            app.send((0, messages_gen_js_1.SetInputTarget)(id, label));
+            app.send(new messages_js_1.SetInputTarget(id, label));
         }
     }
     function sendInputValue(id, node) {
@@ -87,7 +86,8 @@ function default_1(app, opts) {
             (inputMode === 0 /* Plain */ &&
                 ((options.obscureInputNumbers && node.type !== 'date' && /\d\d\d\d/.test(value)) ||
                     (options.obscureInputDates && node.type === 'date') ||
-                    (options.obscureInputEmails && (node.type === 'email' || !!~value.indexOf('@')))))) {
+                    (options.obscureInputEmails &&
+                        (node.type === 'email' || !!~value.indexOf('@')))))) {
             inputMode = 1 /* Obscured */;
         }
         let mask = 0;
@@ -101,7 +101,7 @@ function default_1(app, opts) {
                 value = '';
                 break;
         }
-        app.send((0, messages_gen_js_1.SetInputValue)(id, value, mask));
+        app.send(new messages_js_1.SetInputValue(id, value, mask));
     }
     const inputValues = new Map();
     const checkableValues = new Map();
@@ -139,7 +139,7 @@ function default_1(app, opts) {
             }
             if (checked !== node.checked) {
                 checkableValues.set(id, node.checked);
-                app.send((0, messages_gen_js_1.SetInputChecked)(id, node.checked));
+                app.send(new messages_js_1.SetInputChecked(id, node.checked));
             }
         });
     });
@@ -150,9 +150,9 @@ function default_1(app, opts) {
             return;
         }
         // TODO: support multiple select (?): use selectedOptions; Need send target?
-        if ((0, guards_js_1.hasTag)(node, 'SELECT')) {
+        if ((0, guards_js_1.hasTag)(node, "SELECT")) {
             sendInputValue(id, node);
-            app.attachEventListener(node, 'change', () => {
+            app.attachEventListener(node, "change", () => {
                 sendInputValue(id, node);
             });
         }
@@ -163,7 +163,7 @@ function default_1(app, opts) {
         }
         if (isCheckable(node)) {
             checkableValues.set(id, node.checked);
-            app.send((0, messages_gen_js_1.SetInputChecked)(id, node.checked));
+            app.send(new messages_js_1.SetInputChecked(id, node.checked));
             return;
         }
     }));

package/cjs/modules/longtasks.d.ts

@@ -0,0 +1,2 @@
+import type App from "../app/index.js";
+export default function (app: App): void;

package/cjs/modules/longtasks.js

@@ -0,0 +1,26 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+const messages_js_1 = require("../common/messages.js");
+;
+;
+function default_1(app) {
+    if (!('PerformanceObserver' in window) || !('PerformanceLongTaskTiming' in window)) {
+        return;
+    }
+    const contexts = ["unknown", "self", "same-origin-ancestor", "same-origin-descendant", "same-origin", "cross-origin-ancestor", "cross-origin-descendant", "cross-origin-unreachable", "multiple-contexts"];
+    const containerTypes = ["window", "iframe", "embed", "object"];
+    function longTask(entry) {
+        let type = "", src = "", id = "", name = "";
+        const container = entry.attribution[0];
+        if (container != null) {
+            type = container.containerType;
+            name = container.containerName;
+            id = container.containerId;
+            src = container.containerSrc;
+        }
+        app.send(new messages_js_1.LongTask(entry.startTime + performance.timing.navigationStart, entry.duration, Math.max(contexts.indexOf(entry.name), 0), Math.max(containerTypes.indexOf(type), 0), name, id, src));
+    }
+    const observer = new PerformanceObserver((list) => list.getEntries().forEach(longTask));
+    observer.observe({ entryTypes: ['longtask'] });
+}
+exports.default = default_1;

package/cjs/modules/mouse.d.ts

@@ -1,2 +1,2 @@
-import type App from '../app/index.js';
+import type App from "../app/index.js";
 export default function (app: App): void;

package/cjs/modules/mouse.js

@@ -2,9 +2,9 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const guards_js_1 = require("../app/guards.js");
 const utils_js_1 = require("../utils.js");
-const messages_gen_js_1 = require("../app/messages.gen.js");
+const messages_js_1 = require("../common/messages.js");
 const input_js_1 = require("./input.js");
-function _getSelector(target, document) {
+function _getSelector(target) {
     let el = target;
     let selector = null;
     do {
@@ -12,10 +12,9 @@ function _getSelector(target, document) {
             return `#${el.id}` + (selector ? ` > ${selector}` : '');
         }
         selector =
-            el.className
-                .split(' ')
-                .map((cn) => cn.trim())
-                .filter((cn) => cn !== '')
+            el.className.split(' ')
+                .map(cn => cn.trim())
+                .filter(cn => cn !== '')
                 .reduce((sel, cn) => `${sel}.${cn}`, el.tagName.toLowerCase()) +
                 (selector ? ` > ${selector}` : '');
         if (el === document.body) {
@@ -27,23 +26,23 @@ function _getSelector(target, document) {
 }
 function isClickable(element) {
     const tag = element.tagName.toUpperCase();
-    return (tag === 'BUTTON' ||
+    return tag === 'BUTTON' ||
         tag === 'A' ||
         tag === 'LI' ||
         tag === 'SELECT' ||
         element.onclick != null ||
-        element.getAttribute('role') === 'button');
+        element.getAttribute('role') === 'button';
     //|| element.className.includes("btn")
-    // MBTODO: intersept addEventListener
+    // MBTODO: intersect addEventListener
 }
-//TODO: fix (typescript is not sure about target variable after assignation of svg)
-function getTarget(target, document) {
+//TODO: fix (typescript doesn't allow work when the guard is inside the function)
+function getTarget(target) {
     if (target instanceof Element) {
-        return _getTarget(target, document);
+        return _getTarget(target);
     }
     return null;
 }
-function _getTarget(target, document) {
+function _getTarget(target) {
     let element = target;
     while (element !== null && element !== document.documentElement) {
         if ((0, utils_js_1.hasOpenreplayAttribute)(element, 'masked')) {
@@ -67,7 +66,8 @@ function _getTarget(target, document) {
         if (tag === 'INPUT') {
             return element;
         }
-        if (isClickable(element) || (0, utils_js_1.getLabelAttribute)(element) !== null) {
+        if (isClickable(element) ||
+            (0, utils_js_1.getLabelAttribute)(element) !== null) {
             return element;
         }
         element = element.parentElement;
@@ -80,7 +80,7 @@ function default_1(app) {
         if (dl !== null) {
             return dl;
         }
-        if ((0, guards_js_1.hasTag)(target, 'INPUT')) {
+        if ((0, guards_js_1.hasTag)(target, "INPUT")) {
             return (0, input_js_1.getInputLabel)(target);
         }
         if (isClickable(target)) {
@@ -106,47 +106,40 @@ function default_1(app) {
     });
     const sendMouseMove = () => {
         if (mousePositionChanged) {
-            app.send((0, messages_gen_js_1.MouseMove)(mousePositionX, mousePositionY));
+            app.send(new messages_js_1.MouseMove(mousePositionX, mousePositionY));
             mousePositionChanged = false;
         }
     };
-    const patchDocument = (document) => {
-        const selectorMap = {};
-        function getSelector(id, target) {
-            return (selectorMap[id] = selectorMap[id] || _getSelector(target, document));
+    const selectorMap = {};
+    function getSelector(id, target) {
+        return selectorMap[id] = selectorMap[id] || _getSelector(target);
+    }
+    app.attachEventListener(document.documentElement, 'mouseover', (e) => {
+        const target = getTarget(e.target);
+        if (target !== mouseTarget) {
+            mouseTarget = target;
+            mouseTargetTime = performance.now();
         }
-        app.attachEventListener(document.documentElement, 'mouseover', (e) => {
-            const target = getTarget(e.target, document);
-            if (target !== mouseTarget) {
-                mouseTarget = target;
-                mouseTargetTime = performance.now();
-            }
-        });
-        app.attachEventListener(document, 'mousemove', (e) => {
-            const { top, left } = app.observer.getDocumentOffset(document);
-            mousePositionX = e.clientX + left;
-            mousePositionY = e.clientY + top;
-            mousePositionChanged = true;
-        }, false);
-        app.attachEventListener(document, 'click', (e) => {
-            const target = getTarget(e.target, document);
-            if ((!e.clientX && !e.clientY) || target === null) {
-                return;
-            }
-            const id = app.nodes.getID(target);
-            if (id !== undefined) {
-                sendMouseMove();
-                app.send((0, messages_gen_js_1.MouseClick)(id, mouseTarget === target ? Math.round(performance.now() - mouseTargetTime) : 0, getTargetLabel(target), getSelector(id, target)), true);
-            }
-            mouseTarget = null;
-        });
-    };
-    app.nodes.attachNodeCallback((node) => {
-        if ((0, guards_js_1.isDocument)(node)) {
-            patchDocument(node);
+    });
+    app.attachEventListener(document, 'mousemove', (e) => {
+        mousePositionX = e.clientX;
+        mousePositionY = e.clientY;
+        mousePositionChanged = true;
+    }, false);
+    app.attachEventListener(document, 'click', (e) => {
+        const target = getTarget(e.target);
+        if ((!e.clientX && !e.clientY) || target === null) {
+            return;
         }
+        const id = app.nodes.getID(target);
+        if (id !== undefined) {
+            sendMouseMove();
+            app.send(new messages_js_1.MouseClick(id, mouseTarget === target
+                ? Math.round(performance.now() - mouseTargetTime)
+                : 0, getTargetLabel(target), getSelector(id, target)), true);
+        }
+        mouseTarget = null;
     });
-    patchDocument(document);
     app.ticker.attach(sendMouseMove, 10);
 }
 exports.default = default_1;

package/cjs/modules/performance.d.ts

@@ -1,4 +1,4 @@
-import type App from '../app/index.js';
+import type App from "../app/index.js";
 export declare const deviceMemory: number;
 export declare const jsHeapSizeLimit: number;
 export interface Options {

package/cjs/modules/performance.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.jsHeapSizeLimit = exports.deviceMemory = void 0;
 const utils_js_1 = require("../utils.js");
-const messages_gen_js_1 = require("../app/messages.gen.js");
+const messages_js_1 = require("../common/messages.js");
 const perf = utils_js_1.IN_BROWSER && 'performance' in window && 'memory' in performance // works in Chrome only
     ? performance
     : { memory: {} };
@@ -34,7 +34,7 @@ function default_1(app, opts) {
         if (frames === undefined || ticks === undefined) {
             return;
         }
-        app.send((0, messages_gen_js_1.PerformanceTrack)(frames, ticks, perf.memory.totalJSHeapSize || 0, perf.memory.usedJSHeapSize || 0));
+        app.send(new messages_js_1.PerformanceTrack(frames, ticks, perf.memory.totalJSHeapSize || 0, perf.memory.usedJSHeapSize || 0));
         ticks = frames = document.hidden ? -1 : 0;
     };
     app.attachStartCallback(() => {

package/cjs/modules/scroll.d.ts

@@ -1,2 +1,2 @@
-import type App from '../app/index.js';
+import type App from "../app/index.js";
 export default function (app: App): void;

package/cjs/modules/scroll.js

@@ -1,16 +1,11 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-const messages_gen_js_1 = require("../app/messages.gen.js");
+const messages_js_1 = require("../common/messages.js");
 const guards_js_1 = require("../app/guards.js");
 function default_1(app) {
     let documentScroll = false;
     const nodeScroll = new Map();
-    function setNodeScroll(target) {
-        if (target instanceof Element) {
-            nodeScroll.set(target, [target.scrollLeft, target.scrollTop]);
-        }
-    }
-    const sendSetViewportScroll = app.safe(() => app.send((0, messages_gen_js_1.SetViewportScroll)(window.pageXOffset ||
+    const sendSetViewportScroll = app.safe(() => app.send(new messages_js_1.SetViewportScroll(window.pageXOffset ||
         (document.documentElement && document.documentElement.scrollLeft) ||
         (document.body && document.body.scrollLeft) ||
         0, window.pageYOffset ||
@@ -20,7 +15,7 @@ function default_1(app) {
     const sendSetNodeScroll = app.safe((s, node) => {
         const id = app.nodes.getID(node);
         if (id !== undefined) {
-            app.send((0, messages_gen_js_1.SetNodeScroll)(id, s[0], s[1]));
+            app.send(new messages_js_1.SetNodeScroll(id, s[0], s[1]));
         }
     });
     app.attachStartCallback(sendSetViewportScroll);
@@ -32,20 +27,16 @@ function default_1(app) {
         if (isStart && (0, guards_js_1.isElementNode)(node) && node.scrollLeft + node.scrollTop > 0) {
             nodeScroll.set(node, [node.scrollLeft, node.scrollTop]);
         }
-        else if ((0, guards_js_1.isRootNode)(node)) {
-            // scroll is not-composed event (https://javascript.info/shadow-dom-events)
-            app.attachEventListener(node, 'scroll', (e) => {
-                setNodeScroll(e.target);
-            });
-        }
     });
-    app.attachEventListener(document, 'scroll', (e) => {
+    app.attachEventListener(window, 'scroll', (e) => {
         const target = e.target;
         if (target === document) {
             documentScroll = true;
             return;
         }
-        setNodeScroll(target);
+        if (target instanceof Element) {
+            nodeScroll.set(target, [target.scrollLeft, target.scrollTop]);
+        }
     });
     app.ticker.attach(() => {
         if (documentScroll) {

package/cjs/modules/timing.d.ts

@@ -1,4 +1,4 @@
-import type App from '../app/index.js';
+import type App from "../app/index.js";
 export interface Options {
     captureResourceTimings: boolean;
     capturePageLoadTimings: boolean;

package/cjs/modules/timing.js

@@ -2,7 +2,7 @@
 Object.defineProperty(exports, "__esModule", { value: true });
 const guards_js_1 = require("../app/guards.js");
 const utils_js_1 = require("../utils.js");
-const messages_gen_js_1 = require("../app/messages.gen.js");
+const messages_js_1 = require("../common/messages.js");
 function getPaintBlocks(resources) {
     const paintBlocks = [];
     const elements = document.getElementsByTagName('*');
@@ -10,7 +10,7 @@ function getPaintBlocks(resources) {
     for (let i = 0; i < elements.length; i++) {
         const element = elements[i];
         let src = '';
-        if ((0, guards_js_1.hasTag)(element, 'IMG')) {
+        if ((0, guards_js_1.hasTag)(element, "IMG")) {
             src = element.currentSrc || element.src;
         }
         if (!src) {
@@ -36,7 +36,9 @@ function getPaintBlocks(resources) {
         const bottom = Math.min(rect.bottom, window.innerHeight ||
             (document.documentElement && document.documentElement.clientHeight) ||
             0);
-        const right = Math.min(rect.right, window.innerWidth || (document.documentElement && document.documentElement.clientWidth) || 0);
+        const right = Math.min(rect.right, window.innerWidth ||
+            (document.documentElement && document.documentElement.clientWidth) ||
+            0);
         if (bottom <= top || right <= left)
             continue;
         const area = (bottom - top) * (right - left);
@@ -46,7 +48,8 @@ function getPaintBlocks(resources) {
 }
 function calculateSpeedIndex(firstContentfulPaint, paintBlocks) {
     let a = (Math.max((document.documentElement && document.documentElement.clientWidth) || 0, window.innerWidth || 0) *
-        Math.max((document.documentElement && document.documentElement.clientHeight) || 0, window.innerHeight || 0)) /
+        Math.max((document.documentElement && document.documentElement.clientHeight) ||
+            0, window.innerHeight || 0)) /
         10;
     let s = a * firstContentfulPaint;
     for (let i = 0; i < paintBlocks.length; i++) {
@@ -75,13 +78,16 @@ function default_1(app, opts) {
         if (resources !== null) {
             resources[entry.name] = entry.startTime + entry.duration;
         }
-        app.send((0, messages_gen_js_1.ResourceTiming)(entry.startTime + performance.timing.navigationStart, entry.duration, entry.responseStart && entry.startTime ? entry.responseStart - entry.startTime : 0, entry.transferSize > entry.encodedBodySize ? entry.transferSize - entry.encodedBodySize : 0, entry.encodedBodySize || 0, entry.decodedBodySize || 0, entry.name, entry.initiatorType));
+        app.send(new messages_js_1.ResourceTiming(entry.startTime + performance.timing.navigationStart, entry.duration, entry.responseStart && entry.startTime
+            ? entry.responseStart - entry.startTime
+            : 0, entry.transferSize > entry.encodedBodySize
+            ? entry.transferSize - entry.encodedBodySize
+            : 0, entry.encodedBodySize || 0, entry.decodedBodySize || 0, entry.name, entry.initiatorType));
     }
     const observer = new PerformanceObserver((list) => list.getEntries().forEach(resourceTiming));
     let prevSessionID;
     app.attachStartCallback(function ({ sessionID }) {
-        if (sessionID !== prevSessionID) {
-            // Send past page resources on a newly started session
+        if (sessionID !== prevSessionID) { // Send past page resources on a newly started session
             performance.getEntriesByType('resource').forEach(resourceTiming);
             prevSessionID = sessionID;
         }
@@ -98,7 +104,9 @@ function default_1(app, opts) {
                 return;
             }
             if (firstPaint === 0 || firstContentfulPaint === 0) {
-                performance.getEntriesByType('paint').forEach((entry) => {
+                performance
+                    .getEntriesByType('paint')
+                    .forEach((entry) => {
                     const { name, startTime } = entry;
                     switch (name) {
                         case 'first-paint':
@@ -113,7 +121,7 @@ function default_1(app, opts) {
             if (performance.timing.loadEventEnd || performance.now() > 30000) {
                 pageLoadTimingSent = true;
                 const { navigationStart, requestStart, responseStart, responseEnd, domContentLoadedEventStart, domContentLoadedEventEnd, loadEventStart, loadEventEnd, } = performance.timing;
-                app.send((0, messages_gen_js_1.PageLoadTiming)(requestStart - navigationStart || 0, responseStart - navigationStart || 0, responseEnd - navigationStart || 0, domContentLoadedEventStart - navigationStart || 0, domContentLoadedEventEnd - navigationStart || 0, loadEventStart - navigationStart || 0, loadEventEnd - navigationStart || 0, firstPaint, firstContentfulPaint));
+                app.send(new messages_js_1.PageLoadTiming(requestStart - navigationStart || 0, responseStart - navigationStart || 0, responseEnd - navigationStart || 0, domContentLoadedEventStart - navigationStart || 0, domContentLoadedEventEnd - navigationStart || 0, loadEventStart - navigationStart || 0, loadEventEnd - navigationStart || 0, firstPaint, firstContentfulPaint));
             }
         }, 30);
     }
@@ -136,19 +144,23 @@ function default_1(app, opts) {
                 if (time - interactiveWindowTickTime > 50) {
                     interactiveWindowStartTime = time;
                 }
-                interactiveWindowTickTime = time - interactiveWindowStartTime > 5000 ? null : time;
+                interactiveWindowTickTime =
+                    time - interactiveWindowStartTime > 5000 ? null : time;
             }
-            if ((paintBlocks !== null && interactiveWindowTickTime === null) || time > 30000) {
+            if ((paintBlocks !== null && interactiveWindowTickTime === null) ||
+                time > 30000) {
                 pageRenderTimingSent = true;
                 resources = null;
                 const speedIndex = paintBlocks === null
                     ? 0
                     : calculateSpeedIndex(firstContentfulPaint || firstPaint, paintBlocks);
                 const timeToInteractive = interactiveWindowTickTime === null
-                    ? Math.max(interactiveWindowStartTime, firstContentfulPaint, performance.timing.domContentLoadedEventEnd - performance.timing.navigationStart ||
-                        0)
+                    ? Math.max(interactiveWindowStartTime, firstContentfulPaint, performance.timing.domContentLoadedEventEnd -
+                        performance.timing.navigationStart || 0)
                     : 0;
-                app.send((0, messages_gen_js_1.PageRenderTiming)(speedIndex, firstContentfulPaint > visuallyComplete ? firstContentfulPaint : visuallyComplete, timeToInteractive));
+                app.send(new messages_js_1.PageRenderTiming(speedIndex, firstContentfulPaint > visuallyComplete
+                    ? firstContentfulPaint
+                    : visuallyComplete, timeToInteractive));
             }
         });
     }

package/cjs/modules/viewport.d.ts

@@ -1,2 +1,2 @@
-import type App from '../app/index.js';
+import type App from "../app/index.js";
 export default function (app: App): void;