@jitsu/js 1.6.1 → 1.7.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jitsu/js",
-  "version": "1.6.1",
+  "version": "1.7.2",
   "description": "",
   "author": "Jitsu Dev Team <dev@jitsu.com>",
   "main": "dist/jitsu.cjs.js",
@@ -12,7 +12,7 @@
   "license": "MIT",
   "private": false,
   "devDependencies": {
-    "@playwright/test": "1.31.2",
+    "@playwright/test": "1.39.0",
     "@rollup/plugin-commonjs": "^23.0.2",
     "@rollup/plugin-json": "^5.0.1",
     "@rollup/plugin-multi-entry": "^6.0.0",
@@ -34,10 +34,10 @@
     "rollup": "^3.2.5",
     "ts-jest": "29.0.5",
     "typescript": "^4.9.5",
-    "@jitsu/protocols": "1.6.1"
+    "@jitsu/protocols": "1.7.2"
   },
   "dependencies": {
-    "analytics": "^0.8.1"
+    "analytics": "0.8.9"
   },
   "scripts": {
     "clean": "rm -rf ./dist",

package/rollup.config.js

@@ -4,9 +4,16 @@ const commonjs = require("@rollup/plugin-commonjs");
 const rollupJson = require("@rollup/plugin-json");
 const terser = require("@rollup/plugin-terser");
 
+
 module.exports = [
   {
-    plugins: [multi(), resolve({ preferBuiltins: false }), commonjs(), rollupJson(), terser()],
+    plugins: [
+      multi(),
+      resolve({ preferBuiltins: false }),
+      commonjs(),
+      rollupJson(),
+      (process.JITSU_JS_DEBUG_BUILD = "1" ? undefined : terser()),
+    ],
     input: "./compiled/src/browser.js",
     output: {
       file: `dist/web/p.js.txt`,

package/src/analytics-plugin.ts

@@ -77,23 +77,32 @@ function getCookie(name: string) {
   return parts.length === 2 ? parts.pop().split(";").shift() : undefined;
 }
 
-function getGa4Sessions(): Record<string, string> | undefined {
-  const value = `; ${document.cookie}`;
-  const matches = value.matchAll(/_ga_(\w+)=([^;]+)/g);
-  const sessions: Record<string, string> = {};
-  let matchesCount = 0;
-  for (const match of matches) {
-    const parts = match[2].split(".");
-    if (parts.length < 3) {
-      continue;
-    }
-    sessions[match[1]] = parts[2];
-    matchesCount++;
-  }
-  if (matchesCount === 0) {
+function getGa4Ids(runtime: RuntimeFacade) {
+  const allCookies = runtime.getCookies();
+  const clientId = allCookies["_ga"]?.split(".").slice(-2).join(".");
+  const gaSessionCookies = Object.entries(allCookies).filter(([key]) => key.startsWith("_ga_"));
+  const sessionIds =
+    gaSessionCookies.length > 0
+      ? Object.fromEntries(
+          gaSessionCookies
+            .map(([key, value]) => {
+              if (typeof value !== "string") {
+                return null;
+              }
+              const parts = value.split(".");
+              if (parts.length < 3) {
+                return null;
+              }
+              return [key.substring("_ga_".length), parts[2]];
+            })
+            .filter(v => v !== null)
+        )
+      : undefined;
+  if (clientId || sessionIds) {
+    return { ga4: { clientId, sessionIds } };
+  } else {
     return undefined;
   }
-  return sessions;
 }
 
 function removeCookie(name: string) {
@@ -149,6 +158,20 @@ const cookieStorage: StorageFactory = (cookieDomain, key2cookie) => {
 
 export function windowRuntime(opts: JitsuOptions): RuntimeFacade {
   return {
+    getCookie(name: string): string | undefined {
+      const value = `; ${document.cookie}`;
+      const parts = value.split(`; ${name}=`);
+      return parts.length === 2 ? parts.pop().split(";").shift() : undefined;
+    },
+    getCookies(): Record<string, string> {
+      const value = `; ${document.cookie}`;
+      const cookies: Record<string, string> = {};
+      const matches = value.matchAll(/(\w+)=([^;]+)/g);
+      for (const match of matches) {
+        cookies[match[1]] = match[2];
+      }
+      return cookies;
+    },
     documentEncoding(): string | undefined {
       return window.document.characterSet;
     },
@@ -193,6 +216,12 @@ export const emptyRuntime = (config: JitsuOptions): RuntimeFacade => ({
   timezoneOffset(): number | undefined {
     return undefined;
   },
+  getCookie(name: string): string | undefined {
+    return undefined;
+  },
+  getCookies(): Record<string, string> {
+    return {};
+  },
 
   store(): PersistentStorage {
     const storage = {};
@@ -284,12 +313,9 @@ function adjustPayload(payload: any, config: JitsuOptions, storage: PersistentSt
       encoding: properties.encoding || runtime.documentEncoding(),
     },
     clientIds: {
-      fbc: getCookie("_fbc"),
-      fbp: getCookie("_fbp"),
-      ga4: {
-        clientId: getCookie("_ga")?.split(".").slice(-2).join("."), //last 2 parts of GA cookie
-        sessions: getGa4Sessions(),
-      },
+      fbc: runtime.getCookie("_fbc"),
+      fbp: runtime.getCookie("_fbp"),
+      ...getGa4Ids(runtime),
     },
     campaign: parseUtms(query),
   };
@@ -453,7 +479,7 @@ function send(
   store: PersistentStorage
 ): Promise<void> {
   if (jitsuConfig.echoEvents) {
-    console.log(`[JITSU] sending '${method}' event:`, payload);
+    console.log(`[JITSU DEBUG] sending '${method}' event:`, payload);
     return;
   }
 
@@ -519,18 +545,31 @@ function send(
 
 const jitsuAnalyticsPlugin = (pluginConfig: JitsuOptions = {}): AnalyticsPlugin => {
   const storageCache: any = {};
+
   // AnalyticsInstance's storage is async somewhere inside. So if we make 'page' call right after 'identify' call
   // 'page' call will load traits from storage before 'identify' call had a change to save them.
   // to avoid that we use in-memory cache for storage
   const cachingStorageWrapper = (persistentStorage: PersistentStorage): PersistentStorage => ({
     setItem(key: string, val: any) {
+      if (pluginConfig.debug) {
+        console.log(`[JITSU DEBUG] Caching storage setItem: ${key}=${val}`);
+      }
       storageCache[key] = val;
       persistentStorage.setItem(key, val);
     },
     getItem(key: string) {
-      return storageCache[key] || persistentStorage.getItem(key);
+      const value = storageCache[key] || persistentStorage.getItem(key);
+      if (pluginConfig.debug) {
+        console.log(
+          `[JITSU DEBUG] Caching storage getItem: ${key}=${value}. Evicted from cache: ${!storageCache[key]}`
+        );
+      }
+      return value;
     },
     removeItem(key: string) {
+      if (pluginConfig.debug) {
+        console.log(`[JITSU DEBUG] Caching storage removeItem: ${key}`);
+      }
       delete storageCache[key];
       persistentStorage.removeItem(key);
     },
@@ -542,10 +581,11 @@ const jitsuAnalyticsPlugin = (pluginConfig: JitsuOptions = {}): AnalyticsPlugin
   return {
     name: "jitsu",
     config: instanceConfig,
+
     initialize: args => {
       const { config } = args;
       if (config.debug) {
-        console.debug("[JITSU] Initializing Jitsu plugin with config: ", JSON.stringify(config));
+        console.debug("[JITSU DEBUG] Initializing Jitsu plugin with config: ", JSON.stringify(config, null, 2));
       }
       if (!config.host && !config.echoEvents) {
         throw new Error("Please specify host variable in jitsu plugin initialization, or set echoEvents to true");
@@ -574,15 +614,16 @@ const jitsuAnalyticsPlugin = (pluginConfig: JitsuOptions = {}): AnalyticsPlugin
       //analytics doesn't support group as a base method, so we need to add it manually
       group(groupId?: ID, traits?: JSONObject | null, options?: Options, callback?: Callback) {
         const analyticsInstance = this.instance;
+        const cacheWrap = cachingStorageWrapper(analyticsInstance.storage);
         const user = analyticsInstance.user();
         const userId = options?.userId || user?.userId;
-        const anonymousId = options?.anonymousId || user?.anonymousId;
+        const anonymousId = options?.anonymousId || user?.anonymousId || cacheWrap.getItem("__anon_id");
         return send(
           "group",
           { type: "group", groupId, traits, ...(anonymousId ? { anonymousId } : {}), ...(userId ? { userId } : {}) },
           instanceConfig,
           analyticsInstance,
-          cachingStorageWrapper(analyticsInstance.storage)
+          cacheWrap
         );
       },
     },

package/src/browser.ts

@@ -53,10 +53,6 @@ function getScriptAttributes(scriptElement: HTMLScriptElement) {
 
   const options = readJitsuOptions();
   const JITSU_V2_ID: string = options.namespace || "jitsu";
-
-  if (window[JITSU_V2_ID]) {
-    console.log("Jitsu is already initialized");
-  }
   if (options.debug) {
     console.log(`Jitsu options: `, JSON.stringify(options));
   }
@@ -75,6 +71,32 @@ function getScriptAttributes(scriptElement: HTMLScriptElement) {
   }
   window[JITSU_V2_ID] = jitsu;
 
+  /**
+   * New callback based queue, see below
+   */
+  //make a copy of the queue
+  const callbackQueue = [...(window[JITSU_V2_ID + "Q"] || [])];
+  //replace push with a function that calls callback immediately
+  window[JITSU_V2_ID + "Q"] = {
+    push: (callback: any) => {
+      if (typeof callback === "function") {
+        callback(jitsu);
+      } else {
+        console.warn(`${JITSU_V2_ID}Q.push() accepts only function, ${typeof callback} given`);
+      }
+    },
+  };
+
+  if (options.debug) {
+    console.log(`Jitsu callback queue size: ${callbackQueue.length}`, callbackQueue);
+  }
+  callbackQueue.forEach((callback: any) => {
+    try {
+      callback(jitsu);
+    } catch (e: any) {
+      console.warn(`Error processing callback from Jitsu queue`, e);
+    }
+  });
   if (!options.initOnly) {
     jitsu.page();
   }

package/src/index.ts

@@ -23,7 +23,8 @@ export default function parse(input) {
   return value;
 }
 
-export const emptyAnalytics = {
+export const emptyAnalytics: AnalyticsInterface = {
+  setAnonymousId: () => {},
   track: () => Promise.resolve(),
   page: () => Promise.resolve(),
   user: () => ({}),
@@ -37,10 +38,11 @@ function createUnderlyingAnalyticsInstance(
   rt: RuntimeFacade,
   plugins: any[] = []
 ): AnalyticsInterface {
+  const storage = rt.store();
   const analytics = Analytics({
     app: "test",
     debug: !!opts.debug,
-    storage: rt.store(),
+    storage,
     plugins: [jitsuAnalyticsPlugin(opts), ...plugins],
   } as any);
   const originalPage = analytics.page;
@@ -56,6 +58,19 @@ function createUnderlyingAnalyticsInstance(
   };
   return {
     ...analytics,
+    setAnonymousId: (id: string) => {
+      if (opts.debug) {
+        console.log("[JITSU DEBUG] Setting anonymous id to " + id);
+        //Workaround for analytics.js bug. Underlying setAnonymousId doesn't work set the id immediately,
+        //so we got to it manually here. See https://github.com/jitsucom/jitsu/issues/1060
+        storage.setItem("__anon_id", id);
+        const userState = analytics.user();
+        if (userState) {
+          userState.anonymousId = id;
+        }
+        (analytics as any).setAnonymousId(id);
+      }
+    },
     group(groupId?: ID, traits?: JSONObject | null, options?: Options, callback?: Callback): Promise<DispatchedEvent> {
       for (const plugin of Object.values(analytics.plugins)) {
         if (plugin["group"]) {
@@ -98,5 +113,3 @@ export function jitsuAnalytics(opts: JitsuOptions): AnalyticsInterface {
 
 export * from "./jitsu";
 export * from "./analytics-plugin";
-export { applyFilters } from "./destination-plugins";
-export { getTopLevelDomain } from "./tlds";

package/src/jitsu.ts

@@ -52,6 +52,9 @@ type RuntimeFacade = {
   language(): string | undefined;
   pageUrl(): string | undefined;
   documentEncoding(): string | undefined;
+  getCookie(name: string): string | undefined;
+  getCookies(): Record<string, string>;
+
   timezoneOffset(): number | undefined;
   screen():
     | {