clarity-js 0.7.56 → 0.7.58

package/build/clarity.js

@@ -138,6 +138,7 @@ var config$2 = {
     throttleDom: true,
     conversions: false,
     longTask: 30,
+    includeSubdomains: true,
 };
 
 function api(method) {
@@ -165,7 +166,7 @@ function stop$F() {
     startTime = 0;
 }
 
-var version$1 = "0.7.56";
+var version$1 = "0.7.58";
 
 // tslint:disable: no-bitwise
 function hash (input, precision) {
@@ -1956,6 +1957,8 @@ function stop$r() {
 
 var state$5 = [];
 var timeout$5 = null;
+var activeTouchPointId = 0;
+var activeTouchPointIds = new Set();
 function start$s() {
     reset$f();
 }
@@ -1998,13 +2001,25 @@ function touch(event, root, evt) {
             var y = "clientY" in entry ? Math.round(entry["clientY"] + d.scrollTop) : null;
             x = x && frame ? x + Math.round(frame.offsetLeft) : x;
             y = y && frame ? y + Math.round(frame.offsetTop) : y;
-            // identifier is 0-based, unique for each touch point and resets when all fingers are lifted
-            // that is not a part of the spec, but it is how it is implemented in browsers
-            // tested in Chromium-based browsers as well as Firefox
+            // We cannot rely on identifier to determine primary touch as its value doesn't always start with 0.
+            // Safari/Webkit uses the address of the UITouch object as the identifier value for each touch point.
             var id = "identifier" in entry ? entry["identifier"] : undefined;
+            switch (event) {
+                case 17 /* Event.TouchStart */:
+                    if (activeTouchPointIds.size === 0) {
+                        activeTouchPointId = id;
+                    }
+                    activeTouchPointIds.add(id);
+                    break;
+                case 18 /* Event.TouchEnd */:
+                case 20 /* Event.TouchCancel */:
+                    activeTouchPointIds.delete(id);
+                    break;
+            }
+            var isPrimary = activeTouchPointId === id;
             // Check for null values before processing this event
             if (x !== null && y !== null) {
-                handler$2({ time: t, event: event, data: { target: target(evt), x: x, y: y, id: id } });
+                handler$2({ time: t, event: event, data: { target: target(evt), x: x, y: y, id: id, isPrimary: isPrimary } });
             }
         }
     }
@@ -2053,7 +2068,9 @@ function stop$q() {
 
 var data$b;
 var timeout$4 = null;
+var initialStateLogged = false;
 function start$r() {
+    initialStateLogged = false;
     bind(window, "resize", recompute$5);
     recompute$5();
 }
@@ -2065,8 +2082,14 @@ function recompute$5() {
         width: de && "clientWidth" in de ? Math.min(de.clientWidth, window.innerWidth) : window.innerWidth,
         height: de && "clientHeight" in de ? Math.min(de.clientHeight, window.innerHeight) : window.innerHeight,
     };
-    clearTimeout(timeout$4);
-    timeout$4 = setTimeout(process$5, 500 /* Setting.LookAhead */, 11 /* Event.Resize */);
+    if (initialStateLogged) {
+        clearTimeout(timeout$4);
+        timeout$4 = setTimeout(process$5, 500 /* Setting.LookAhead */, 11 /* Event.Resize */);
+    }
+    else {
+        encode$3(11 /* Event.Resize */);
+        initialStateLogged = true;
+    }
 }
 function process$5(event) {
     schedule$1(encode$3.bind(this, event));
@@ -2372,6 +2395,7 @@ function traverse (root, timer, source, timestamp) {
 
 var observers = [];
 var mutations = [];
+var throttledMutations = {};
 var insertRule = null;
 var deleteRule = null;
 var attachShadow = null;
@@ -2379,6 +2403,7 @@ var mediaInsertRule = null;
 var mediaDeleteRule = null;
 var queue$2 = [];
 var timeout$1 = null;
+var throttleDelay = null;
 var activePeriod = null;
 var history$4 = {};
 function start$k() {
@@ -2482,6 +2507,7 @@ function stop$i() {
     observers = [];
     history$4 = {};
     mutations = [];
+    throttledMutations = [];
     queue$2 = [];
     activePeriod = 0;
     timeout$1 = null;
@@ -2499,36 +2525,24 @@ function handle$1(m) {
         measure(compute$6)();
     });
 }
-function process$2() {
+function processMutation(timer, mutation, instance, timestamp) {
     return __awaiter(this, void 0, void 0, function () {
-        var timer, record, instance, _i, _a, mutation, state, target, type, value;
-        return __generator(this, function (_b) {
-            switch (_b.label) {
+        var state, target, type;
+        return __generator(this, function (_a) {
+            switch (_a.label) {
                 case 0:
-                    timer = { id: id(), cost: 3 /* Metric.LayoutCost */ };
-                    start$y(timer);
-                    _b.label = 1;
-                case 1:
-                    if (!(mutations.length > 0)) return [3 /*break*/, 8];
-                    record = mutations.shift();
-                    instance = time();
-                    _i = 0, _a = record.mutations;
-                    _b.label = 2;
-                case 2:
-                    if (!(_i < _a.length)) return [3 /*break*/, 6];
-                    mutation = _a[_i];
                     state = state$a(timer);
-                    if (!(state === 0 /* Task.Wait */)) return [3 /*break*/, 4];
+                    if (!(state === 0 /* Task.Wait */)) return [3 /*break*/, 2];
                     return [4 /*yield*/, suspend$1(timer)];
-                case 3:
-                    state = _b.sent();
-                    _b.label = 4;
-                case 4:
+                case 1:
+                    state = _a.sent();
+                    _a.label = 2;
+                case 2:
                     if (state === 2 /* Task.Stop */) {
-                        return [3 /*break*/, 6];
+                        return [2 /*return*/];
                     }
                     target = mutation.target;
-                    type = config$2.throttleDom ? track$5(mutation, timer, instance, record.time) : mutation.type;
+                    type = config$2.throttleDom ? track$5(mutation, timer, instance, timestamp) : mutation.type;
                     if (type && target && target.ownerDocument) {
                         parse$1(target.ownerDocument);
                     }
@@ -2537,31 +2551,60 @@ function process$2() {
                     }
                     switch (type) {
                         case "attributes" /* Constant.Attributes */:
-                            processNode(target, 3 /* Source.Attributes */, record.time);
+                            processNode(target, 3 /* Source.Attributes */, timestamp);
                             break;
                         case "characterData" /* Constant.CharacterData */:
-                            processNode(target, 4 /* Source.CharacterData */, record.time);
+                            processNode(target, 4 /* Source.CharacterData */, timestamp);
                             break;
                         case "childList" /* Constant.ChildList */:
-                            processNodeList(mutation.addedNodes, 1 /* Source.ChildListAdd */, timer, record.time);
-                            processNodeList(mutation.removedNodes, 2 /* Source.ChildListRemove */, timer, record.time);
-                            break;
-                        case "suspend" /* Constant.Suspend */:
-                            value = get(target);
-                            if (value) {
-                                value.metadata.suspend = true;
-                            }
+                            processNodeList(mutation.addedNodes, 1 /* Source.ChildListAdd */, timer, timestamp);
+                            processNodeList(mutation.removedNodes, 2 /* Source.ChildListRemove */, timer, timestamp);
                             break;
                     }
-                    _b.label = 5;
-                case 5:
-                    _i++;
-                    return [3 /*break*/, 2];
-                case 6: return [4 /*yield*/, encode$4(6 /* Event.Mutation */, timer, record.time)];
-                case 7:
-                    _b.sent();
+                    return [2 /*return*/];
+            }
+        });
+    });
+}
+function process$2() {
+    return __awaiter(this, void 0, void 0, function () {
+        var timer, record, instance, _i, _a, mutation, processedMutations, _b, _c, key, throttledMutationToProcess;
+        return __generator(this, function (_d) {
+            switch (_d.label) {
+                case 0:
+                    timer = { id: id(), cost: 3 /* Metric.LayoutCost */ };
+                    start$y(timer);
+                    _d.label = 1;
+                case 1:
+                    if (!(mutations.length > 0)) return [3 /*break*/, 3];
+                    record = mutations.shift();
+                    instance = time();
+                    for (_i = 0, _a = record.mutations; _i < _a.length; _i++) {
+                        mutation = _a[_i];
+                        processMutation(timer, mutation, instance, record.time);
+                    }
+                    return [4 /*yield*/, encode$4(6 /* Event.Mutation */, timer, record.time)];
+                case 2:
+                    _d.sent();
                     return [3 /*break*/, 1];
-                case 8:
+                case 3:
+                    processedMutations = false;
+                    for (_b = 0, _c = Object.keys(throttledMutations); _b < _c.length; _b++) {
+                        key = _c[_b];
+                        throttledMutationToProcess = throttledMutations[key];
+                        delete throttledMutations[key];
+                        processMutation(timer, throttledMutationToProcess.mutation, time(), throttledMutationToProcess.timestamp);
+                        processedMutations = true;
+                    }
+                    if (Object.keys(throttledMutations).length > 0) {
+                        processThrottledMutations();
+                    }
+                    if (!(Object.keys(throttledMutations).length === 0 && processedMutations)) return [3 /*break*/, 5];
+                    return [4 /*yield*/, encode$4(6 /* Event.Mutation */, timer, time())];
+                case 4:
+                    _d.sent();
+                    _d.label = 5;
+                case 5:
                     stop$w(timer);
                     return [2 /*return*/];
             }
@@ -2592,14 +2635,16 @@ function track$5(m, timer, instance, timestamp) {
         h[0] = inactive ? (h[1] === instance ? h[0] : h[0] + 1) : 1;
         h[1] = instance;
         // Return updated mutation type based on if we have already hit the threshold or not
-        if (h[0] === 10 /* Setting.MutationSuspendThreshold */) {
+        if (h[0] >= 10 /* Setting.MutationSuspendThreshold */) {
             // Store a reference to removedNodes so we can process them later
             // when we resume mutations again on user interactions
             h[2] = m.removedNodes;
-            return "suspend" /* Constant.Suspend */;
-        }
-        else if (h[0] > 10 /* Setting.MutationSuspendThreshold */) {
-            return "" /* Constant.Empty */;
+            if (instance > timestamp + 3000 /* Setting.MutationActivePeriod */) {
+                return m.type;
+            }
+            // we only store the most recent mutation for a given key if it is being throttled
+            throttledMutations[key] = { mutation: m, timestamp: timestamp };
+            return "throttle" /* Constant.Throttle */;
         }
     }
     return m.type;
@@ -2646,6 +2691,12 @@ function processNodeList(list, source, timer, timestamp) {
         });
     });
 }
+function processThrottledMutations() {
+    if (throttleDelay) {
+        clearTimeout(throttleDelay);
+    }
+    throttleDelay = setTimeout(function () { schedule$1(process$2, 1 /* Priority.High */); }, 33 /* Setting.LookAhead */);
+}
 function schedule(node) {
     // Only schedule manual trigger for this node if it's not already in the queue
     if (queue$2.indexOf(node) < 0) {
@@ -3138,6 +3189,7 @@ var state$2 = [];
 var elementAnimate = null;
 var animationPlay = null;
 var animationPause = null;
+var animationCommitStyles = null;
 var animationCancel = null;
 var animationFinish = null;
 var animationId = 'clarityAnimationId';
@@ -3145,12 +3197,15 @@ var operationCount = 'clarityOperationCount';
 var maxOperations = 20;
 function start$i() {
     if (window["Animation"] &&
+        window["Animation"].prototype &&
         window["KeyframeEffect"] &&
+        window["KeyframeEffect"].prototype &&
         window["KeyframeEffect"].prototype.getKeyframes &&
         window["KeyframeEffect"].prototype.getTiming) {
         reset$7();
         overrideAnimationHelper(animationPlay, "play");
         overrideAnimationHelper(animationPause, "pause");
+        overrideAnimationHelper(animationCommitStyles, "commitStyles");
         overrideAnimationHelper(animationCancel, "cancel");
         overrideAnimationHelper(animationFinish, "finish");
         if (elementAnimate === null) {
@@ -3234,6 +3289,9 @@ function trackAnimationOperation(animation, name) {
                     case "finish":
                         operation = 4 /* AnimationOperation.Finish */;
                         break;
+                    case "commitStyles":
+                        operation = 5 /* AnimationOperation.CommitStyles */;
+                        break;
                 }
                 if (operation) {
                     track$4(time(), animation[animationId], operation);
@@ -3614,6 +3672,9 @@ function encode$3 (type, ts) {
                             tokens.push(entry.data.y);
                             if (entry.data.id !== undefined) {
                                 tokens.push(entry.data.id);
+                                if (entry.data.isPrimary !== undefined) {
+                                    tokens.push(entry.data.isPrimary.toString());
+                                }
                             }
                             queue(tokens);
                             track$8(entry.event, entry.data.x, entry.data.y);
@@ -4787,7 +4848,7 @@ function shortid() {
 }
 function session() {
     var output = { session: shortid(), ts: Math.round(Date.now()), count: 1, upgrade: null, upload: "" /* Constant.Empty */ };
-    var value = getCookie("_clsk" /* Constant.SessionKey */);
+    var value = getCookie("_clsk" /* Constant.SessionKey */, !config$2.includeSubdomains);
     if (value) {
         var parts = value.split("|" /* Constant.Pipe */);
         // Making it backward & forward compatible by using greater than comparison (v0.6.21)
@@ -4807,7 +4868,7 @@ function num(string, base) {
 }
 function user() {
     var output = { id: shortid(), version: 0, expiry: null, consent: 0 /* BooleanFlag.False */, dob: 0 };
-    var cookie = getCookie("_clck" /* Constant.CookieKey */);
+    var cookie = getCookie("_clck" /* Constant.CookieKey */, !config$2.includeSubdomains);
     if (cookie && cookie.length > 0) {
         // Splitting and looking up first part for forward compatibility, in case we wish to store additional information in a cookie
         var parts = cookie.split("|" /* Constant.Pipe */);
@@ -4849,8 +4910,9 @@ function user() {
     }
     return output;
 }
-function getCookie(key) {
+function getCookie(key, limit) {
     var _a;
+    if (limit === void 0) { limit = false; }
     if (supported(document, "cookie" /* Constant.Cookie */)) {
         var cookies = document.cookie.split(";" /* Constant.Semicolon */);
         if (cookies) {
@@ -4867,6 +4929,12 @@ function getCookie(key) {
                     while (isEncoded) {
                         _a = decodeCookieValue(decodedValue), isEncoded = _a[0], decodedValue = _a[1];
                     }
+                    // If we are limiting cookies, check if the cookie value is limited
+                    if (limit) {
+                        return decodedValue.endsWith("".concat("~" /* Constant.Tilde */, "1"))
+                            ? decodedValue.substring(0, decodedValue.length - 2)
+                            : null;
+                    }
                     return decodedValue;
                 }
             }