ref(replay): Explicitly clear event buffer queue on checkout

Author: mydea

packages/replay/src/eventBuffer/EventBufferArray.ts

@@ -30,16 +30,16 @@ export class EventBufferArray implements EventBuffer {
   }
 
   /** @inheritdoc */
-  public async addEvent(event: RecordingEvent, isCheckout?: boolean): Promise<AddEventResult> {
-    if (isCheckout) {
-      this._events = [event];
-      return;
-    }
-
+  public async addEvent(event: RecordingEvent): Promise<AddEventResult> {
     this._events.push(event);
     return;
   }
 
+  /** @inheritdoc */
+  public async clear(): Promise<void> {
+    this._events = [];
+  }
+
   /** @inheritdoc */
   public finish(): Promise<string> {
     return new Promise<string>(resolve => {

packages/replay/src/eventBuffer/EventBufferCompressionWorker.ts

@@ -79,25 +79,21 @@ export class EventBufferCompressionWorker implements EventBuffer {
    *
    * Returns true if event was successfuly received and processed by worker.
    */
-  public async addEvent(event: RecordingEvent, isCheckout?: boolean): Promise<AddEventResult> {
-    if (isCheckout) {
-      // This event is a checkout, make sure worker buffer is cleared before
-      // proceeding.
-      await this._postMessage({
-        id: this._getAndIncrementId(),
-        method: 'init',
-        args: [],
-      });
-    }
-
-    // Don't store checkout events in `_pendingEvents` because they are too large
-    if (!isCheckout) {
-      this._pendingEvents.push(event);
-    }
-
+  public addEvent(event: RecordingEvent): Promise<AddEventResult> {
+    this.pendingEvents.push(event);
     return this._sendEventToWorker(event);
   }
 
+  /** @inheritdoc */
+  public clear(): Promise<void> {
+    // This will clear the queue of events that are waiting to be compressed
+    return this._postMessage({
+      id: this._getAndIncrementId(),
+      method: 'init',
+      args: [],
+    });
+  }
+
   /**
    * Finish the event buffer and return the compressed data.
    */

packages/replay/src/eventBuffer/EventBufferProxy.ts

@@ -39,13 +39,14 @@ export class EventBufferProxy implements EventBuffer {
     this._compression.destroy();
   }
 
-  /**
-   * Add an event to the event buffer.
-   *
-   * Returns true if event was successfully added.
-   */
-  public addEvent(event: RecordingEvent, isCheckout?: boolean): Promise<AddEventResult> {
-    return this._used.addEvent(event, isCheckout);
+  /** @inheritdoc */
+  public addEvent(event: RecordingEvent): Promise<AddEventResult> {
+    return this._used.addEvent(event);
+  }
+
+  /** @inheritdoc */
+  public clear(): Promise<void> {
+    return this._used.clear();
   }
 
   /** @inheritDoc */

packages/replay/src/types.ts

@@ -220,7 +220,12 @@ export interface EventBuffer {
    *
    * Returns a promise that resolves if the event was successfully added, else rejects.
    */
-  addEvent(event: RecordingEvent, isCheckout?: boolean): Promise<AddEventResult>;
+  addEvent(event: RecordingEvent): Promise<AddEventResult>;
+
+  /**
+   * Clear any pending events from the buffer.
+   */
+  clear(): Promise<void>;
 
   /**
    * Clears and returns the contents of the buffer.

packages/replay/src/util/addEvent.ts

@@ -9,7 +9,9 @@ export async function addEvent(
   event: RecordingEvent,
   isCheckout?: boolean,
 ): Promise<AddEventResult | null> {
-  if (!replay.eventBuffer) {
+  const { eventBuffer } = replay;
+
+  if (!eventBuffer) {
     // This implies that `_isEnabled` is false
     return null;
   }
@@ -39,5 +41,9 @@ export async function addEvent(
     replay.getContext().earliestEvent = timestampInMs;
   }
 
-  return replay.eventBuffer.addEvent(event, isCheckout);
+  if (isCheckout) {
+    await eventBuffer.clear();
+  }
+
+  return eventBuffer.addEvent(event);
 }

packages/replay/test/unit/eventBuffer.test.ts

@@ -27,7 +27,9 @@ describe('Unit | eventBuffer', () => {
       buffer.addEvent(TEST_EVENT);
       buffer.addEvent(TEST_EVENT);
 
-      buffer.addEvent(TEST_EVENT, true);
+      // Checkout triggers clear
+      buffer.clear();
+      buffer.addEvent(TEST_EVENT);
       const result = await buffer.finish();
 
       expect(result).toEqual(JSON.stringify([TEST_EVENT]));
@@ -85,8 +87,9 @@ describe('Unit | eventBuffer', () => {
       await buffer.addEvent(TEST_EVENT);
       await buffer.addEvent(TEST_EVENT);
 
-      // This should clear previous buffer
-      await buffer.addEvent({ ...TEST_EVENT, type: 2 }, true);
+      // Checkout triggers clear
+      await buffer.clear();
+      await buffer.addEvent({ ...TEST_EVENT, type: 2 });
 
       const result = await buffer.finish();
       expect(result).toBeInstanceOf(Uint8Array);