@faststats/web 0.9.0 → 0.10.0

package/README.md

@@ -78,6 +78,37 @@ since the last delivered checkpoint. The collector must accept successive events
 for the same visitor and URL; deploy the removal of its five-second debounce
 before releasing this SDK.
 
+### Network recording in session replay
+
+Network recording is disabled by default. Enable it with
+`sessionReplay({ recordNetwork: true })`. This records resource URLs and timing
+data using rrweb's network plugin. Headers and bodies are not recorded by default.
+FastStats collection endpoints (including a custom `baseUrl`) are always excluded
+to prevent recording replay uploads recursively.
+
+Use `networkOptions` to configure rrweb's plugin, including filtering or redaction:
+
+```ts
+sessionReplay({
+	recordNetwork: true,
+	networkOptions: {
+		initiatorTypes: ["fetch", "xmlhttprequest"],
+		transformRequestFn: (request) => {
+			const url = new URL(request.name);
+			if (url.pathname.startsWith("/private/")) return;
+			url.search = "";
+			request.name = url.toString();
+			return request;
+		},
+	},
+});
+```
+
+`recordHeaders`, `recordBody`, and `recordInitialRequests` can also be set in
+`networkOptions`. Redact sensitive data before enabling headers or bodies.
+Network options alone do not enable recording. The same replay options are
+available through the React and Nuxt integrations.
+
 ### Custom extensions
 
 An extension registers only the lifecycle hooks it needs. Hook failures are

package/dist/error.js

@@ -3,7 +3,7 @@ import { r as getSessionContext, t as sendData } from "./chunks/send-data-Dplz7m
 import { t as getAnonymousId } from "./chunks/identifiers-xX7o7oZz.js";
 //#region src/error.ts
 const SDK_NAME = "@faststats/web";
-const SDK_VERSION = "0.9.0";
+const SDK_VERSION = "0.10.0";
 function errorTracking(options = {}) {
 	return {
 		name: "error-tracking",

package/dist/replay.d.ts

@@ -1,7 +1,8 @@
 import { t as AnalyticsExtension } from "./chunks/extensions-DW7tJY0T.js";
 import { record } from "@rrweb/record";
 import { LogLevel } from "@rrweb/rrweb-plugin-console-record";
-//#region ../../node_modules/.bun/@rrweb+types@2.1.4/node_modules/@rrweb/types/dist/index.d.ts
+import { NetworkRecordOptions } from "@rrweb/rrweb-plugin-network-record";
+//#region ../../node_modules/.bun/@rrweb+types@2.1.6/node_modules/@rrweb/types/dist/index.d.ts
 declare global {
   interface Window {
     FontFace: typeof FontFace;
@@ -45,6 +46,10 @@ export interface ReplayTrackerOptions {
   consoleLevel?: LogLevel[];
   consoleLengthThreshold?: number;
   consoleStringLengthLimit?: number;
+  /** Opt in to network recording. Headers and bodies are off by default. */
+  recordNetwork?: boolean;
+  /** rrweb network options; only used when recordNetwork is true. */
+  networkOptions?: NetworkRecordOptions;
   mutationThrottle?: ReplayMutationThrottleOptions;
 }
 export type SessionReplayExtensionOptions = Omit<ReplayTrackerOptions, "siteKey" | "baseUrl" | "debug" | "trackHash" | "cookieless">;
@@ -80,11 +85,10 @@ export default class ReplayTracker {
   private stopRecording?;
   private activeSessionId;
   private sending;
-  private inFlightBatch;
   private queuedFlush;
   private unsubscribeRotation?;
   private lastCookielessMode;
-  private terminalFlushRequested;
+  private needsFinalization;
   private initialFlushPending;
   private overflowed;
   private replayEventSequence;
@@ -95,13 +99,14 @@ export default class ReplayTracker {
   private clearQueues;
   private dropMinLengthBlockedBatches;
   private unblockSessionBatches;
-  private finalizeSessionPending;
+  private finalizeSession;
   private nextBatchSequence;
   setCookielessMode(cookieless: boolean): void;
   start(): void;
   trackPageChange(url?: string): void;
   onPageHidden(persisted?: boolean, terminal?: boolean): void;
   onPageShow(persisted?: boolean): void;
+  private recordingPlugins;
   private beginRecording;
   stop(discard?: boolean): void;
   private onSessionRotated;
@@ -123,6 +128,7 @@ export default class ReplayTracker {
   private removePending;
   private enqueueBatch;
   private flush;
+  private sendPending;
   private scheduleRetry;
   private retryDelay;
   private sendBatch;

package/dist/replay.js

@@ -3,6 +3,7 @@ import { i as onSessionRotated, l as setStorageItem, n as createId, o as touchAc
 import { t as getAnonymousId } from "./chunks/identifiers-xX7o7oZz.js";
 import { record } from "@rrweb/record";
 import { getRecordConsolePlugin } from "@rrweb/rrweb-plugin-console-record";
+import { getRecordNetworkPlugin } from "@rrweb/rrweb-plugin-network-record";
 //#region src/replay-mutation-throttler.ts
 const INCREMENTAL_SNAPSHOT_EVENT_TYPE = 3;
 const MUTATION_SOURCE_TYPE = 0;
@@ -117,11 +118,10 @@ var ReplayTracker = class {
 	stopRecording;
 	activeSessionId = "";
 	sending = false;
-	inFlightBatch = null;
 	queuedFlush = null;
 	unsubscribeRotation;
 	lastCookielessMode;
-	terminalFlushRequested = false;
+	needsFinalization = false;
 	initialFlushPending = true;
 	overflowed = false;
 	replayEventSequence = 0;
@@ -152,12 +152,14 @@ var ReplayTracker = class {
 		this.minLengthFlushTask = null;
 	}
 	clearQueues() {
+		this.needsFinalization = false;
 		this.events.length = 0;
 		this.queuedEventsSizeBytes = 0;
 		this.pending.length = 0;
 		this.pendingSizeBytes = 0;
 	}
 	dropMinLengthBlockedBatches() {
+		this.needsFinalization = false;
 		for (let index = this.pending.length - 1; index >= 0; index--) {
 			const batch = this.pending[index];
 			if (batch && this.minLengthBlockedBatches.has(batch)) this.removePending(batch);
@@ -166,18 +168,9 @@ var ReplayTracker = class {
 	unblockSessionBatches(sessionId) {
 		for (const batch of this.pending) if (batch.sessionId === sessionId) this.minLengthBlockedBatches.delete(batch);
 	}
-	finalizeSessionPending(context, flushReason) {
-		const batch = this.pending.findLast((candidate) => candidate.sessionId === context.sessionId);
-		if (!batch || batch.isFinal) return;
-		if (batch === this.inFlightBatch) {
-			this.enqueueBatch(this.createBatch([], context, true, flushReason));
-			return;
-		}
-		const previousSize = this.batchSizeBytes(batch);
-		batch.isFinal = true;
-		batch.flushReason = flushReason;
-		batchSizeCache.delete(batch);
-		this.pendingSizeBytes += this.batchSizeBytes(batch) - previousSize;
+	finalizeSession(context, flushReason) {
+		if (!this.needsFinalization) return;
+		this.enqueueBatch(this.createBatch([], context, true, flushReason));
 	}
 	nextBatchSequence(context) {
 		const key = `faststats_replay_batch_sequence_${this.options.siteKey}_${context.windowId}`;
@@ -204,7 +197,6 @@ var ReplayTracker = class {
 		if (this.started || typeof window === "undefined") return;
 		this.started = true;
 		this.disposed = false;
-		this.terminalFlushRequested = false;
 		this.initialFlushPending = true;
 		this.overflowed = false;
 		this.replayEventSequence = 0;
@@ -243,13 +235,13 @@ var ReplayTracker = class {
 			this.requestTerminalFlush("pageHidden");
 			return;
 		}
-		this.flush(false, false, "pageHidden");
+		this.flush(true, false, "pageHidden");
 	}
 	onPageShow(persisted = false) {
 		if (!persisted || !this.started) return;
 		if (this.pending.length > 0) this.flush(false, false, "pageShow");
 	}
-	beginRecording() {
+	recordingPlugins() {
 		const plugins = [];
 		if (this.options.recordConsole === true) plugins.push(getRecordConsolePlugin({
 			level: this.options.consoleLevel ?? [
@@ -265,6 +257,25 @@ var ReplayTracker = class {
 				stringLengthLimit: this.options.consoleStringLengthLimit ?? 500
 			}
 		}));
+		if (this.options.recordNetwork === true) {
+			const options = this.options.networkOptions;
+			const base = resolveBaseUrl(this.options.baseUrl, ANALYTICS_BASE);
+			const endpoints = new Set(Object.values(URLS).map((path) => {
+				const url = new URL(`${base}${path}`, window.location.href);
+				return `${url.origin}${url.pathname}`;
+			}));
+			plugins.push(getRecordNetworkPlugin({
+				...options,
+				transformRequestFn: (request) => {
+					const url = new URL(request.name, window.location.href);
+					if (endpoints.has(`${url.origin}${url.pathname}`)) return;
+					return options?.transformRequestFn ? options.transformRequestFn(request) : request;
+				}
+			}));
+		}
+		return plugins;
+	}
+	beginRecording() {
 		const stop = record({
 			emit: this.onEvent,
 			sampling: this.options.sampling ?? {
@@ -297,7 +308,7 @@ var ReplayTracker = class {
 			maskTextSelector: this.options.maskTextSelector,
 			checkoutEveryNms: this.options.checkoutEveryNms ?? 3e5,
 			checkoutEveryNth: this.options.checkoutEveryNth,
-			plugins
+			plugins: this.recordingPlugins()
 		});
 		this.stopRecording = stop;
 	}
@@ -342,8 +353,9 @@ var ReplayTracker = class {
 			isFinal: true,
 			flushReason: "sessionRotate"
 		});
-		this.finalizeSessionPending(prev, "sessionRotate");
+		this.finalizeSession(prev, "sessionRotate");
 		this.unblockSessionBatches(prev.sessionId);
+		this.needsFinalization = false;
 		this.activeSessionId = next.sessionId;
 		this.resetSessionTiming(next);
 		this.beginReplayStream();
@@ -407,8 +419,6 @@ var ReplayTracker = class {
 		this.requestTerminalFlush("unload");
 	};
 	requestTerminalFlush(reason) {
-		if (this.terminalFlushRequested) return;
-		this.terminalFlushRequested = true;
 		if (!this.hasReachedMinLength()) {
 			this.events.length = 0;
 			this.queuedEventsSizeBytes = 0;
@@ -530,6 +540,7 @@ var ReplayTracker = class {
 			this.stopRecording = void 0;
 			return;
 		}
+		this.needsFinalization = !batch.isFinal;
 		this.pending.push(batch);
 		this.pendingSizeBytes += size;
 	}
@@ -542,12 +553,15 @@ var ReplayTracker = class {
 			flushReason,
 			maxBatchSizeBytes: lowLatency ? this.maxLowLatencyBatchSizeBytes : this.maxBatchSizeBytes
 		});
-		if (isFinal) this.finalizeSessionPending(context, flushReason);
+		if (isFinal) this.finalizeSession(context, flushReason);
 		if (this.pending.length === 0) return;
 		if (isFinal) for (const batch of this.pending) this.minLengthBlockedBatches.delete(batch);
 		else if (!rotation && flushReason !== "sessionRotate" && this.hasReachedMinLength()) this.unblockSessionBatches(context.sessionId);
+		await this.sendPending(lowLatency, lowLatency && isFinal);
+	}
+	async sendPending(lowLatency, bypassRetryDelay) {
 		if (this.retryTask) {
-			if (!lowLatency || !isFinal) return;
+			if (!bypassRetryDelay) return;
 			clearTimeout(this.retryTask);
 			this.retryTask = null;
 		}
@@ -555,8 +569,7 @@ var ReplayTracker = class {
 			const queued = this.queuedFlush;
 			this.queuedFlush = {
 				lowLatency: (queued?.lowLatency ?? false) || lowLatency,
-				isFinal: queued?.isFinal || isFinal,
-				flushReason: isFinal ? flushReason : queued?.flushReason ?? flushReason
+				bypassRetryDelay: (queued?.bypassRetryDelay ?? false) || bypassRetryDelay
 			};
 			return;
 		}
@@ -565,14 +578,7 @@ var ReplayTracker = class {
 			while (this.pending.length > 0) {
 				const batch = this.pending[0];
 				if (this.minLengthBlockedBatches.has(batch)) break;
-				this.inFlightBatch = batch;
-				let sent;
-				try {
-					sent = await this.sendBatch(batch, lowLatency);
-				} finally {
-					if (this.inFlightBatch === batch) this.inFlightBatch = null;
-				}
-				if (!sent) {
+				if (!await this.sendBatch(batch, lowLatency)) {
 					this.log(`Failed to send replay batch ${batch.sequence}`);
 					if (!this.disposed) this.scheduleRetry();
 					break;
@@ -586,7 +592,7 @@ var ReplayTracker = class {
 			if (this.queuedFlush) {
 				const queued = this.queuedFlush;
 				this.queuedFlush = null;
-				this.flush(queued.lowLatency, queued.isFinal, queued.flushReason);
+				this.sendPending(queued.lowLatency, queued.bypassRetryDelay);
 			}
 		}
 	}

package/package.json

@@ -42,7 +42,7 @@
 	"publishConfig": {
 		"access": "public"
 	},
-	"version": "0.9.0",
+	"version": "0.10.0",
 	"scripts": {
 		"build": "tsdown && bun run check-size",
 		"dev": "bun run build",
@@ -51,14 +51,15 @@
 		"check-size": "node scripts/check-bundle-size.mjs"
 	},
 	"devDependencies": {
-		"@rrweb/types": "^2.1.4",
+		"@rrweb/types": "^2.1.6",
 		"@types/bun": "^1.4.2",
 		"tsdown": "^0.23.0",
 		"typescript": "^7.0.2"
 	},
 	"dependencies": {
-		"@rrweb/record": "^2.1.4",
-		"@rrweb/rrweb-plugin-console-record": "^2.1.4",
+		"@rrweb/record": "^2.1.6",
+		"@rrweb/rrweb-plugin-console-record": "^2.1.6",
+		"@rrweb/rrweb-plugin-network-record": "^2.1.6",
 		"web-vitals": "^6.2.1"
 	}
 }