@pendo/agent 2.347.0 → 2.349.0

package/dist/dom.esm.js

@@ -7555,7 +7555,7 @@ function applyMatrix2dRect(matrix2d, rect) {
     return transformedRect;
 }
 
-var VERSION = '2.347.0_';
+var VERSION = '2.349.0_';
 
 var decodeURIComponent = _.isFunction(globalScope.decodeURIComponent) ? globalScope.decodeURIComponent : _.identity;
 
@@ -7915,13 +7915,13 @@ var agentStorage = (function () {
         resetCache(storageAvailable);
         if (storageIsDisabled()) {
             inMemoryStorage[key] = ttlWrite(val, duration);
-            return;
+            return true;
         }
         if (shouldUseLocalStorage(keyLocalStorageOnly)) {
             if (storageAvailable('localStorage')) {
                 try {
                     localStorage.setItem(key, ttlWrite(val, duration));
-                    return;
+                    return true;
                 }
                 catch (e) { }
             }
@@ -7931,11 +7931,12 @@ var agentStorage = (function () {
                 if (!isPlain)
                     duration = duration || DEFAULT_EXPIRE_LEN;
                 setCookie(key, val, duration, isSecure);
-                return;
+                return true;
             }
             catch (e) { }
         }
         inMemoryStorage[key] = ttlWrite(val, duration);
+        return false;
     }
     function ttlWrite(value, duration) {
         if (duration === null) {

package/dist/pendo.module.js

@@ -4138,8 +4138,8 @@ let SERVER = '';
 let ASSET_HOST = '';
 let ASSET_PATH = '';
 let DESIGNER_SERVER = '';
-let VERSION = '2.347.0_';
-let PACKAGE_VERSION = '2.347.0';
+let VERSION = '2.349.0_';
+let PACKAGE_VERSION = '2.349.0';
 let LOADER = 'xhr';
 /* eslint-enable web-sdk-eslint-rules/no-gulp-env-references */
 /**
@@ -5133,13 +5133,13 @@ var agentStorage = (function () {
         resetCache(storageAvailable);
         if (storageIsDisabled()) {
             inMemoryStorage[key] = ttlWrite(val, duration);
-            return;
+            return true;
         }
         if (shouldUseLocalStorage(keyLocalStorageOnly)) {
             if (storageAvailable('localStorage')) {
                 try {
                     localStorage.setItem(key, ttlWrite(val, duration));
-                    return;
+                    return true;
                 }
                 catch (e) { }
             }
@@ -5149,11 +5149,12 @@ var agentStorage = (function () {
                 if (!isPlain)
                     duration = duration || DEFAULT_EXPIRE_LEN;
                 setCookie(key, val, duration, isSecure);
-                return;
+                return true;
             }
             catch (e) { }
         }
         inMemoryStorage[key] = ttlWrite(val, duration);
+        return false;
     }
     function ttlWrite(value, duration) {
         if (duration === null) {
@@ -12995,6 +12996,23 @@ function migrateLegacyCookieEvents(events) {
         clearCookie(getPendoCookieKey(UNSENT_EVENTS_KEY));
     }
 }
+// the quota error doesn't say how much space is left, so halving keeps the
+// number of retries during pagehide small
+function dropOldestHalf(events) {
+    const entries = [];
+    _.each(events, (requests, key) => {
+        _.each(requests, (request) => {
+            entries.push({ key, request });
+        });
+    });
+    const newest = _.sortBy(entries, (entry) => entry.request.ts).slice(Math.ceil(entries.length / 2));
+    const remaining = {};
+    _.each(newest, (entry) => {
+        remaining[entry.key] = remaining[entry.key] || [];
+        remaining[entry.key].push(entry.request);
+    });
+    return remaining;
+}
 class LocalStorageEventBuffer {
     constructor() {
         this.events = {};
@@ -13039,12 +13057,14 @@ class LocalStorageEventBuffer {
         storage.clear(UNSENT_EVENTS_KEY);
     }
     write(storage) {
-        if (_.size(this.events) > 0) {
-            storage.write(UNSENT_EVENTS_KEY, JSON.stringify(this.events), UNSENT_EVENTS_MAX_AGE);
-        }
-        else {
-            storage.clear(UNSENT_EVENTS_KEY);
+        let events = this.events;
+        while (_.size(events) > 0) {
+            if (storage.write(UNSENT_EVENTS_KEY, JSON.stringify(events), UNSENT_EVENTS_MAX_AGE)) {
+                return;
+            }
+            events = dropOldestHalf(events);
         }
+        storage.clear(UNSENT_EVENTS_KEY);
     }
 }
 var localStorageEventBuffer = new LocalStorageEventBuffer();
@@ -14239,6 +14259,14 @@ var isWalkthrough = function (guide) {
 var isForm = function (guide) {
     return !!(_.get(guide, 'attributes.form'));
 };
+// An HTML guide step's type is 'html' and it has no domJson to derive calculatedType
+// from, so its layout only shows up in buildingBlockLayoutType
+var isTooltipStep = function (step) {
+    var tooltip = 'tooltip';
+    return _.get(step, 'type') === tooltip ||
+        _.get(step, 'attributes.calculatedType') === tooltip ||
+        _.get(step, 'attributes.buildingBlockLayoutType', _.get(step, 'buildingBlockLayoutType')) === tooltip;
+};
 function isPreviewing() {
     /* global selmo */
     return (typeof selmo !== 'undefined' && !!selmo.isPreviewing);
@@ -17881,6 +17909,7 @@ var FlexboxPolyfill = (function () {
         wrapElementInMockFlexboxContainer,
         getVisualElementsWrappedInFlexElements,
         initializeFlexRows,
+        initializeNativeFlexRow,
         getRowWidth,
         wrapFlexElementsInFlexRows,
         formatFlexRows,
@@ -18242,32 +18271,26 @@ var FlexboxPolyfill = (function () {
         var computedStyles = getComputedStyle_safe(row);
         return parseInt(width, 10) - parseInt(computedStyles.paddingLeft, 10) - parseInt(computedStyles.paddingRight, 10);
     }
-    function initializeFlexRows(row, justifyContent, rowVerticalAlignment, useNativeFlexbox = false) {
-        if (useNativeFlexbox) {
-            var alignments = {
-                top: 'flex-start',
-                center: 'center',
-                bottom: 'flex-end'
-            };
-            row.style.display = 'flex';
-            row.style.flexWrap = 'wrap';
-            row.style.justifyContent = justifyContent;
-            row.style.alignItems = alignments[rowVerticalAlignment] || 'flex-start';
-        }
-        else {
-            var flexElements = getFlexboxElements(row.children);
-            if (flexElements.length === 0)
-                return;
-            // In the following steps, we remove and add elements to the guide.
-            // Therefore we precalculation the rowWidth to ensure it won't change
-            // in case of scrollbar will be added or removed from the screen.
-            var rowWidth = FlexboxPolyfill.getRowWidth(row);
-            var flexRows = FlexboxPolyfill.wrapFlexElementsInFlexRows(flexElements, row, rowWidth);
-            // Once we have all the pendo-mock-flexbox-element elements placed in to
-            // pendo-mock-flexbox-row rows, loop through each pendo-mock-flexbox-row and set the
-            // height and alignment
-            FlexboxPolyfill.formatFlexRows(flexRows, row, justifyContent, rowVerticalAlignment, rowWidth);
-        }
+    function initializeNativeFlexRow(row, justifyContent, rowVerticalAlignment) {
+        var alignments = {
+            top: 'flex-start',
+            center: 'center',
+            bottom: 'flex-end'
+        };
+        row.style.display = 'flex';
+        row.style.flexWrap = 'wrap';
+        row.style.justifyContent = justifyContent;
+        row.style.alignItems = alignments[rowVerticalAlignment] || 'flex-start';
+    }
+    function initializeFlexRows(row, justifyContent, rowVerticalAlignment, rowWidth) {
+        var flexElements = getFlexboxElements(row.children);
+        if (flexElements.length === 0)
+            return;
+        var flexRows = FlexboxPolyfill.wrapFlexElementsInFlexRows(flexElements, row, rowWidth);
+        // Once we have all the pendo-mock-flexbox-element elements placed in to
+        // pendo-mock-flexbox-row rows, loop through each pendo-mock-flexbox-row and set the
+        // height and alignment
+        FlexboxPolyfill.formatFlexRows(flexRows, row, justifyContent, rowVerticalAlignment, rowWidth);
     }
     function wrapFlexElementsInFlexRows(flexElements, row, rowWidthPreCalc) {
         var rowWidth = rowWidthPreCalc || getRowWidth(row);
@@ -18347,10 +18370,17 @@ var FlexboxPolyfill = (function () {
     function flexElement(ele, useNativeFlexbox) {
         var rowsToBeFlexed = dom('[data-pendo-display-flex]', ele);
         _.each(rowsToBeFlexed, function (row) {
-            var rowWithFlexedElements = useNativeFlexbox ? row : FlexboxPolyfill.initializeFlexElements(row);
             var horizontalAlignment = row.getAttribute('data-pendo-justify-content');
             var rowVerticalAlignment = row.getAttribute('data-row-vertical-alignment');
-            FlexboxPolyfill.initializeFlexRows(rowWithFlexedElements, horizontalAlignment, rowVerticalAlignment, useNativeFlexbox);
+            if (useNativeFlexbox) {
+                FlexboxPolyfill.initializeNativeFlexRow(row, horizontalAlignment, rowVerticalAlignment);
+                return;
+            }
+            // Initializing flex elements can add a temporary scrollbar to a scrolling ancestor and shrink the
+            // width of the rows. Pre-measure the row width to prevent its children from wrapping onto a new row.
+            var rowWidth = FlexboxPolyfill.getRowWidth(row);
+            var rowWithFlexedElements = FlexboxPolyfill.initializeFlexElements(row);
+            FlexboxPolyfill.initializeFlexRows(rowWithFlexedElements, horizontalAlignment, rowVerticalAlignment, rowWidth);
         });
     }
     function flexAllThings(containerId, step) {
@@ -22914,7 +22944,7 @@ function stepShowingProc(guide, step) {
         step.checkPlacement();
         return;
     }
-    var isTooltip = (step.type === 'tooltip' || step.attributes.calculatedType === 'tooltip');
+    var isTooltip = isTooltipStep(step);
     if (isTooltip && wouldBeVisibleAfterAutoScroll(element) && elementMatchesContainsRules) {
         // the element was scrolled out of view, the guide should be invisible for now, but still "active"
         return;
@@ -23716,10 +23746,9 @@ function attachP1AdvanceActions(step, guide, pendo) {
         return;
     if (isBadge(guide) && !isWalkthrough(guide))
         return;
-    const { _ } = pendo;
-    const htmlLayoutType = _.get(step, 'attributes.buildingBlockLayoutType', step.buildingBlockLayoutType);
-    if (!_.contains([htmlLayoutType, step.type], 'tooltip'))
+    if (!isTooltipStep(step))
         return;
+    const { _ } = pendo;
     const advanceMethods = step.advanceMethod.split(',');
     _.each(advanceMethods, (method) => {
         if (method === 'element') {
@@ -23959,12 +23988,6 @@ var popoverStep = {
     script: popoverRuntimeScript
 };
 
-function isTooltip({ _ }, step) {
-    const tooltip = 'tooltip';
-    return _.get(step, 'attributes.calculatedType') === tooltip ||
-        _.get(step, 'attributes.buildingBlockLayoutType', step.buildingBlockLayoutType) === tooltip ||
-        step.type === tooltip;
-}
 function attachScrollHandlers({ _ }, step, scrollCallback) {
     const throttledScrollCallback = _.throttle(_.bind(scrollCallback, step, step), 10);
     step.attachEvent(window, 'scroll', throttledScrollCallback, true);
@@ -23992,7 +24015,7 @@ function attachStepScrollHandlers(step, guide, pendo) {
     // APP-68789
     if (isPreviewing() && step.element === dom.getBody())
         return;
-    if (isTooltip(pendo, step)) {
+    if (isTooltipStep(step)) {
         const repositionCallback = step.domJson ? bbRepositionTooltip : p1RepositionTooltip;
         attachScrollHandlers(pendo, step, _.partial(tooltipOnScroll, pendo, step, repositionCallback));
     }
@@ -24691,11 +24714,17 @@ var canStepBeRendered = function (step) {
     if (targetElem && step.elementContainsRulesList && !doesElementMatchContainsRules(targetElem, step.elementContainsRulesList)) {
         return statusWriter(false, 'contains_rules');
     }
-    const embedSelector = _.get(step, 'guide.attributes.embedConfig.selector');
-    if (embedSelector && !dom(embedSelector).length) {
-        return false;
+    const embedConfig = _.get(step, 'guide.attributes.embedConfig');
+    if (embedConfig && embedConfig.selector) {
+        const embedHost = dom(embedConfig.selector)[0];
+        if (!embedHost) {
+            return false;
+        }
+        if (embedConfig.method === 'replace' && isEmbedHostReplacedByAnotherGuide(step.guide, embedHost)) {
+            return false;
+        }
     }
-    var isTooltip = step.type === 'tooltip' || BuildingBlockTooltips.isBuildingBlockGuideRelativeToElement(step);
+    var isTooltip = isTooltipStep(step) || BuildingBlockTooltips.isBuildingBlockGuideRelativeToElement(step);
     var isVisible = isElementVisible(elm);
     if (!isTooltip) {
         return statusWriter(isVisible, 'target_element');
@@ -24706,6 +24735,14 @@ var canStepBeRendered = function (step) {
     const wouldBeVisible = wouldBeVisibleAfterAutoScroll(elm);
     return statusWriter(wouldBeVisible, 'target_element_tooltip_scroll');
 };
+function isEmbedHostReplacedByAnotherGuide(guide, embedHost) {
+    return _.some(getActiveGuides(), function (other) {
+        if (other === guide || !_.isFunction(other.isShown) || !other.isShown())
+            return false;
+        const otherEmbedConfig = _.get(other, 'attributes.embedConfig');
+        return !!otherEmbedConfig && otherEmbedConfig.method === 'replace' && dom(otherEmbedConfig.selector)[0] === embedHost;
+    });
+}
 function pullContentsFromTargetElement(ele) {
     var wrappedEle = dom(ele);
     var eleText = wrappedEle.text() || ''; // .text() can return undefined
@@ -25549,9 +25586,12 @@ function hasLegacyGuides(guides, pendo) {
     if (pendo && pendo.designer)
         return true;
     return _.any(guides, function (guide) {
-        if (isForm(guide))
+        if (isForm(guide) || guide.editorType === 'html')
             return false;
         return _.any(guide.steps, function (step) {
+            // HTML steps load their content from htmlContentUrl and ship their own styles
+            if (step.type === 'html')
+                return false;
             return !(step.domUrl || step.domJsonpUrl || step.domJson);
         });
     });
@@ -29734,10 +29774,6 @@ const PluginAPI = {
         removeGlobalScript: GuideRuntime.removeGlobalScript
     },
     GuideActivity,
-    GuideEvents: {
-        stageGuideEvent,
-        createGuideEvent
-    },
     GuideLoop: {
         addUpdatePhase,
         removeUpdatePhase
@@ -29943,6 +29979,19 @@ function initIdentityEvents() {
     };
 }
 
+/**
+ * The cookie consent tier, or tiers, the visitor has already agreed to. Each tier is the id of a cookie consent
+ * level configured for your subscription, and determines what data the web SDK can collect: visitor identity,
+ * analytics events, guides, and session replay. If not set, the web SDK runs without any consent restrictions.
+ * Use `pendo.updateCookieConsent` to change consent after initialization. Read more about
+ * [Cookie Consent Levels](/cookies/consent-levels).
+ *
+ * @access public
+ * @category Config/Core
+ * @name cookieConsentTiers
+ * @default undefined
+ * @type {string | string[]}
+ */
 const CONSENT_TIERS = 'cookieConsentTiers';
 function applyCookieConsent(tiers, identity) {
     rememberConsentTiers(tiers);
@@ -29964,18 +30013,21 @@ function isCurrentCookieConsent(tiers) {
 }
 /**
  * Enforces the cookie consent policy a visitor has agreed to. The policy is defined by the subscription's cookie consent configuration,
- * and is used to determine whether each product the web SDK may run.
+ * and is used to determine what data the web SDK can collect. The new tiers replace any previously consented tiers,
+ * including those passed to `pendo.initialize` as `cookieConsentTiers`, and are shared with other frames running the web SDK for the same application.
  *
  * A visitor who was not being tracked has no identity for the web SDK to resume, so pass one in
  * `identity` when the new tiers start allowing identity. It is ignored otherwise.
  *
+ * Read more about [Cookie Consent Levels](/cookies/consent-levels).
+ *
  * @access public
  * @category Core
  * @param {string | string[]} tiers tier or tiers the visitor consented to
  * @param {object} [identity] visitor and account to identify, in the same shape as
  *   `pendo.updateOptions` -- applied only when consent moves a do-not-track visitor to a tier
  *   that permits identity
- * @returns {object} map of product to its resolved value -- `guides` and `identity` are
+ * @returns {object} what data is now collected -- `guides` and `identity` are
  *   booleans (identity disabled means DNT), `textCollection` is `none`/`whitelist`/`all`,
  *   `analytics` and `guideAnalytics` are each an array of allowed event types
  * @example
@@ -34011,7 +34063,11 @@ var GuideDisplay = (function () {
             return false;
         }
         step.lock();
-        return AsyncContent.fetchContent(step).then(function () {
+        // Prefer the step's own fetchContent so a plugin-defined step (e.g. HTML
+        // guides) can supply its content; for building-block steps it is
+        // AsyncContent.fetchContent anyway
+        var contentPromise = _.isFunction(step.fetchContent) ? step.fetchContent() : AsyncContent.fetchContent(step);
+        return contentPromise.then(function () {
             if (step.type !== 'whatsnew' && !step.isShown()) {
                 return false;
             }
@@ -37040,6 +37096,16 @@ function registerModules(store) {
     store.registerModule('networkUrl', NetworkUrlModule);
 }
 
+// Shared by guide automations (ActionAutomation) and the agent-workflows invoke_action tool, so an
+// element is clicked the same way whichever of them drives it.
+function simulateClick(element) {
+    element.dispatchEvent(new MouseEvent('pointerdown', { bubbles: true, cancelable: true }));
+    element.dispatchEvent(new MouseEvent('mousedown', { bubbles: true, cancelable: true }));
+    element.dispatchEvent(new MouseEvent('pointerup', { bubbles: true, cancelable: true }));
+    element.dispatchEvent(new MouseEvent('mouseup', { bubbles: true, cancelable: true }));
+    element.click();
+}
+
 var ActionAutomation = (function () {
     let _;
     var pendoGlobal;
@@ -37063,7 +37129,7 @@ var ActionAutomation = (function () {
         getElement,
         getValue,
         injectText,
-        simulateClick,
+        simulateClick: simulateClick$1,
         isAutomationInQueue,
         popQueue,
         setActive
@@ -37112,12 +37178,8 @@ var ActionAutomation = (function () {
         changeEvent.simulated = true; // for React ≤ 15.6.0
         element.dispatchEvent(changeEvent);
     }
-    function simulateClick(element) {
-        element.dispatchEvent(new MouseEvent('pointerdown', { bubbles: true, cancelable: true }));
-        element.dispatchEvent(new MouseEvent('mousedown', { bubbles: true, cancelable: true }));
-        element.dispatchEvent(new MouseEvent('pointerup', { bubbles: true, cancelable: true }));
-        element.dispatchEvent(new MouseEvent('mouseup', { bubbles: true, cancelable: true }));
-        element.click();
+    function simulateClick$1(element) {
+        simulateClick(element);
     }
     function isAutomationInQueue(automation) {
         return !!_.find(this.automationQueue, function (item) {
@@ -41557,8 +41619,9 @@ var P1GuidePlugin = (function () {
     // Adds a close button to the guide
     function CloseButton(guide) {
         var step = this;
-        // We only want to have the agent add close buttons to legacy guides, not building block inserts
-        if (step.domJson || step.domJsonpUrl)
+        // We only want to have the agent add close buttons to legacy guides, not building block
+        // inserts or HTML guides (which have no domJson either)
+        if (step.domJson || step.domJsonpUrl || step.type === 'html')
             return step;
         step.after('render', function () {
             if (!step.guideElement || !step.guideElement.length)
@@ -41575,7 +41638,7 @@ var P1GuidePlugin = (function () {
     // Adds pendo credits to the guide unless disabled
     function Credits() {
         var step = this;
-        if (!step.hideCredits && !step.domJson && !step.domJsonpUrl && !isForm(step.guide)) {
+        if (!step.hideCredits && !step.domJson && !step.domJsonpUrl && step.type !== 'html' && !isForm(step.guide)) {
             step.after('render', function () {
                 _addCredits(step.guideElement[0]);
             });
@@ -52817,6 +52880,42 @@ class SessionRecorder {
             return null;
         }
     }
+    /**
+     * Run URL attributes in snapshot and mutation events through the Location API attribute transforms, the same
+     * ones applied to elementPath.
+     *
+     * @access private
+     * @param event The rrweb event being handled
+     */
+    applyAttributeTransforms(event) {
+        const _ = this.pendo._;
+        if (_.isEmpty(_.get(this.api.store.state, 'nodeAttr.transforms')))
+            return;
+        const getAttribute = this.api.store.getters['nodeAttr/getAttribute']();
+        const transformAttributes = (attributes) => {
+            _.each(attributes, (value, name) => {
+                // same as rrweb's absolutizing, leave same-document refs (svg <use href="#id">), data: and blob: URLs alone
+                if (!_.isString(value) || /^(#|data:|blob:)/.test(value))
+                    return;
+                // rrweb renames an iframe's src to rr_src when it can't access the frame's document
+                const attrName = name === 'rr_src' ? 'src' : name;
+                attributes[name] = getAttribute({ [attrName]: value }, attrName);
+            });
+        };
+        const transformNode = (node) => {
+            if (!node)
+                return;
+            transformAttributes(node.attributes);
+            _.each(node.childNodes, transformNode);
+        };
+        if (event.type === EVENT_TYPES.FULL_SNAPSHOT) {
+            transformNode(event.data.node);
+        }
+        else if (event.type === EVENT_TYPES.INCREMENTAL_SNAPSHOT && event.data.source === EVENT_TYPES.INCREMENTAL_SOURCE_MUTATION) {
+            _.each(event.data.adds, (add) => transformNode(add.node));
+            _.each(event.data.attributes, (item) => transformAttributes(item.attributes));
+        }
+    }
     /**
      * Handle new rrweb events coming in. This will also make sure that we are properly sending a "keyframe"
      * as the BE expects it. A "keyframe" should consist of only the events needed to start a recording. This includes
@@ -52885,6 +52984,7 @@ class SessionRecorder {
             }
             this.send();
         }
+        this.applyAttributeTransforms(event);
         this.buffer.push(event);
         if (isSnapshot) {
             this.lastKeyFrameTime = event.timestamp;