castled-js-sdk 0.0.1 → 0.0.2

package/src/utils/JSFileLoader.js

@@ -0,0 +1,66 @@
+const DEFAULT_TIMEOUT = 10 * 1000; // 10 seconds
+
+/**
+ *
+ * @param {*} url The URL of the script to be loaded
+ * @param {*} id ID for the script tag [optional]
+ * @param {*} async Whether to load the script in async mode. Defaults to `true` [optional]
+ * @returns
+ */
+const loadScript = (url, id, timeout, async = true) => {
+  return new Promise((resolve, reject) => {
+    try {
+      const exists = document.getElementById(id);
+      if (exists) {
+        reject(new Error(`A script with the id "${id}" is already loaded. Hence, skipping it.`));
+      }
+
+      // Create the DOM element to load the script
+      const scriptElem = document.createElement('script');
+      scriptElem.type = 'text/javascript';
+      scriptElem.src = url;
+      scriptElem.id = id;
+      scriptElem.async = async || true;
+
+      let timeoutID;
+      scriptElem.onload = function onLoad() {
+        clearTimeout(timeoutID);
+        resolve();
+      };
+
+      scriptElem.onerror = function onError() {
+        clearTimeout(timeoutID);
+        reject(new Error(`Couldn't load the script: "${url}".`));
+      };
+
+      // Add it to the document
+      // First try to add it to the head
+      const headElmColl = document.getElementsByTagName('head');
+      if (headElmColl.length > 0) {
+        headElmColl[0].insertBefore(scriptElem, headElmColl[0].firstChild);
+      } else {
+        // Add it before the first script tag
+        const scriptsColl = document.getElementsByTagName('script');
+        if (scriptsColl.length > 0) {
+          scriptsColl[0].parentNode.insertBefore(scriptElem, scriptsColl[0]);
+        } else {
+          // Create a head element and the script
+          const headElem = document.createElement('head');
+          headElem.appendChild(scriptElem);
+          const htmlElem = document.getElementsByTagName('html')[0];
+          htmlElem.insertBefore(headElem, htmlElem.firstChild);
+        }
+      }
+
+      // Set the timer
+      const delay = timeout || DEFAULT_TIMEOUT;
+      timeoutID = setTimeout(() => {
+        reject(new Error(`Timeout (${delay} ms) occurred. Couldn't load the script: "${url}".`));
+      }, delay);
+    } catch (err) {
+      reject(new Error(`Exception occurred while loading the script "${url}": "${err}"`));
+    }
+  });
+};
+
+export { loadScript };

package/src/utils/ObjectUtils.js

@@ -0,0 +1,68 @@
+import * as R from 'ramda';
+import logger from './logUtil';
+
+const mergeDeepRightObjectArrays = (leftValue, rightValue) => {
+  if (!Array.isArray(leftValue) || !Array.isArray(rightValue)) {
+    return R.clone(rightValue);
+  }
+
+  const mergedArray = R.clone(leftValue);
+  rightValue.forEach((value, index) => {
+    // eslint-disable-next-line no-use-before-define
+    mergedArray[index] = mergeDeepRight(mergedArray[index], value);
+  });
+
+  return mergedArray;
+};
+
+const mergeDeepRight = (leftObject, rightObject) =>
+  R.mergeDeepWith(mergeDeepRightObjectArrays, leftObject, rightObject);
+
+const isObjectLiteralAndNotNull = (value) =>
+  value !== null && Object.prototype.toString.call(value) === '[object Object]';
+
+const getCircularReplacer = (excludeNull) => {
+  const ancestors = [];
+
+  return function (key, value) {
+    if (excludeNull && (value === null || value === undefined)) {
+      return undefined;
+    }
+
+    if (typeof value !== 'object' || value === null) {
+      return value;
+    }
+
+    // `this` is the object that value is contained in, i.e., its direct parent.
+    while (ancestors.length > 0 && ancestors[ancestors.length - 1] !== this) {
+      ancestors.pop();
+    }
+
+    if (ancestors.includes(value)) {
+      logger.debug(`Circular Reference detected for key: ${key}`);
+      return '[Circular Reference]';
+    }
+
+    ancestors.push(value);
+    return value;
+  };
+};
+
+const stringifyWithoutCircular = (obj, excludeNull) =>
+  JSON.stringify(obj, getCircularReplacer(excludeNull));
+
+const isInstanceOfEvent = (value) =>
+  typeof value === 'object' && value !== null && 'target' in value;
+
+const isNonEmptyObject = (value) =>
+  isObjectLiteralAndNotNull(value) && Object.keys(value).length > 0;
+
+export {
+  mergeDeepRightObjectArrays,
+  mergeDeepRight,
+  getCircularReplacer,
+  stringifyWithoutCircular,
+  isInstanceOfEvent,
+  isObjectLiteralAndNotNull,
+  isNonEmptyObject,
+};

package/src/utils/PreProcessQueue.js

@@ -0,0 +1,66 @@
+/* eslint-disable consistent-return */
+
+import Queue from '@segment/localstorage-retry';
+import HtElement from './HtElement';
+
+/**
+ * Keeping maxAttempts to Infinity to retry cloud mode events and throw an error until processQueueElements flag is not set to true
+ */
+const queueOptions = {
+  maxRetryDelay: 360000,
+  minRetryDelay: 1000,
+  backoffFactor: 2,
+  maxAttempts: Infinity,
+};
+
+class PreProcessQueue {
+  constructor() {
+    this.callback = undefined;
+    this.processQueueElements = false;
+  }
+
+  init(options, callback) {
+    if (options) {
+      // TODO: add checks for value - has to be +ve?
+      Object.assign(queueOptions, options);
+    }
+    if (callback) {
+      this.callback = callback;
+    }
+    this.payloadQueue = new Queue('rs_events', queueOptions, (item, done) => {
+      this.processQueueElement(item.type, item.htElement, (err, res) => {
+        if (err) {
+          return done(err);
+        }
+        done(null, res);
+      });
+    });
+    this.payloadQueue.start();
+  }
+
+  activateProcessor() {
+    // An indicator to process elements in queue
+    this.processQueueElements = true;
+  }
+
+  processQueueElement(type, htElement, queueFn) {
+    try {
+      if (this.processQueueElements) {
+        Object.setPrototypeOf(htElement, HtElement.prototype);
+        this.callback(type, htElement);
+        queueFn(null);
+      } else {
+        queueFn(new Error('The queue elements are not ready to be processed yet'));
+      }
+    } catch (error) {
+      queueFn(error);
+    }
+  }
+
+  enqueue(type, htElement) {
+    // add items to the queue
+    this.payloadQueue.addItem({ type, htElement });
+  }
+}
+
+export default PreProcessQueue;

package/src/utils/RudderApp.js

@@ -0,0 +1,9 @@
+// Application class
+class RudderApp {
+  constructor() {
+    this.name = 'Events SDK JavaScript';
+    this.namespace = 'com.hightouch.javascript';
+    this.version = '__PACKAGE_VERSION__';
+  }
+}
+export default RudderApp;

package/src/utils/RudderContext.js

@@ -0,0 +1,21 @@
+// Context class
+import RudderApp from './RudderApp';
+import { RudderLibraryInfo, RudderOSInfo } from './RudderInfo';
+import { getUserAgent, getLanguage } from './navigator';
+import { getScreenDetails } from './screenDetails';
+
+class RudderContext {
+  constructor() {
+    this.app = new RudderApp();
+    this.traits = null;
+    this.library = new RudderLibraryInfo();
+    this.userAgent = getUserAgent();
+    this.device = null;
+    this.network = null;
+    this.os = new RudderOSInfo();
+    this.locale = getLanguage();
+    this.screen = getScreenDetails();
+  }
+}
+
+export default RudderContext;

package/src/utils/RudderInfo.js

@@ -0,0 +1,41 @@
+/* eslint-disable max-classes-per-file */
+// Library information class
+class RudderLibraryInfo {
+  constructor() {
+    this.name = 'Events SDK JavaScript';
+    this.version = '__PACKAGE_VERSION__';
+  }
+}
+// Operating System information class
+class RudderOSInfo {
+  constructor() {
+    this.name = '';
+    this.version = '';
+  }
+}
+// Screen information class
+class RudderScreenInfo {
+  constructor() {
+    this.density = 0;
+    this.width = 0;
+    this.height = 0;
+    this.innerWidth = 0;
+    this.innerHeight = 0;
+  }
+}
+// Device information class
+class RudderDeviceInfo {
+  constructor() {
+    this.id = '';
+    this.manufacturer = '';
+    this.model = '';
+    this.name = '';
+  }
+}
+// Carrier information
+class RudderNetwork {
+  constructor() {
+    this.carrier = '';
+  }
+}
+export { RudderLibraryInfo, RudderOSInfo, RudderScreenInfo, RudderDeviceInfo, RudderNetwork };

package/src/utils/RudderMessage.js

@@ -0,0 +1,28 @@
+// Core message class with default values
+import { generateUUID } from './utils';
+import RudderContext from './RudderContext';
+
+class RudderMessage {
+  constructor() {
+    this.channel = 'web';
+    this.context = new RudderContext();
+    this.type = null;
+    this.messageId = generateUUID();
+    this.originalTimestamp = new Date().toISOString();
+    this.anonymousId = null;
+    this.userId = null;
+    this.event = null;
+    this.properties = {};
+  }
+
+  // Get property
+  getProperty(key) {
+    return this.properties[key];
+  }
+
+  // Add property
+  addProperty(key, value) {
+    this.properties[key] = value;
+  }
+}
+export default RudderMessage;

package/src/utils/ScriptLoader.js

@@ -0,0 +1,53 @@
+/* eslint-disable no-use-before-define */
+// import logger from "../utils/logUtil";
+
+import { handleError } from "./errorHandler";
+
+const defaultAsyncState = true;
+
+export const LOAD_ORIGIN = 'RS_JS_SDK';
+/**
+ * Script loader
+ * @param {String} id                               Id of the script
+ * @param {String} src                              URL of the script
+ * @param {Object} options                          Object containing different configuration
+ * @param {Boolean} options.async                   Determines script will be loaded asynchronously or not
+ * @param {Boolean} options.isNonNativeSDK          Determines whether the script that will be loaded is one of RS's own
+ * @param {Boolean} options.skipDatasetAttributes   Determines whether to add or skip dataset attribute
+ */
+const ScriptLoader = (id, src, options = {}) => {
+  try {
+    const exists = document.getElementById(id);
+    if (exists) {
+      // logger.debug("script already loaded");
+      return;
+    }
+
+    const js = document.createElement('script');
+    js.src = src;
+    js.async = options.async === undefined ? defaultAsyncState : options.async;
+    js.type = 'text/javascript';
+    js.id = id;
+    // This checking is in place to skip the dataset attribute for some cases(while loading polyfill)
+    if (options.skipDatasetAttributes !== true) {
+      js.setAttribute('data-loader', LOAD_ORIGIN);
+      if (options.isNonNativeSDK !== undefined) {
+        js.setAttribute('data-isNonNativeSDK', options.isNonNativeSDK);
+      }
+    }
+    const headElmColl = document.getElementsByTagName('head');
+    if (headElmColl.length > 0) {
+      // logger.debug("==adding script==", js);
+      headElmColl[0].insertBefore(js, headElmColl[0].firstChild);
+    } else {
+      const e = document.getElementsByTagName('script')[0];
+      // logger.debug("==parent script==", e);
+      // logger.debug("==adding script==", js);
+      e.parentNode.insertBefore(js, e);
+    }
+  } catch (e) {
+    handleError(e);
+  }
+};
+
+export default ScriptLoader;

package/src/utils/beaconQueue.js

@@ -0,0 +1,133 @@
+/* eslint-disable no-param-reassign */
+/* eslint-disable class-methods-use-this */
+import { Store } from './storage/store';
+import { handleError } from './errorHandler';
+import { stringifyWithoutCircular } from './ObjectUtils';
+
+const defaults = {
+  queue: 'queue',
+  maxPayloadSize: 64 * 1000,
+};
+
+class BeaconQueue {
+  constructor() {
+    this.storage = Store;
+    this.maxItems = 10;
+    this.flushQueueTimeOut = undefined;
+    this.timeOutActive = false;
+    this.flushQueueTimeOutInterval = 1000 * 60 * 10; // 10 mins
+    this.url = '';
+    this.writekey = '';
+    this.queueName = `${defaults.queue}.${Date.now()}`;
+  }
+
+  sendQueueDataForBeacon() {
+    this.sendDataFromQueueAndDestroyQueue();
+  }
+
+  init(writekey, url, options) {
+    this.url = url;
+    this.writekey = writekey;
+    if (options.maxItems) this.maxItems = options.maxItems;
+    if (options.flushQueueInterval) this.flushQueueTimeOutInterval = options.flushQueueInterval;
+
+    this.sendQueueDataForBeacon = this.sendQueueDataForBeacon.bind(this);
+
+    this.attachListeners();
+  }
+
+  attachListeners() {
+    window.addEventListener('visibilitychange', () => {
+      if (document.visibilityState === 'hidden') {
+        this.sendQueueDataForBeacon();
+      }
+    });
+  }
+
+  getQueue() {
+    return this.storage.get(this.queueName);
+  }
+
+  setQueue(value) {
+    this.storage.set(this.queueName, value);
+  }
+
+  enqueue(message) {
+    let queue = this.getQueue() || [];
+    queue = queue.slice(-(this.maxItems - 1));
+    queue.push(message);
+    let batch = queue.slice(0);
+    const data = { batch };
+    const dataToSend = stringifyWithoutCircular(data, true);
+    if (dataToSend.length > defaults.maxPayloadSize) {
+      batch = queue.slice(0, queue.length - 1);
+      this.flushQueue(batch);
+      queue = this.getQueue();
+      queue.push(message);
+    }
+    this.setQueue(queue);
+    this.setTimer();
+
+    if (queue.length === this.maxItems) {
+      this.flushQueue(batch);
+    }
+  }
+
+  sendDataFromQueueAndDestroyQueue() {
+    this.sendDataFromQueue();
+    this.storage.remove(this.queueName);
+  }
+
+  sendDataFromQueue() {
+    const queue = this.getQueue();
+    if (queue && queue.length > 0) {
+      const batch = queue.slice(0, queue.length);
+      this.flushQueue(batch);
+    }
+  }
+
+  flushQueue(batch) {
+    // check batch payload has data before flushing
+    if (batch && batch.length > 0) {
+      batch.forEach((event) => {
+        event.sentAt = new Date().toISOString();
+      });
+      const data = { batch };
+      const payload = stringifyWithoutCircular(data, true);
+      const blob = new Blob([payload], { type: 'text/plain' });
+      const targetUrl = `${this.url}?writeKey=${this.writekey}`;
+      try {
+        if (typeof navigator.sendBeacon !== 'function') {
+          handleError(new Error('Beacon API is not supported by browser'));
+        }
+        const isPushed = navigator.sendBeacon(targetUrl, blob);
+        if (!isPushed) {
+          handleError(new Error("Unable to queue data to browser's beacon queue"));
+        }
+      } catch (e) {
+        e.message = `${e.message} - While sending Beacon data to: ${targetUrl}`;
+        handleError(e);
+      }
+    }
+    this.setQueue([]);
+    this.clearTimer();
+  }
+
+  setTimer() {
+    if (!this.timeOutActive) {
+      this.flushQueueTimeOut = setTimeout(
+        this.sendDataFromQueue.bind(this),
+        this.flushQueueTimeOutInterval,
+      );
+      this.timeOutActive = true;
+    }
+  }
+
+  clearTimer() {
+    if (this.timeOutActive) {
+      clearTimeout(this.flushQueueTimeOut);
+      this.timeOutActive = false;
+    }
+  }
+}
+export default BeaconQueue;

package/src/utils/camelcase.js

@@ -0,0 +1,48 @@
+// util function to convert the input to string type
+function convertToString(input) {
+  if (input) {
+    if (typeof input === 'string') {
+      return input;
+    }
+
+    return String(input);
+  }
+  return '';
+}
+
+// convert string to words
+function toWords(input) {
+  const regex =
+    /[A-Z\xC0-\xD6\xD8-\xDE]?[a-z\xDF-\xF6\xF8-\xFF]+|[A-Z\xC0-\xD6\xD8-\xDE]+(?![a-z\xDF-\xF6\xF8-\xFF])|\d+/g;
+
+  return convertToString(input).match(regex);
+}
+
+// convert the input array to camel case
+function toCamelCase(inputArray) {
+  let result = '';
+  if (!inputArray) return result;
+
+  for (let i = 0, len = inputArray.length; i < len; i += 1) {
+    const currentStr = inputArray[i];
+
+    let tempStr = currentStr.toLowerCase();
+
+    if (i !== 0) {
+      // convert first letter to upper case (the word is in lowercase)
+      tempStr = tempStr.substr(0, 1).toUpperCase() + tempStr.substr(1);
+    }
+    result += tempStr;
+  }
+  return result;
+}
+
+// this function call all other functions
+
+function camelcase(input) {
+  const words = toWords(input);
+
+  return toCamelCase(words);
+}
+
+export default camelcase;

package/src/utils/cdnPaths.js

@@ -0,0 +1,43 @@
+import { getSDKUrlInfo, removeTrailingSlashes } from './utils';
+import { handleError } from './errorHandler';
+import { CDN_ARCH_VERSION_DIR, CDN_INT_DIR, DEST_SDK_BASE_URL } from './constants';
+
+const getIntegrationsCDNPath = (
+  currentVersion,
+  lockIntegrationsVersion,
+  customIntegrationsCDNPath,
+) => {
+  let integrationsCDNPath = '';
+
+  // Get the CDN base URL from the user provided URL if any
+  if (customIntegrationsCDNPath) {
+    integrationsCDNPath = removeTrailingSlashes(customIntegrationsCDNPath);
+
+    // TODO: add proper url validation
+    if (!integrationsCDNPath) {
+      const errorMsg = 'CDN base URL for integrations is not valid';
+
+      handleError({
+        message: `[Analytics] load:: ${errorMsg}`,
+      });
+      throw Error(`Failed to load Events SDK: ${errorMsg}`);
+    }
+
+    return integrationsCDNPath;
+  }
+
+  // Get the base path from the SDK script tag src attribute or use the default path
+  const { sdkURL } = getSDKUrlInfo();
+  integrationsCDNPath = sdkURL
+    ? sdkURL.split('/').slice(0, -1).concat(CDN_INT_DIR).join('/')
+    : DEST_SDK_BASE_URL;
+
+  // If version is not locked it will always get the latest version of the integrations
+  if (lockIntegrationsVersion) {
+    integrationsCDNPath = integrationsCDNPath.replace(CDN_ARCH_VERSION_DIR, currentVersion);
+  }
+
+  return integrationsCDNPath;
+};
+
+export { getIntegrationsCDNPath };

package/src/utils/clientHint.js

@@ -0,0 +1,28 @@
+const getUserAgentClientHint = (callback, level = 'none') => {
+  if (level === 'none') {
+    callback(undefined);
+  }
+  if (level === 'default') {
+    callback(navigator.userAgentData);
+  }
+  if (level === 'full') {
+    navigator.userAgentData
+      .getHighEntropyValues([
+        'architecture',
+        'bitness',
+        'brands',
+        'mobile',
+        'model',
+        'platform',
+        'platformVersion',
+        'uaFullVersion',
+        'fullVersionList',
+        'wow64',
+      ])
+      .then((ua) => {
+        callback(ua);
+      });
+  }
+};
+
+export { getUserAgentClientHint };

package/src/utils/client_server_name.js

@@ -0,0 +1,78 @@
+// from client native integration name to server identified display name
+// add a mapping from Rudder identified key names to Rudder server recognizable names
+const clientToServerNames = {
+  All: 'All',
+  GA: 'Google Analytics',
+  GOOGLEADS: 'Google Ads',
+  BRAZE: 'Braze',
+  CHARTBEAT: 'Chartbeat',
+  COMSCORE: 'Comscore',
+  CUSTOMERIO: 'Customer IO',
+  DCM_Floodlight: 'DCM Floodlight',
+  FACEBOOK_PIXEL: 'Facebook Pixel',
+  GTM: 'Google Tag Manager',
+  HOTJAR: 'Hotjar',
+  HS: 'HubSpot',
+  INTERCOM: 'Intercom',
+  KEEN: 'Keen',
+  KISSMETRICS: 'Kiss Metrics',
+  LOTAME: 'Lotame',
+  VWO: 'VWO',
+  OPTIMIZELY: 'Optimizely Web',
+  FULLSTORY: 'Fullstory',
+  TVSQUARED: 'TVSquared',
+  GA4: 'Google Analytics 4 (GA4)',
+  MOENGAGE: 'MoEngage',
+  AM: 'Amplitude',
+  PENDO: 'Pendo',
+  LYTICS: 'Lytics',
+  APPCUES: 'Appcues',
+  POSTHOG: 'PostHog',
+  PROFITWELL: 'ProfitWell',
+  KLAVIYO: 'Klaviyo',
+  CLEVERTAP: 'CleverTap',
+  BINGADS: 'Bing Ads',
+  PINTEREST_TAG: 'Pinterest Tag',
+  SNAP_PIXEL: 'Snap Pixel',
+  LINKEDIN_INSIGHT_TAG: 'Linkedin Insight Tag',
+  REDDIT_PIXEL: 'Reddit Pixel',
+  DRIP: 'Drip',
+  HEAP: 'Heap.io',
+  CRITEO: 'Criteo',
+  MP: 'Mixpanel',
+  QUALTRICS: 'Qualtrics',
+  SENTRY: 'Sentry',
+  GOOGLE_OPTIMIZE: 'Google Optimize',
+  POST_AFFILIATE_PRO: 'Post Affiliate Pro',
+  LAUNCHDARKLY: 'LaunchDarkly',
+  GA360: 'Google Analytics 360',
+  ADROLL: 'Adroll',
+  VERO: 'Vero',
+  MATOMO: 'Matomo',
+  MOUSEFLOW: 'Mouseflow',
+  ROCKERBOX: 'Rockerbox',
+  CONVERTFLOW: 'ConvertFlow',
+  SNAPENGAGE: 'SnapEngage',
+  LIVECHAT: 'LiveChat',
+  SHYNET: 'Shynet',
+  WOOPRA: 'Woopra',
+  ROLLBAR: 'RollBar',
+  QUORA_PIXEL: 'Quora Pixel',
+  JUNE: 'June',
+  ENGAGE: 'Engage',
+  ITERABLE: 'Iterable',
+  YANDEX_METRICA: 'Yandex.Metrica',
+  REFINER: 'Refiner',
+  QUALAROO: 'Qualaroo',
+  PODSIGHTS: 'Podsights',
+  AXEPTIO: 'Axeptio',
+  SATISMETER: 'Satismeter',
+  MICROSOFT_CLARITY: 'Microsoft Clarity',
+  SENDINBLUE: 'Sendinblue',
+  OLARK: 'Olark',
+  LEMNISK: "Lemnisk",
+  TIKTOK_ADS: "TikTok Ads",
+  ACTIVE_CAMPAIGN :"ActiveCampaign",
+};
+
+export { clientToServerNames };