posthog-js-lite 3.0.0-beta.1 → 3.0.0-beta.2

package/CHANGELOG.md

@@ -1,3 +1,9 @@
+# 3.0.0-beta.2 - 2024-03-12
+
+- `flushAsync` and `shutdownAsync` are removed with `flush` and `shutdown` now being the async methods.
+- Fixed an issue where `shutdownAsync` would potentially exit early if a flush was already in progress
+- Flushes will now try to flush up to `maxBatchSize` (default 100) in one go
+
 # 3.0.0-beta.1 - 2024-03-04
 
 - Removes the `enable` option. You can now specify `defaultOptIn: false` to start the SDK opted out of tracking

package/lib/index.cjs.js

@@ -946,6 +946,7 @@ function isPostHogFetchError(err) {
 }
 class PostHogCoreStateless {
     constructor(apiKey, options) {
+        this.flushPromise = null;
         this.disableGeoip = true;
         this.disabled = false;
         this.defaultOptIn = true;
@@ -957,6 +958,7 @@ class PostHogCoreStateless {
         this.apiKey = apiKey;
         this.host = removeTrailingSlash(options?.host || 'https://app.posthog.com');
         this.flushAt = options?.flushAt ? Math.max(options?.flushAt, 1) : 20;
+        this.maxBatchSize = Math.max(this.flushAt, options?.maxBatchSize ?? 100);
         this.flushInterval = options?.flushInterval ?? 10000;
         this.captureMode = options?.captureMode || 'form';
         // If enable is explicitly set to false we override the optout
@@ -1035,9 +1037,12 @@ class PostHogCoreStateless {
     addPendingPromise(promise) {
         const promiseUUID = uuidv7();
         this.pendingPromises[promiseUUID] = promise;
-        promise.finally(() => {
+        promise
+            .catch(() => { })
+            .finally(() => {
             delete this.pendingPromises[promiseUUID];
         });
+        return promise;
     }
     /***
      *** TRACKING
@@ -1217,75 +1222,90 @@ class PostHogCoreStateless {
             this._events.emit(type, message);
             // Flush queued events if we meet the flushAt length
             if (queue.length >= this.flushAt) {
-                this.flush();
+                this.flushBackground();
             }
             if (this.flushInterval && !this._flushTimer) {
-                this._flushTimer = safeSetTimeout(() => this.flush(), this.flushInterval);
+                this._flushTimer = safeSetTimeout(() => this.flushBackground(), this.flushInterval);
             }
         });
     }
-    async flushAsync() {
-        await this._initPromise;
-        return new Promise((resolve, reject) => {
-            this.flush((err, data) => {
-                return err ? reject(err) : resolve(data);
+    clearFlushTimer() {
+        if (this._flushTimer) {
+            clearTimeout(this._flushTimer);
+            this._flushTimer = undefined;
+        }
+    }
+    /**
+     * Helper for flushing the queue in the background
+     * Avoids unnecessary promise errors
+     */
+    flushBackground() {
+        void this.flush().catch(() => { });
+    }
+    async flush() {
+        if (!this.flushPromise) {
+            this.flushPromise = this._flush().finally(() => {
+                this.flushPromise = null;
             });
-        });
+            this.addPendingPromise(this.flushPromise);
+        }
+        return this.flushPromise;
     }
-    flush(callback) {
-        this.wrap(() => {
-            if (this._flushTimer) {
-                clearTimeout(this._flushTimer);
-                this._flushTimer = null;
-            }
-            const queue = this.getPersistedProperty(PostHogPersistedProperty.Queue) || [];
-            if (!queue.length) {
-                return callback?.();
+    async _flush() {
+        this.clearFlushTimer();
+        await this._initPromise;
+        const queue = this.getPersistedProperty(PostHogPersistedProperty.Queue) || [];
+        if (!queue.length) {
+            return [];
+        }
+        const items = queue.slice(0, this.maxBatchSize);
+        const messages = items.map((item) => item.message);
+        const persistQueueChange = () => {
+            const refreshedQueue = this.getPersistedProperty(PostHogPersistedProperty.Queue) || [];
+            this.setPersistedProperty(PostHogPersistedProperty.Queue, refreshedQueue.slice(items.length));
+        };
+        const data = {
+            api_key: this.apiKey,
+            batch: messages,
+            sent_at: currentISOTime(),
+        };
+        // Don't set the user agent if we're not on a browser. The latest spec allows
+        // the User-Agent header (see https://fetch.spec.whatwg.org/#terminology-headers
+        // and https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/setRequestHeader),
+        // but browsers such as Chrome and Safari have not caught up.
+        this.getCustomUserAgent();
+        const payload = JSON.stringify(data);
+        const url = this.captureMode === 'form'
+            ? `${this.host}/e/?ip=1&_=${currentTimestamp()}&v=${this.getLibraryVersion()}`
+            : `${this.host}/batch/`;
+        const fetchOptions = this.captureMode === 'form'
+            ? {
+                method: 'POST',
+                mode: 'no-cors',
+                credentials: 'omit',
+                headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
+                body: `data=${encodeURIComponent(LZString.compressToBase64(payload))}&compression=lz64`,
             }
-            const items = queue.splice(0, this.flushAt);
-            this.setPersistedProperty(PostHogPersistedProperty.Queue, queue);
-            const messages = items.map((item) => item.message);
-            const data = {
-                api_key: this.apiKey,
-                batch: messages,
-                sent_at: currentISOTime(),
+            : {
+                method: 'POST',
+                headers: { 'Content-Type': 'application/json' },
+                body: payload,
             };
-            const done = (err) => {
-                if (err) {
-                    this._events.emit('error', err);
-                }
-                callback?.(err, messages);
-                this._events.emit('flush', messages);
-            };
-            // Don't set the user agent if we're not on a browser. The latest spec allows
-            // the User-Agent header (see https://fetch.spec.whatwg.org/#terminology-headers
-            // and https://developer.mozilla.org/en-US/docs/Web/API/XMLHttpRequest/setRequestHeader),
-            // but browsers such as Chrome and Safari have not caught up.
-            this.getCustomUserAgent();
-            const payload = JSON.stringify(data);
-            const url = this.captureMode === 'form'
-                ? `${this.host}/e/?ip=1&_=${currentTimestamp()}&v=${this.getLibraryVersion()}`
-                : `${this.host}/batch/`;
-            const fetchOptions = this.captureMode === 'form'
-                ? {
-                    method: 'POST',
-                    mode: 'no-cors',
-                    credentials: 'omit',
-                    headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
-                    body: `data=${encodeURIComponent(LZString.compressToBase64(payload))}&compression=lz64`,
-                }
-                : {
-                    method: 'POST',
-                    headers: { 'Content-Type': 'application/json' },
-                    body: payload,
-                };
-            const requestPromise = this.fetchWithRetry(url, fetchOptions);
-            this.addPendingPromise(requestPromise
-                .then(() => done())
-                .catch((err) => {
-                done(err);
-            }));
-        });
+        try {
+            await this.fetchWithRetry(url, fetchOptions);
+        }
+        catch (err) {
+            // depending on the error type, eg a malformed JSON or broken queue, it'll always return an error
+            // and this will be an endless loop, in this case, if the error isn't a network issue, we always remove the items from the queue
+            if (!(err instanceof PostHogFetchNetworkError)) {
+                persistQueueChange();
+            }
+            this._events.emit('error', err);
+            throw err;
+        }
+        persistQueueChange();
+        this._events.emit('flush', messages);
+        return messages;
     }
     async fetchWithRetry(url, options, retryOptions, requestTimeout) {
         var _a;
@@ -1316,15 +1336,12 @@ class PostHogCoreStateless {
             return res;
         }, { ...this._retryOptions, ...retryOptions });
     }
-    async shutdownAsync(shutdownTimeoutMs) {
+    async shutdown(shutdownTimeoutMs = 30000) {
         await this._initPromise;
-        clearTimeout(this._flushTimer);
+        this.clearFlushTimer();
         try {
-            await Promise.all(Object.values(this.pendingPromises).map((x) => x.catch(() => {
-                // ignore errors as we are shutting down and can't deal with them anyways.
-            })));
-            const timeout = shutdownTimeoutMs ?? 30000;
-            const startTimeWithDelay = Date.now() + timeout;
+            await Promise.all(Object.values(this.pendingPromises));
+            const startTimeWithDelay = Date.now() + shutdownTimeoutMs;
             while (true) {
                 const queue = this.getPersistedProperty(PostHogPersistedProperty.Queue) || [];
                 if (queue.length === 0) {
@@ -1333,7 +1350,7 @@ class PostHogCoreStateless {
                 // flush again to make sure we send all events, some of which might've been added
                 // while we were waiting for the pending promises to resolve
                 // For example, see sendFeatureFlags in posthog-node/src/posthog-node.ts::capture
-                await this.flushAsync();
+                await this.flush();
                 // If we've been waiting for more than the shutdownTimeoutMs, stop it
                 const now = Date.now();
                 if (startTimeWithDelay < now) {
@@ -1348,9 +1365,6 @@ class PostHogCoreStateless {
             console.error('Error while shutting down PostHog', e);
         }
     }
-    shutdown(shutdownTimeoutMs) {
-        void this.shutdownAsync(shutdownTimeoutMs);
-    }
 }
 class PostHogCore extends PostHogCoreStateless {
     constructor(apiKey, options) {
@@ -1816,7 +1830,7 @@ class PostHogCore extends PostHogCoreStateless {
     }
 }
 
-var version = "3.0.0-beta.1";
+var version = "3.0.0-beta.2";
 
 function getContext(window) {
   let context = {};