posthog-js 1.76.0 → 1.77.1

package/lib/src/extensions/sessionrecording-utils.d.ts

@@ -0,0 +1,67 @@
+import type { KeepIframeSrcFn, RecordPlugin, SamplingStrategy, blockClass, eventWithTime, hooksParam, listenerHandler, maskTextClass } from '@rrweb/types';
+import type { Mirror, MaskInputOptions, MaskInputFn, MaskTextFn, SlimDOMOptions, DataURLOptions } from 'rrweb-snapshot';
+export declare const replacementImageURI = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNOCAwSDE2TDAgMTZWOEw4IDBaIiBmaWxsPSIjMkQyRDJEIi8+CjxwYXRoIGQ9Ik0xNiA4VjE2SDhMMTYgOFoiIGZpbGw9IiMyRDJEMkQiLz4KPC9zdmc+Cg==";
+export declare const FULL_SNAPSHOT_EVENT_TYPE = 2;
+export declare const META_EVENT_TYPE = 4;
+export declare const INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
+export declare const PLUGIN_EVENT_TYPE = 6;
+export declare const MUTATION_SOURCE_TYPE = 0;
+export declare const MAX_MESSAGE_SIZE = 5000000;
+export declare type rrwebRecord = {
+    (options: recordOptions<eventWithTime>): listenerHandler;
+    addCustomEvent: (tag: string, payload: any) => void;
+    takeFullSnapshot: () => void;
+    mirror: Mirror;
+};
+export declare type recordOptions<T> = {
+    emit?: (e: T, isCheckout?: boolean) => void;
+    checkoutEveryNth?: number;
+    checkoutEveryNms?: number;
+    blockClass?: blockClass;
+    blockSelector?: string;
+    ignoreClass?: string;
+    maskTextClass?: maskTextClass;
+    maskTextSelector?: string;
+    maskAllInputs?: boolean;
+    maskInputOptions?: MaskInputOptions;
+    maskInputFn?: MaskInputFn;
+    maskTextFn?: MaskTextFn;
+    slimDOMOptions?: SlimDOMOptions | 'all' | true;
+    ignoreCSSAttributes?: Set<string>;
+    inlineStylesheet?: boolean;
+    hooks?: hooksParam;
+    sampling?: SamplingStrategy;
+    dataURLOptions?: DataURLOptions;
+    recordCanvas?: boolean;
+    recordCrossOriginIframes?: boolean;
+    recordAfter?: 'DOMContentLoaded' | 'load';
+    userTriggeredOnInput?: boolean;
+    collectFonts?: boolean;
+    inlineImages?: boolean;
+    plugins?: RecordPlugin[];
+    mousemoveWait?: number;
+    keepIframeSrcFn?: KeepIframeSrcFn;
+};
+export declare function ensureMaxMessageSize(data: eventWithTime): {
+    event: eventWithTime;
+    size: number;
+};
+export declare const CONSOLE_LOG_PLUGIN_NAME = "rrweb/console@1";
+export declare function truncateLargeConsoleLogs(_event: eventWithTime): eventWithTime;
+export declare class MutationRateLimiter {
+    private readonly rrweb;
+    private readonly options;
+    private bucketSize;
+    private refillRate;
+    private mutationBuckets;
+    private loggedTracker;
+    constructor(rrweb: rrwebRecord, options?: {
+        bucketSize?: number;
+        refillRate?: number;
+        onBlockedNode?: (id: number, node: Node | null) => void;
+    });
+    private refillBuckets;
+    private getNodeOrRelevantParent;
+    private numberOfChanges;
+    throttleMutations: (event: eventWithTime) => eventWithTime | undefined;
+}

package/lib/src/extensions/sessionrecording-utils.js

@@ -0,0 +1,192 @@
+var __values = (this && this.__values) || function(o) {
+    var s = typeof Symbol === "function" && Symbol.iterator, m = s && o[s], i = 0;
+    if (m) return m.call(o);
+    if (o && typeof o.length === "number") return {
+        next: function () {
+            if (o && i >= o.length) o = void 0;
+            return { value: o && o[i++], done: !o };
+        }
+    };
+    throw new TypeError(s ? "Object is not iterable." : "Symbol.iterator is not defined.");
+};
+var __read = (this && this.__read) || function (o, n) {
+    var m = typeof Symbol === "function" && o[Symbol.iterator];
+    if (!m) return o;
+    var i = m.call(o), r, ar = [], e;
+    try {
+        while ((n === void 0 || n-- > 0) && !(r = i.next()).done) ar.push(r.value);
+    }
+    catch (error) { e = { error: error }; }
+    finally {
+        try {
+            if (r && !r.done && (m = i["return"])) m.call(i);
+        }
+        finally { if (e) throw e.error; }
+    }
+    return ar;
+};
+export var replacementImageURI = 'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNOCAwSDE2TDAgMTZWOEw4IDBaIiBmaWxsPSIjMkQyRDJEIi8+CjxwYXRoIGQ9Ik0xNiA4VjE2SDhMMTYgOFoiIGZpbGw9IiMyRDJEMkQiLz4KPC9zdmc+Cg==';
+export var FULL_SNAPSHOT_EVENT_TYPE = 2;
+export var META_EVENT_TYPE = 4;
+export var INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
+export var PLUGIN_EVENT_TYPE = 6;
+export var MUTATION_SOURCE_TYPE = 0;
+export var MAX_MESSAGE_SIZE = 5000000; // ~5mb
+/*
+ * Check whether a data payload is nearing 5mb. If it is, it checks the data for
+ * data URIs (the likely culprit for large payloads). If it finds data URIs, it either replaces
+ * it with a generic image (if it's an image) or removes it.
+ * @data {object} the rr-web data object
+ * @returns {object} the rr-web data object with data uris filtered out
+ */
+export function ensureMaxMessageSize(data) {
+    var e_1, _a;
+    var stringifiedData = JSON.stringify(data);
+    // Note: with compression, this limit may be able to be increased
+    // but we're assuming most of the size is from a data uri which
+    // is unlikely to be compressed further
+    if (stringifiedData.length > MAX_MESSAGE_SIZE) {
+        // Regex that matches the pattern for a dataURI with the shape 'data:{mime type};{encoding},{data}'. It:
+        // 1) Checks if the pattern starts with 'data:' (potentially, not at the start of the string)
+        // 2) Extracts the mime type of the data uri in the first group
+        // 3) Determines when the data URI ends.Depending on if it's used in the src tag or css, it can end with a ) or "
+        var dataURIRegex = /data:([\w/\-.]+);(\w+),([^)"]*)/gim;
+        var matches = stringifiedData.matchAll(dataURIRegex);
+        try {
+            for (var matches_1 = __values(matches), matches_1_1 = matches_1.next(); !matches_1_1.done; matches_1_1 = matches_1.next()) {
+                var match = matches_1_1.value;
+                if (match[1].toLocaleLowerCase().slice(0, 6) === 'image/') {
+                    stringifiedData = stringifiedData.replace(match[0], replacementImageURI);
+                }
+                else {
+                    stringifiedData = stringifiedData.replace(match[0], '');
+                }
+            }
+        }
+        catch (e_1_1) { e_1 = { error: e_1_1 }; }
+        finally {
+            try {
+                if (matches_1_1 && !matches_1_1.done && (_a = matches_1.return)) _a.call(matches_1);
+            }
+            finally { if (e_1) throw e_1.error; }
+        }
+    }
+    return { event: JSON.parse(stringifiedData), size: stringifiedData.length };
+}
+export var CONSOLE_LOG_PLUGIN_NAME = 'rrweb/console@1'; // The name of the rr-web plugin that emits console logs
+// Console logs can be really large. This function truncates large logs
+// It's a simple function that just truncates long strings.
+// TODO: Ideally this function would have better handling of objects + lists,
+// so they could still be rendered in a pretty way after truncation.
+export function truncateLargeConsoleLogs(_event) {
+    var event = _event;
+    var MAX_STRING_SIZE = 2000; // Maximum number of characters allowed in a string
+    var MAX_STRINGS_PER_LOG = 10; // A log can consist of multiple strings (e.g. consol.log('string1', 'string2'))
+    if (event &&
+        typeof event === 'object' &&
+        event.type === PLUGIN_EVENT_TYPE &&
+        typeof event.data === 'object' &&
+        event.data.plugin === CONSOLE_LOG_PLUGIN_NAME) {
+        // Note: event.data.payload.payload comes from rr-web, and is an array of strings
+        if (event.data.payload.payload.length > MAX_STRINGS_PER_LOG) {
+            event.data.payload.payload = event.data.payload.payload.slice(0, MAX_STRINGS_PER_LOG);
+            event.data.payload.payload.push('...[truncated]');
+        }
+        var updatedPayload = [];
+        for (var i = 0; i < event.data.payload.payload.length; i++) {
+            if (event.data.payload.payload[i] && // Value can be null
+                event.data.payload.payload[i].length > MAX_STRING_SIZE) {
+                updatedPayload.push(event.data.payload.payload[i].slice(0, MAX_STRING_SIZE) + '...[truncated]');
+            }
+            else {
+                updatedPayload.push(event.data.payload.payload[i]);
+            }
+        }
+        event.data.payload.payload = updatedPayload;
+        // Return original type
+        return _event;
+    }
+    return _event;
+}
+var MutationRateLimiter = /** @class */ (function () {
+    function MutationRateLimiter(rrweb, options) {
+        if (options === void 0) { options = {}; }
+        var _this = this;
+        var _a, _b;
+        this.rrweb = rrweb;
+        this.options = options;
+        this.bucketSize = 100;
+        this.refillRate = 10;
+        this.mutationBuckets = {};
+        this.loggedTracker = {};
+        this.refillBuckets = function () {
+            Object.keys(_this.mutationBuckets).forEach(function (key) {
+                _this.mutationBuckets[key] = _this.mutationBuckets[key] + _this.refillRate;
+                if (_this.mutationBuckets[key] >= _this.bucketSize) {
+                    delete _this.mutationBuckets[key];
+                }
+            });
+        };
+        this.getNodeOrRelevantParent = function (id) {
+            // For some nodes we know they are part of a larger tree such as an SVG.
+            // For those we want to block the entire node, not just the specific attribute
+            var node = _this.rrweb.mirror.getNode(id);
+            // Check if the node is an Element and then find the closest parent that is an SVG
+            if ((node === null || node === void 0 ? void 0 : node.nodeName) !== 'svg' && node instanceof Element) {
+                var closestSVG = node.closest('svg');
+                if (closestSVG) {
+                    return [_this.rrweb.mirror.getId(closestSVG), closestSVG];
+                }
+            }
+            return [id, node];
+        };
+        this.numberOfChanges = function (data) {
+            var _a, _b, _c, _d, _e, _f, _g, _h;
+            return (((_b = (_a = data.removes) === null || _a === void 0 ? void 0 : _a.length) !== null && _b !== void 0 ? _b : 0) +
+                ((_d = (_c = data.attributes) === null || _c === void 0 ? void 0 : _c.length) !== null && _d !== void 0 ? _d : 0) +
+                ((_f = (_e = data.texts) === null || _e === void 0 ? void 0 : _e.length) !== null && _f !== void 0 ? _f : 0) +
+                ((_h = (_g = data.adds) === null || _g === void 0 ? void 0 : _g.length) !== null && _h !== void 0 ? _h : 0));
+        };
+        this.throttleMutations = function (event) {
+            if (event.type !== INCREMENTAL_SNAPSHOT_EVENT_TYPE || event.data.source !== MUTATION_SOURCE_TYPE) {
+                return event;
+            }
+            var data = event.data;
+            var initialMutationCount = _this.numberOfChanges(data);
+            if (data.attributes) {
+                // Most problematic mutations come from attrs where the style or minor properties are changed rapidly
+                data.attributes = data.attributes.filter(function (attr) {
+                    var _a, _b, _c;
+                    var _d = __read(_this.getNodeOrRelevantParent(attr.id), 2), nodeId = _d[0], node = _d[1];
+                    if (_this.mutationBuckets[nodeId] === 0) {
+                        return false;
+                    }
+                    _this.mutationBuckets[nodeId] = (_a = _this.mutationBuckets[nodeId]) !== null && _a !== void 0 ? _a : _this.bucketSize;
+                    _this.mutationBuckets[nodeId] = Math.max(_this.mutationBuckets[nodeId] - 1, 0);
+                    if (_this.mutationBuckets[nodeId] === 0) {
+                        if (!_this.loggedTracker[nodeId]) {
+                            _this.loggedTracker[nodeId] = true;
+                            (_c = (_b = _this.options).onBlockedNode) === null || _c === void 0 ? void 0 : _c.call(_b, nodeId, node);
+                        }
+                    }
+                    return attr;
+                });
+            }
+            // Check if every part of the mutation is empty in which case there is nothing to do
+            var mutationCount = _this.numberOfChanges(data);
+            if (mutationCount === 0 && initialMutationCount !== mutationCount) {
+                // If we have modified the mutation count and the remaining count is 0, then we don't need the event.
+                return;
+            }
+            return event;
+        };
+        this.refillRate = (_a = this.options.refillRate) !== null && _a !== void 0 ? _a : this.refillRate;
+        this.bucketSize = (_b = this.options.bucketSize) !== null && _b !== void 0 ? _b : this.bucketSize;
+        setInterval(function () {
+            _this.refillBuckets();
+        }, 1000);
+    }
+    return MutationRateLimiter;
+}());
+export { MutationRateLimiter };
+//# sourceMappingURL=sessionrecording-utils.js.map

package/lib/src/extensions/sessionrecording-utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sessionrecording-utils.js","sourceRoot":"","sources":["../../../src/extensions/sessionrecording-utils.ts"],"names":[],"mappings":"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","sourcesContent":["import type {\n    KeepIframeSrcFn,\n    RecordPlugin,\n    SamplingStrategy,\n    blockClass,\n    eventWithTime,\n    hooksParam,\n    listenerHandler,\n    maskTextClass,\n    pluginEvent,\n    mutationCallbackParam,\n} from '@rrweb/types'\nimport type { Mirror, MaskInputOptions, MaskInputFn, MaskTextFn, SlimDOMOptions, DataURLOptions } from 'rrweb-snapshot'\n\nexport const replacementImageURI =\n    'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMTYiIGhlaWdodD0iMTYiIHZpZXdCb3g9IjAgMCAxNiAxNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHJlY3Qgd2lkdGg9IjE2IiBoZWlnaHQ9IjE2IiBmaWxsPSJibGFjayIvPgo8cGF0aCBkPSJNOCAwSDE2TDAgMTZWOEw4IDBaIiBmaWxsPSIjMkQyRDJEIi8+CjxwYXRoIGQ9Ik0xNiA4VjE2SDhMMTYgOFoiIGZpbGw9IiMyRDJEMkQiLz4KPC9zdmc+Cg=='\n\nexport const FULL_SNAPSHOT_EVENT_TYPE = 2\nexport const META_EVENT_TYPE = 4\nexport const INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3\nexport const PLUGIN_EVENT_TYPE = 6\nexport const MUTATION_SOURCE_TYPE = 0\n\nexport const MAX_MESSAGE_SIZE = 5000000 // ~5mb\n\nexport type rrwebRecord = {\n    (options: recordOptions<eventWithTime>): listenerHandler\n    addCustomEvent: (tag: string, payload: any) => void\n    takeFullSnapshot: () => void\n    mirror: Mirror\n}\n\nexport declare type recordOptions<T> = {\n    emit?: (e: T, isCheckout?: boolean) => void\n    checkoutEveryNth?: number\n    checkoutEveryNms?: number\n    blockClass?: blockClass\n    blockSelector?: string\n    ignoreClass?: string\n    maskTextClass?: maskTextClass\n    maskTextSelector?: string\n    maskAllInputs?: boolean\n    maskInputOptions?: MaskInputOptions\n    maskInputFn?: MaskInputFn\n    maskTextFn?: MaskTextFn\n    slimDOMOptions?: SlimDOMOptions | 'all' | true\n    ignoreCSSAttributes?: Set<string>\n    inlineStylesheet?: boolean\n    hooks?: hooksParam\n    // packFn?: PackFn\n    sampling?: SamplingStrategy\n    dataURLOptions?: DataURLOptions\n    recordCanvas?: boolean\n    recordCrossOriginIframes?: boolean\n    recordAfter?: 'DOMContentLoaded' | 'load'\n    userTriggeredOnInput?: boolean\n    collectFonts?: boolean\n    inlineImages?: boolean\n    plugins?: RecordPlugin[]\n    mousemoveWait?: number\n    keepIframeSrcFn?: KeepIframeSrcFn\n    // errorHandler?: ErrorHandler\n}\n\n/*\n * Check whether a data payload is nearing 5mb. If it is, it checks the data for\n * data URIs (the likely culprit for large payloads). If it finds data URIs, it either replaces\n * it with a generic image (if it's an image) or removes it.\n * @data {object} the rr-web data object\n * @returns {object} the rr-web data object with data uris filtered out\n */\nexport function ensureMaxMessageSize(data: eventWithTime): { event: eventWithTime; size: number } {\n    let stringifiedData = JSON.stringify(data)\n    // Note: with compression, this limit may be able to be increased\n    // but we're assuming most of the size is from a data uri which\n    // is unlikely to be compressed further\n    if (stringifiedData.length > MAX_MESSAGE_SIZE) {\n        // Regex that matches the pattern for a dataURI with the shape 'data:{mime type};{encoding},{data}'. It:\n        // 1) Checks if the pattern starts with 'data:' (potentially, not at the start of the string)\n        // 2) Extracts the mime type of the data uri in the first group\n        // 3) Determines when the data URI ends.Depending on if it's used in the src tag or css, it can end with a ) or \"\n        const dataURIRegex = /data:([\\w/\\-.]+);(\\w+),([^)\"]*)/gim\n        const matches = stringifiedData.matchAll(dataURIRegex)\n        for (const match of matches) {\n            if (match[1].toLocaleLowerCase().slice(0, 6) === 'image/') {\n                stringifiedData = stringifiedData.replace(match[0], replacementImageURI)\n            } else {\n                stringifiedData = stringifiedData.replace(match[0], '')\n            }\n        }\n    }\n    return { event: JSON.parse(stringifiedData), size: stringifiedData.length }\n}\n\nexport const CONSOLE_LOG_PLUGIN_NAME = 'rrweb/console@1' // The name of the rr-web plugin that emits console logs\n\n// Console logs can be really large. This function truncates large logs\n// It's a simple function that just truncates long strings.\n// TODO: Ideally this function would have better handling of objects + lists,\n// so they could still be rendered in a pretty way after truncation.\nexport function truncateLargeConsoleLogs(_event: eventWithTime) {\n    const event = _event as pluginEvent<{ payload: string[] }>\n\n    const MAX_STRING_SIZE = 2000 // Maximum number of characters allowed in a string\n    const MAX_STRINGS_PER_LOG = 10 // A log can consist of multiple strings (e.g. consol.log('string1', 'string2'))\n\n    if (\n        event &&\n        typeof event === 'object' &&\n        event.type === PLUGIN_EVENT_TYPE &&\n        typeof event.data === 'object' &&\n        event.data.plugin === CONSOLE_LOG_PLUGIN_NAME\n    ) {\n        // Note: event.data.payload.payload comes from rr-web, and is an array of strings\n        if (event.data.payload.payload.length > MAX_STRINGS_PER_LOG) {\n            event.data.payload.payload = event.data.payload.payload.slice(0, MAX_STRINGS_PER_LOG)\n            event.data.payload.payload.push('...[truncated]')\n        }\n        const updatedPayload = []\n        for (let i = 0; i < event.data.payload.payload.length; i++) {\n            if (\n                event.data.payload.payload[i] && // Value can be null\n                event.data.payload.payload[i].length > MAX_STRING_SIZE\n            ) {\n                updatedPayload.push(event.data.payload.payload[i].slice(0, MAX_STRING_SIZE) + '...[truncated]')\n            } else {\n                updatedPayload.push(event.data.payload.payload[i])\n            }\n        }\n        event.data.payload.payload = updatedPayload\n        // Return original type\n        return _event\n    }\n    return _event\n}\n\nexport class MutationRateLimiter {\n    private bucketSize = 100\n    private refillRate = 10\n    private mutationBuckets: Record<string, number> = {}\n    private loggedTracker: Record<string, boolean> = {}\n\n    constructor(\n        private readonly rrweb: rrwebRecord,\n        private readonly options: {\n            bucketSize?: number\n            refillRate?: number\n            onBlockedNode?: (id: number, node: Node | null) => void\n        } = {}\n    ) {\n        this.refillRate = this.options.refillRate ?? this.refillRate\n        this.bucketSize = this.options.bucketSize ?? this.bucketSize\n        setInterval(() => {\n            this.refillBuckets()\n        }, 1000)\n    }\n\n    private refillBuckets = () => {\n        Object.keys(this.mutationBuckets).forEach((key) => {\n            this.mutationBuckets[key] = this.mutationBuckets[key] + this.refillRate\n\n            if (this.mutationBuckets[key] >= this.bucketSize) {\n                delete this.mutationBuckets[key]\n            }\n        })\n    }\n\n    private getNodeOrRelevantParent = (id: number): [number, Node | null] => {\n        // For some nodes we know they are part of a larger tree such as an SVG.\n        // For those we want to block the entire node, not just the specific attribute\n\n        const node = this.rrweb.mirror.getNode(id)\n\n        // Check if the node is an Element and then find the closest parent that is an SVG\n        if (node?.nodeName !== 'svg' && node instanceof Element) {\n            const closestSVG = node.closest('svg')\n\n            if (closestSVG) {\n                return [this.rrweb.mirror.getId(closestSVG), closestSVG]\n            }\n        }\n\n        return [id, node]\n    }\n\n    private numberOfChanges = (data: Partial<mutationCallbackParam>) => {\n        return (\n            (data.removes?.length ?? 0) +\n            (data.attributes?.length ?? 0) +\n            (data.texts?.length ?? 0) +\n            (data.adds?.length ?? 0)\n        )\n    }\n\n    public throttleMutations = (event: eventWithTime) => {\n        if (event.type !== INCREMENTAL_SNAPSHOT_EVENT_TYPE || event.data.source !== MUTATION_SOURCE_TYPE) {\n            return event\n        }\n\n        const data = event.data as Partial<mutationCallbackParam>\n        const initialMutationCount = this.numberOfChanges(data)\n\n        if (data.attributes) {\n            // Most problematic mutations come from attrs where the style or minor properties are changed rapidly\n            data.attributes = data.attributes.filter((attr) => {\n                const [nodeId, node] = this.getNodeOrRelevantParent(attr.id)\n\n                if (this.mutationBuckets[nodeId] === 0) {\n                    return false\n                }\n\n                this.mutationBuckets[nodeId] = this.mutationBuckets[nodeId] ?? this.bucketSize\n                this.mutationBuckets[nodeId] = Math.max(this.mutationBuckets[nodeId] - 1, 0)\n\n                if (this.mutationBuckets[nodeId] === 0) {\n                    if (!this.loggedTracker[nodeId]) {\n                        this.loggedTracker[nodeId] = true\n                        this.options.onBlockedNode?.(nodeId, node)\n                    }\n                }\n\n                return attr\n            })\n        }\n\n        // Check if every part of the mutation is empty in which case there is nothing to do\n        const mutationCount = this.numberOfChanges(data)\n\n        if (mutationCount === 0 && initialMutationCount !== mutationCount) {\n            // If we have modified the mutation count and the remaining count is 0, then we don't need the event.\n            return\n        }\n        return event\n    }\n}\n"]}

package/lib/src/extensions/sessionrecording.d.ts

@@ -0,0 +1,45 @@
+import { rrwebRecord } from './sessionrecording-utils';
+import { PostHog } from '../posthog-core';
+import { DecideResponse } from '../types';
+import type { eventWithTime, listenerHandler } from '@rrweb/types';
+export declare const RECORDING_IDLE_ACTIVITY_TIMEOUT_MS: number;
+export declare const RECORDING_MAX_EVENT_SIZE: number;
+export declare const RECORDING_BUFFER_TIMEOUT = 2000;
+export declare const SESSION_RECORDING_BATCH_KEY = "sessionRecording";
+export declare class SessionRecording {
+    private instance;
+    private emit;
+    private endpoint;
+    private windowId;
+    private sessionId;
+    private lastActivityTimestamp;
+    private flushBufferTimer?;
+    private buffer?;
+    private mutationRateLimiter?;
+    captureStarted: boolean;
+    snapshots: any[];
+    stopRrweb: listenerHandler | undefined;
+    receivedDecide: boolean;
+    rrwebRecord: rrwebRecord | undefined;
+    recorderVersion?: string;
+    isIdle: boolean;
+    constructor(instance: PostHog);
+    startRecordingIfEnabled(): void;
+    started(): boolean;
+    stopRecording(): void;
+    isRecordingEnabled(): boolean;
+    isConsoleLogCaptureEnabled(): boolean;
+    getRecordingVersion(): any;
+    afterDecideResponse(response: DecideResponse): void;
+    log(message: string, level?: 'log' | 'warn' | 'error'): void;
+    private startCaptureAndTrySendingQueuedSnapshots;
+    private _startCapture;
+    private _isInteractiveEvent;
+    private _updateWindowAndSessionIds;
+    private _tryTakeFullSnapshot;
+    private _onScriptLoaded;
+    onRRwebEmit(rawEvent: eventWithTime): void;
+    private _flushBuffer;
+    private _captureSnapshotBuffered;
+    private _captureSnapshot;
+}