@pendo/agent 2.315.0 → 2.316.0

package/dist/pendo.module.js

@@ -2891,6 +2891,17 @@ var ConfigReader = (function () {
          */
         addOption('dataHost', [SNIPPET_SRC, PENDO_CONFIG_SRC]);
         addOption('disableAutoInitialize');
+        /**
+         * If set to `true` the web SDK will wait for the host application to be both loaded and visible before
+         * starting the initialization process.
+         *
+         * @access public
+         * @category Config/Core
+         * @name initializeWhenVisible
+         * @default false
+         * @type {boolean}
+         */
+        addOption('initializeWhenVisible', [SNIPPET_SRC, PENDO_CONFIG_SRC], false);
         /**
          * Although the name refers to cookies, if set to `true` the web SDK will not persist any data in local
          * storage or cookies and will rely only on memory.
@@ -3945,8 +3956,8 @@ let SERVER = '';
 let ASSET_HOST = '';
 let ASSET_PATH = '';
 let DESIGNER_SERVER = '';
-let VERSION = '2.315.0_';
-let PACKAGE_VERSION = '2.315.0';
+let VERSION = '2.316.0_';
+let PACKAGE_VERSION = '2.316.0';
 let LOADER = 'xhr';
 /* eslint-enable web-sdk-eslint-rules/no-gulp-env-references */
 /**
@@ -11866,13 +11877,10 @@ var messageValidator = function (msg) {
         var data = typeof msg.data === 'string' ? JSON.parse(msg.data) : msg.data;
         var origin = msg.origin;
         var source = msg.source;
-        if (data.action || data.mutation) {
-            return; // Ignore action messages
-        }
-        if (!data.type || typeof data.type !== 'string') {
-            log.debug('Invalid Message: Missing \'type\' in data format');
+        if (data.action || data.mutation)
+            return;
+        if (!data.type || typeof data.type !== 'string')
             return;
-        }
         return { data, origin, source };
     }
     catch (e) {
@@ -14098,6 +14106,22 @@ var whenLoadedCall = function (callback, win) {
     }
     return _.noop;
 };
+const whenVisibleCall = (callback, win = window) => {
+    const { document } = win;
+    const waitForVis = ConfigReader.get('initializeWhenVisible', false);
+    if (!waitForVis || document.visibilityState === 'visible') {
+        callback();
+        return _.noop;
+    }
+    const stopVisListener = attachEventInternal(document, 'visibilitychange', () => {
+        if (document.visibilityState === 'visible') {
+            callback();
+            // need to shut this down immediately as visibility can continue to change
+            stopVisListener();
+        }
+    });
+    return stopVisListener;
+};
 
 /**
  * Returns the normalized URL sent from the backend. This won't always
@@ -26082,7 +26106,7 @@ var loadGuideJs = function (apiKey, params) {
     var guideRequestId = _.uniqueId();
     var deferred = q.defer();
     if (mostRecentGuideRequest && mostRecentGuideRequest.deferred) {
-        mostRecentGuideRequest.deferred.reject('newRequest'); // make sure that we don't leave open any promises if multiple guide requests are made in quick succession
+        mostRecentGuideRequest.deferred.resolve(); // make sure that we don't leave open any promises if multiple guide requests are made in quick succession
     }
     mostRecentGuideRequest = {
         id: guideRequestId,
@@ -26368,11 +26392,6 @@ var loadGuides = function (apiKey, visitorId, page, callback) {
             }
         }
     }).catch(function (err) {
-        if (err === 'newRequest') {
-            log.info('Guide load cancelled due to new request');
-            deferred.resolve('Guide load cancelled due to new request');
-            return;
-        }
         log.info(`Error in loadGuideJs, shutting down guides, err: ${_.get(err, 'message', err || 'Unknown error')}`);
         Events.guidesFailed.trigger();
         deferred.reject(err);
@@ -28166,6 +28185,344 @@ var GuideActivity = (function () {
     }
 })();
 
+function arrayEquals(array1, array2) {
+    if (array1.length != array2.length)
+        return false;
+    return _.all(array1, function (item, i) {
+        return item === array2[i];
+    });
+}
+class DOMActivationPhase {
+    constructor(DOMActivation) {
+        this.maxTargets = 50;
+        this.domActivation = DOMActivation;
+        this.name = 'dom';
+        this.queue = [];
+    }
+    markDirty() {
+        this.queue.push.apply(this.queue, this.domActivation.guides);
+    }
+    process(monitor) {
+        var domActivationGuide = this.queue.shift();
+        if (!domActivationGuide)
+            return;
+        monitor.saveContext(domActivationGuide);
+        var targets;
+        try {
+            targets = SizzleProxy(domActivationGuide.selector);
+        }
+        catch (e) {
+            targets = [];
+        }
+        if (targets.length > this.maxTargets) {
+            targets.length = this.maxTargets;
+        }
+        if (!arrayEquals(targets, domActivationGuide.targets)) {
+            domActivationGuide.targets = targets;
+            this.domActivation.detach(domActivationGuide, this.domActivation.targets);
+            _.each(targets, function (target) {
+                this.domActivation.attach(target, domActivationGuide, this.domActivation.targets);
+            }, this);
+        }
+    }
+    handleProcessTimeExceeded(monitor) {
+        const ctx = monitor.getContext();
+        if (ctx) {
+            log.warn('Element activated guide (' + ctx.id + ') timeout exceeded');
+        }
+    }
+    cancel() {
+        this.queue.length = 0;
+    }
+    isComplete() {
+        return !this.queue.length;
+    }
+}
+var DOMActivation = (function () {
+    var keyAttr = 'pendoTargetId';
+    var pluginApi;
+    /*
+    domActivatedGuides = [
+        {
+            id: 'aGuideId',
+            events: ['click', 'mouseover'],
+            selector: '.selector .for .target',
+            targets: [array, of, dom, references]
+        }
+    ]
+    */
+    var domActivatedGuides = [];
+    /*
+    activationTargets = {
+        aGuideId: 'aTargetId',
+        aTargetId: {
+            target: {{referenceToDomElement}},
+            events: {
+                click: {
+                    guideIds: {
+                        aGuideId: 1,
+                        anotherGuideId: 1
+                    },
+                    fn: {{partial(eventHandler, guideIds)}}
+                },
+                mouseover: {{same format as click}}
+            }
+        }
+        {{more guide and target ids...}}
+    }
+    */
+    var activationTargets = {};
+    var domPhase;
+    return {
+        name: 'DOMActivation',
+        key: keyAttr,
+        guides: domActivatedGuides,
+        targets: activationTargets,
+        reset,
+        init,
+        attach: attachGuideToTarget,
+        detach: detachGuideFromTarget,
+        handler: eventHandler,
+        activates,
+        prefetch,
+        initialize,
+        teardown
+    };
+    function initialize(pendo, PluginAPI) {
+        pluginApi = PluginAPI;
+        PluginAPI.Events.on('deliverablesLoaded', reset);
+        PluginAPI.Events.on('guideListChanged', handleGuideListChanged);
+        PluginAPI.Events.on('guidesLoaded', handleGuidesLoaded);
+        domPhase = new DOMActivationPhase(DOMActivation);
+        addUpdatePhase(domPhase);
+    }
+    function teardown() {
+        removeUpdatePhase(domPhase);
+        pluginApi.Events.off('deliverablesLoaded', reset);
+        pluginApi.Events.off('guideListChanged', handleGuideListChanged);
+        pluginApi.Events.off('guidesLoaded', handleGuidesLoaded);
+    }
+    function handleGuideListChanged() {
+        reset();
+        init(getLocalActiveGuides());
+    }
+    function handleGuidesLoaded() {
+        prefetch(getLocalActiveGuides());
+    }
+    function attachGuideToTarget(target, domActivationGuide, activationTargets) {
+        var targetKey = target[keyAttr];
+        var handler = targetKey ? activationTargets[targetKey] : null;
+        if (!handler) {
+            targetKey = targetKey || 'target' + _.uniqueId();
+            handler = {
+                target,
+                events: {}
+            };
+            activationTargets[targetKey] = handler;
+            target[keyAttr] = targetKey;
+        }
+        var targetList = activationTargets[domActivationGuide.id] || [];
+        targetList.push(targetKey);
+        activationTargets[domActivationGuide.id] = targetList;
+        _.each(domActivationGuide.events, function (eventType) {
+            var eventTypeHandler = handler.events[eventType];
+            if (!eventTypeHandler) {
+                eventTypeHandler = {
+                    guideIds: {}
+                };
+                eventTypeHandler.fn = _.partial(eventHandler, _, eventTypeHandler.guideIds);
+                if (eventType === 'mouseover') {
+                    eventType = 'mouseenter';
+                }
+                attachEvent(target, eventType, eventTypeHandler.fn);
+                handler.events[eventType] = eventTypeHandler;
+            }
+            eventTypeHandler.guideIds[domActivationGuide.id] = 1;
+        });
+    }
+    function detachGuideFromTarget(domActivationGuide, activationTargets) {
+        _.each(activationTargets[domActivationGuide.id], function (targetKey) {
+            var handler = targetKey ? activationTargets[targetKey] : null;
+            if (handler) {
+                _.each(handler.events, function (eventTypeHandler, eventType) {
+                    if (eventTypeHandler && eventTypeHandler.guideIds) {
+                        delete eventTypeHandler.guideIds[domActivationGuide.id];
+                        if (_.size(eventTypeHandler.guideIds) <= 0) {
+                            if (eventType === 'mouseover') {
+                                eventType = 'mouseenter';
+                            }
+                            detachEvent(handler.target, eventType, eventTypeHandler.fn);
+                            delete handler.events[eventType];
+                        }
+                    }
+                });
+                if (_.size(handler.events) <= 0) {
+                    delete handler.target[keyAttr];
+                    handler.target = null;
+                    delete activationTargets[targetKey];
+                }
+            }
+        });
+        delete activationTargets[domActivationGuide.id];
+    }
+    function eventHandler(e, guideIds) {
+        if (e.pendoActivatedGuide || dom.data.get(e, 'advanced')) {
+            return;
+        }
+        var prioritizeAdoptGuides = ConfigReader.get('adoptPrioritizeAdoptGuides');
+        var guides = _.compact(_.map(_.keys(guideIds), function (id) {
+            return findGuideById(id);
+        }));
+        guides = _.filter(guides, function (guide) {
+            if (!guide.steps || !guide.steps.length) {
+                return false;
+            }
+            if (_.get(guide, 'attributes.dom.isOnlyShowOnce')) {
+                return !guide.steps[0].hasBeenSeen();
+            }
+            return true;
+        });
+        guides = _(guides).chain()
+            .sortBy(function (guide) {
+            return guide.state === 'staged' ? 0 : 1;
+        })
+            .sortBy(function (guide) {
+            var isAdoptGuide = guide.isTraining;
+            if (prioritizeAdoptGuides) {
+                return isAdoptGuide ? 0 : 1;
+            }
+            return isAdoptGuide ? 1 : 0;
+        })
+            .value();
+        var activatedGuide = _.find(guides, function (guide) {
+            var firstStep = _.first(guide.steps);
+            var isResourceCenter = _.get(guide, 'attributes.resourceCenter', false);
+            if (isResourceCenter && guide.isShown()) {
+                return BuildingBlockResourceCenter.dismissResourceCenter();
+            }
+            if (!firstStep.canShow())
+                return false;
+            if (guide.isShown())
+                return true;
+            return showGuide(firstStep, 'dom');
+        });
+        if (activatedGuide) {
+            e.pendoActivatedGuide = activatedGuide.id;
+        }
+    }
+    function reset() {
+        _.each(domActivatedGuides, function (domActivationGuide) {
+            detachGuideFromTarget(domActivationGuide, activationTargets);
+            domActivationGuide.targets = [];
+        });
+        domActivatedGuides.length = 0;
+    }
+    function activates(guide) {
+        if (!guide.id || !guide.steps || !guide.steps.length || !guide.hasLaunchMethod('dom'))
+            return;
+        if (!guide.steps[0].canShowOnPage(getNormalizedUrl()))
+            return;
+        var events = _.get(guide, 'attributes.activation.event', []);
+        if (!events || !events.length)
+            return;
+        var selector = getActivationSelector(guide);
+        if (!selector)
+            return;
+        return {
+            id: guide.id,
+            events,
+            selector,
+            targets: []
+        };
+    }
+    function init(guideList) {
+        _.each(guideList, function (guide) {
+            var domActivatedGuide = activates(guide);
+            if (domActivatedGuide) {
+                domActivatedGuides.push(domActivatedGuide);
+            }
+        });
+    }
+    function prefetch(guides) {
+        if (ConfigReader.get('disablePrefetch')) {
+            return;
+        }
+        _.each(guides, function (guide) {
+            if (!_.isFunction(guide.hasLaunchMethod) || !guide.hasLaunchMethod('dom'))
+                return;
+            if (!guide.steps || !guide.steps.length || !_.isFunction(guide.steps[0].fetchContent))
+                return;
+            guide.steps[0].fetchContent(true);
+        });
+    }
+})();
+
+function AdvanceTrigger(element, method, step) {
+    this.element = element;
+    if (method == 'element') {
+        this.method = 'click';
+    }
+    else if (method == 'hover') {
+        this.method = 'mouseover';
+    }
+    else {
+        this.method = method;
+    }
+    this.step = step;
+    this.guide = step.getGuide();
+}
+AdvanceTrigger.prototype.add = function () {
+    if (_.indexOf(this.guide.steps, this.step) === 0 && !AdvanceTrigger.shouldAttachHandler(this.guide, this.method))
+        return;
+    if (!isBadge(this.guide) || isWalkthrough(this.guide)) {
+        this.setupElementEvent(this.element, this.method);
+    }
+};
+AdvanceTrigger.prototype.remove = function () {
+    this.teardownElementEvent(this.element, this.method);
+};
+// HTBD: (aka Here There Be Dragons)
+// Instead of detaching on hide, we're going to leave the
+// attach live until it's either advanced, dismissed or
+// re-rendered.  The reason for this is it's too easy for
+// a race case to happen where the hide for this guide can
+// happen before the element click event happens and thus we
+// never get the onguideadvanced action being called.
+AdvanceTrigger.prototype.setupElementEvent = function (element, evt) {
+    if (!this.advanceFn) {
+        this.advanceFn = _.compose(_.bind(this.teardownElementEvent, this, element, evt), _.bind(this.step.advance, this.step));
+    }
+    AdvanceTrigger.attach(this.step, element, evt, this.advanceFn);
+};
+AdvanceTrigger.prototype.teardownElementEvent = function (element, evt) {
+    log.info('detach onGuideAdvanced', { contexts: ['guide'] });
+    detachEvent(element, evt, this.advanceFn, true);
+    this.step.removeTrigger(this);
+};
+AdvanceTrigger.shouldAttachHandler = function shouldAttachHandler(guide, method) {
+    return !guide.isActivatedByEvent(method) ||
+        DOMActivation.activates(guide) ||
+        (guide.attributes.activation.selector !== guide.steps[0].elementPathRule &&
+            !!guide.attributes.activation.selector);
+};
+AdvanceTrigger.attach = function (step, element, evt, advanceFn) {
+    if (!step)
+        return;
+    var handlers = AdvanceTrigger.handlers = AdvanceTrigger.handlers || {};
+    var stepHandlers = handlers[step.id] = handlers[step.id] || [];
+    for (var i = 0; i < stepHandlers.length; ++i) {
+        var handler = stepHandlers[i];
+        if (element === handler[0] && evt === handler[1]) {
+            detachEvent(element, evt, handler[2], true);
+            stepHandlers.splice(_.indexOf(stepHandlers, handler), 1);
+            i--;
+        }
+    }
+    stepHandlers.push([element, evt, advanceFn]);
+    detachEvent(element, evt, advanceFn, true);
+    attachEvent(element, evt, advanceFn, true);
+};
+
 var registeredPlugins = [];
 var initialized$1 = false;
 const PluginAPI = {
@@ -28216,7 +28573,8 @@ const PluginAPI = {
         registerDisplayableGuides,
         removeDisplayableGuides,
         GuideFactory,
-        GuideStepFactory
+        GuideStepFactory,
+        AdvanceTrigger
     },
     hosts: {
         SERVER
@@ -28965,7 +29323,7 @@ function autoInitialize() {
     }
     flushCallQueue();
 }
-function startup(callQueue, autoInitialize, whenLoadedCall) {
+function startup(callQueue, autoInitialize) {
     const disableAutoInitialize = ConfigReader.get('disableAutoInitialize');
     if (disableAutoInitialize)
         return;
@@ -28975,7 +29333,9 @@ function startup(callQueue, autoInitialize, whenLoadedCall) {
         autoInitialize();
     }
     else {
-        teardownFns.push(whenLoadedCall(autoInitialize));
+        teardownFns.push(whenLoadedCall(() => {
+            teardownFns.push(whenVisibleCall(autoInitialize));
+        }));
     }
 }
 /**
@@ -34831,6 +35191,8 @@ const IFrameMonitor = (function () {
             return true;
         if (frame.pendo && (frame.pendo.initialize || frame.pendo.iframeWaiting))
             return true;
+        if (frame.document && frame.document.body && !frame.document.body.hasChildNodes())
+            return true;
         return scriptExists(frame);
     }
     function appendScriptTagToFrame(frame, agentUrl) {
@@ -34928,278 +35290,6 @@ const IFrameMonitor = (function () {
     }
 })();
 
-function arrayEquals(array1, array2) {
-    if (array1.length != array2.length)
-        return false;
-    return _.all(array1, function (item, i) {
-        return item === array2[i];
-    });
-}
-class DOMActivationPhase {
-    constructor(DOMActivation) {
-        this.maxTargets = 50;
-        this.domActivation = DOMActivation;
-        this.name = 'dom';
-        this.queue = [];
-    }
-    markDirty() {
-        this.queue.push.apply(this.queue, this.domActivation.guides);
-    }
-    process(monitor) {
-        var domActivationGuide = this.queue.shift();
-        if (!domActivationGuide)
-            return;
-        monitor.saveContext(domActivationGuide);
-        var targets;
-        try {
-            targets = SizzleProxy(domActivationGuide.selector);
-        }
-        catch (e) {
-            targets = [];
-        }
-        if (targets.length > this.maxTargets) {
-            targets.length = this.maxTargets;
-        }
-        if (!arrayEquals(targets, domActivationGuide.targets)) {
-            domActivationGuide.targets = targets;
-            this.domActivation.detach(domActivationGuide, this.domActivation.targets);
-            _.each(targets, function (target) {
-                this.domActivation.attach(target, domActivationGuide, this.domActivation.targets);
-            }, this);
-        }
-    }
-    handleProcessTimeExceeded(monitor) {
-        const ctx = monitor.getContext();
-        if (ctx) {
-            log.warn('Element activated guide (' + ctx.id + ') timeout exceeded');
-        }
-    }
-    cancel() {
-        this.queue.length = 0;
-    }
-    isComplete() {
-        return !this.queue.length;
-    }
-}
-var DOMActivation = (function () {
-    var keyAttr = 'pendoTargetId';
-    var pluginApi;
-    /*
-    domActivatedGuides = [
-        {
-            id: 'aGuideId',
-            events: ['click', 'mouseover'],
-            selector: '.selector .for .target',
-            targets: [array, of, dom, references]
-        }
-    ]
-    */
-    var domActivatedGuides = [];
-    /*
-    activationTargets = {
-        aGuideId: 'aTargetId',
-        aTargetId: {
-            target: {{referenceToDomElement}},
-            events: {
-                click: {
-                    guideIds: {
-                        aGuideId: 1,
-                        anotherGuideId: 1
-                    },
-                    fn: {{partial(eventHandler, guideIds)}}
-                },
-                mouseover: {{same format as click}}
-            }
-        }
-        {{more guide and target ids...}}
-    }
-    */
-    var activationTargets = {};
-    var domPhase;
-    return {
-        name: 'DOMActivation',
-        key: keyAttr,
-        guides: domActivatedGuides,
-        targets: activationTargets,
-        reset,
-        init,
-        attach: attachGuideToTarget,
-        detach: detachGuideFromTarget,
-        handler: eventHandler,
-        activates,
-        prefetch,
-        initialize,
-        teardown
-    };
-    function initialize(pendo, PluginAPI) {
-        pluginApi = PluginAPI;
-        PluginAPI.Events.on('deliverablesLoaded', reset);
-        PluginAPI.Events.on('guideListChanged', handleGuideListChanged);
-        PluginAPI.Events.on('guidesLoaded', handleGuidesLoaded);
-        domPhase = new DOMActivationPhase(DOMActivation);
-        addUpdatePhase(domPhase);
-    }
-    function teardown() {
-        removeUpdatePhase(domPhase);
-        pluginApi.Events.off('deliverablesLoaded', reset);
-        pluginApi.Events.off('guideListChanged', handleGuideListChanged);
-        pluginApi.Events.off('guidesLoaded', handleGuidesLoaded);
-    }
-    function handleGuideListChanged() {
-        reset();
-        init(getLocalActiveGuides());
-    }
-    function handleGuidesLoaded() {
-        prefetch(getLocalActiveGuides());
-    }
-    function attachGuideToTarget(target, domActivationGuide, activationTargets) {
-        var targetKey = target[keyAttr];
-        var handler = targetKey ? activationTargets[targetKey] : null;
-        if (!handler) {
-            targetKey = targetKey || 'target' + _.uniqueId();
-            handler = {
-                target,
-                events: {}
-            };
-            activationTargets[targetKey] = handler;
-            target[keyAttr] = targetKey;
-        }
-        var targetList = activationTargets[domActivationGuide.id] || [];
-        targetList.push(targetKey);
-        activationTargets[domActivationGuide.id] = targetList;
-        _.each(domActivationGuide.events, function (eventType) {
-            var eventTypeHandler = handler.events[eventType];
-            if (!eventTypeHandler) {
-                eventTypeHandler = {
-                    guideIds: {}
-                };
-                eventTypeHandler.fn = _.partial(eventHandler, _, eventTypeHandler.guideIds);
-                if (eventType === 'mouseover') {
-                    eventType = 'mouseenter';
-                }
-                attachEvent(target, eventType, eventTypeHandler.fn);
-                handler.events[eventType] = eventTypeHandler;
-            }
-            eventTypeHandler.guideIds[domActivationGuide.id] = 1;
-        });
-    }
-    function detachGuideFromTarget(domActivationGuide, activationTargets) {
-        _.each(activationTargets[domActivationGuide.id], function (targetKey) {
-            var handler = targetKey ? activationTargets[targetKey] : null;
-            if (handler) {
-                _.each(handler.events, function (eventTypeHandler, eventType) {
-                    if (eventTypeHandler && eventTypeHandler.guideIds) {
-                        delete eventTypeHandler.guideIds[domActivationGuide.id];
-                        if (_.size(eventTypeHandler.guideIds) <= 0) {
-                            if (eventType === 'mouseover') {
-                                eventType = 'mouseenter';
-                            }
-                            detachEvent(handler.target, eventType, eventTypeHandler.fn);
-                            delete handler.events[eventType];
-                        }
-                    }
-                });
-                if (_.size(handler.events) <= 0) {
-                    delete handler.target[keyAttr];
-                    handler.target = null;
-                    delete activationTargets[targetKey];
-                }
-            }
-        });
-        delete activationTargets[domActivationGuide.id];
-    }
-    function eventHandler(e, guideIds) {
-        if (e.pendoActivatedGuide || dom.data.get(e, 'advanced')) {
-            return;
-        }
-        var prioritizeAdoptGuides = ConfigReader.get('adoptPrioritizeAdoptGuides');
-        var guides = _.compact(_.map(_.keys(guideIds), function (id) {
-            return findGuideById(id);
-        }));
-        guides = _.filter(guides, function (guide) {
-            if (!guide.steps || !guide.steps.length) {
-                return false;
-            }
-            if (_.get(guide, 'attributes.dom.isOnlyShowOnce')) {
-                return !guide.steps[0].hasBeenSeen();
-            }
-            return true;
-        });
-        guides = _(guides).chain()
-            .sortBy(function (guide) {
-            return guide.state === 'staged' ? 0 : 1;
-        })
-            .sortBy(function (guide) {
-            var isAdoptGuide = guide.isTraining;
-            if (prioritizeAdoptGuides) {
-                return isAdoptGuide ? 0 : 1;
-            }
-            return isAdoptGuide ? 1 : 0;
-        })
-            .value();
-        var activatedGuide = _.find(guides, function (guide) {
-            var firstStep = _.first(guide.steps);
-            var isResourceCenter = _.get(guide, 'attributes.resourceCenter', false);
-            if (isResourceCenter && guide.isShown()) {
-                return BuildingBlockResourceCenter.dismissResourceCenter();
-            }
-            if (!firstStep.canShow())
-                return false;
-            if (guide.isShown())
-                return true;
-            return showGuide(firstStep, 'dom');
-        });
-        if (activatedGuide) {
-            e.pendoActivatedGuide = activatedGuide.id;
-        }
-    }
-    function reset() {
-        _.each(domActivatedGuides, function (domActivationGuide) {
-            detachGuideFromTarget(domActivationGuide, activationTargets);
-            domActivationGuide.targets = [];
-        });
-        domActivatedGuides.length = 0;
-    }
-    function activates(guide) {
-        if (!guide.id || !guide.steps || !guide.steps.length || !guide.hasLaunchMethod('dom'))
-            return;
-        if (!guide.steps[0].canShowOnPage(getNormalizedUrl()))
-            return;
-        var events = _.get(guide, 'attributes.activation.event', []);
-        if (!events || !events.length)
-            return;
-        var selector = getActivationSelector(guide);
-        if (!selector)
-            return;
-        return {
-            id: guide.id,
-            events,
-            selector,
-            targets: []
-        };
-    }
-    function init(guideList) {
-        _.each(guideList, function (guide) {
-            var domActivatedGuide = activates(guide);
-            if (domActivatedGuide) {
-                domActivatedGuides.push(domActivatedGuide);
-            }
-        });
-    }
-    function prefetch(guides) {
-        if (ConfigReader.get('disablePrefetch')) {
-            return;
-        }
-        _.each(guides, function (guide) {
-            if (!_.isFunction(guide.hasLaunchMethod) || !guide.hasLaunchMethod('dom'))
-                return;
-            if (!guide.steps || !guide.steps.length || !_.isFunction(guide.steps[0].fetchContent))
-                return;
-            guide.steps[0].fetchContent(true);
-        });
-    }
-})();
-
 var designer;
 function designerExports() {
     return {
@@ -35569,72 +35659,6 @@ var PromoteMetadata = (function () {
     }
 })();
 
-function AdvanceTrigger(element, method, step) {
-    this.element = element;
-    if (method == 'element') {
-        this.method = 'click';
-    }
-    else if (method == 'hover') {
-        this.method = 'mouseover';
-    }
-    else {
-        this.method = method;
-    }
-    this.step = step;
-    this.guide = step.getGuide();
-}
-AdvanceTrigger.prototype.add = function () {
-    if (_.indexOf(this.guide.steps, this.step) === 0 && !AdvanceTrigger.shouldAttachHandler(this.guide, this.method))
-        return;
-    if (!isBadge(this.guide) || isWalkthrough(this.guide)) {
-        this.setupElementEvent(this.element, this.method);
-    }
-};
-AdvanceTrigger.prototype.remove = function () {
-    this.teardownElementEvent(this.element, this.method);
-};
-// HTBD: (aka Here There Be Dragons)
-// Instead of detaching on hide, we're going to leave the
-// attach live until it's either advanced, dismissed or
-// re-rendered.  The reason for this is it's too easy for
-// a race case to happen where the hide for this guide can
-// happen before the element click event happens and thus we
-// never get the onguideadvanced action being called.
-AdvanceTrigger.prototype.setupElementEvent = function (element, evt) {
-    if (!this.advanceFn) {
-        this.advanceFn = _.compose(_.bind(this.teardownElementEvent, this, element, evt), _.bind(this.step.advance, this.step));
-    }
-    AdvanceTrigger.attach(this.step, element, evt, this.advanceFn);
-};
-AdvanceTrigger.prototype.teardownElementEvent = function (element, evt) {
-    log.info('detach onGuideAdvanced', { contexts: ['guide'] });
-    detachEvent(element, evt, this.advanceFn, true);
-    this.step.removeTrigger(this);
-};
-AdvanceTrigger.shouldAttachHandler = function shouldAttachHandler(guide, method) {
-    return !guide.isActivatedByEvent(method) ||
-        DOMActivation.activates(guide) ||
-        (guide.attributes.activation.selector !== guide.steps[0].elementPathRule &&
-            !!guide.attributes.activation.selector);
-};
-AdvanceTrigger.attach = function (step, element, evt, advanceFn) {
-    if (!step)
-        return;
-    var handlers = AdvanceTrigger.handlers = AdvanceTrigger.handlers || {};
-    var stepHandlers = handlers[step.id] = handlers[step.id] || [];
-    for (var i = 0; i < stepHandlers.length; ++i) {
-        var handler = stepHandlers[i];
-        if (element === handler[0] && evt === handler[1]) {
-            detachEvent(element, evt, handler[2], true);
-            stepHandlers.splice(_.indexOf(stepHandlers, handler), 1);
-            i--;
-        }
-    }
-    stepHandlers.push([element, evt, advanceFn]);
-    detachEvent(element, evt, advanceFn, true);
-    attachEvent(element, evt, advanceFn, true);
-};
-
 var TOOLTIP_DEFAULT_WIDTH = 430;
 var TOOLTIP_DEFAULT_HEIGHT = 200;
 var TOOLTIP_ARROW_SIZE = 15;
@@ -40646,7 +40670,7 @@ function initAgent(pendo, PendoConfig) {
     populatePendoObject(pendo);
     log.addEventListener('log', _.partial(store.dispatch, 'errorLog/write'));
     registerBuiltInPlugins();
-    startup(pendo._q, autoInitialize, whenLoadedCall);
+    startup(pendo._q, autoInitialize);
     return true;
 }
 
@@ -54401,7 +54425,15 @@ class SessionRecorder {
             this._startRecordingForVisitor(visitorConfig);
         }).catch((e) => {
             this.restartPtm();
-            this.api.log.critical('Failed to fetch recording config', { error: e });
+            if (e && /Failed to fetch/.test(e.toString())) {
+                return;
+            }
+            this.api.log.critical('Failed to fetch recording config', {
+                error: e,
+                visitorId: this.visitorId,
+                accountId: this.accountId,
+                url: this.pendo.url.get()
+            });
             this.logStopReason('VISITOR_CONFIG_ERROR');
         });
     }
@@ -55458,8 +55490,10 @@ var WorkerFactory = /*#__PURE__*/createInlineWorkerFactory(/* rollup-plugin-web-
 
     const ONE_HUNDRED_MB_IN_BYTES = 100 * 1024 * 1024;
     function matchHostedResources(recordingEvent, stringifiedRecordingPayload) {
-        const fontURLRegex = /https:\/\/[^\s]+?\.(woff2?|ttf|otf|eot)(\?[^\s]*)?\b/g;
-        const hostedResources = stringifiedRecordingPayload.match(fontURLRegex);
+        const fontURLRegex = /https:\/\/[^"\\\s]+?\.(woff2?|ttf|otf|eot)(\?[^"\\\s]*)?\b/g;
+        const matches = stringifiedRecordingPayload.match(fontURLRegex);
+        // de-duplicate matches
+        const hostedResources = matches ? Array.from(new Set(matches)) : [];
         return {
             type: 'recording',
             visitorId: recordingEvent.visitorId,
@@ -55474,7 +55508,7 @@ var WorkerFactory = /*#__PURE__*/createInlineWorkerFactory(/* rollup-plugin-web-
             recordingPayloadMetadata: [],
             sequence: 0,
             recordingPayloadCount: 0,
-            hostedResources: hostedResources || []
+            hostedResources
         };
     }
     // keep in mind changes here may need addressing in the extension worker proxy as well
@@ -56739,6 +56773,17 @@ var ConfigReader = (function () {
          */
         addOption('dataHost', [SNIPPET_SRC, PENDO_CONFIG_SRC]);
         addOption('disableAutoInitialize');
+        /**
+         * If set to `true` the web SDK will wait for the host application to be both loaded and visible before
+         * starting the initialization process.
+         *
+         * @access public
+         * @category Config/Core
+         * @name initializeWhenVisible
+         * @default false
+         * @type {boolean}
+         */
+        addOption('initializeWhenVisible', [SNIPPET_SRC, PENDO_CONFIG_SRC], false);
         /**
          * Although the name refers to cookies, if set to `true` the web SDK will not persist any data in local
          * storage or cookies and will rely only on memory.
@@ -58931,7 +58976,7 @@ const PREDICT_STEP_REGEX = /\$\$predict\$\$/;
 const DRAG_THRESHOLD = 5;
 const STYLE_ID = 'pendo-predict-plugin-styles';
 const PREDICT_BASE_URL = 'https://predict.pendo.io';
-const BUTTON_CLASS_IDENTIFIER = '._pendo-button-primaryButton:contains("token")';
+const GUIDE_BUTTON_IDENTIFIER = 'button:contains("token")';
 const pluginVersion = '1.0.0';
 const $ = (id) => document.getElementById(id);
 const createElement = (tag, attrs = {}, parent = null) => {
@@ -58950,10 +58995,13 @@ const createElement = (tag, attrs = {}, parent = null) => {
         parent.appendChild(el);
     return el;
 };
-const injectStyles = (pendoContainerId) => {
+const injectStyles = (pendoContainerId, log = () => { }) => {
     const styleId = `${STYLE_ID}-${pendoContainerId}`;
-    if ($(styleId))
+    if ($(styleId)) {
+        log(`[predict] style already exists, skipping: ${styleId}`);
         return;
+    }
+    log(`[predict] injecting styles: ${styleId}`);
     createElement('style', {
         id: styleId,
         textContent: `
@@ -59002,10 +59050,12 @@ const injectStyles = (pendoContainerId) => {
                 `
     }, document.head);
 };
-const getRecordIdFromUrl = (recordRegex) => {
+const getRecordIdFromUrl = (recordRegex, log = () => { }) => {
     var _a;
     const match = window.location.href.match(recordRegex);
-    return (_a = match === null || match === void 0 ? void 0 : match[1]) !== null && _a !== void 0 ? _a : null;
+    const recordId = (_a = match === null || match === void 0 ? void 0 : match[1]) !== null && _a !== void 0 ? _a : null;
+    log(`[predict] recordId found: ${recordId}`);
+    return recordId;
 };
 const safeStringify = (value, fallback) => {
     try {
@@ -59015,11 +59065,12 @@ const safeStringify = (value, fallback) => {
         return fallback !== null && fallback !== void 0 ? fallback : '';
     }
 };
-const safeParse = (value, fallback) => {
+const safeParse = (value, fallback, log = () => { }) => {
     try {
         return JSON.parse(value);
     }
     catch (error) {
+        log(`[predict] JSON parse error: ${error}`);
         return fallback;
     }
 };
@@ -59163,10 +59214,9 @@ const createFloatingModal = ({ recordId, configuration }) => {
     }, container);
     container.dragHandle = setupDragAndDrop(dragHandle, container);
     return () => {
-        var _a, _b, _c;
+        var _a, _b;
         (_b = (_a = container.dragHandle) === null || _a === void 0 ? void 0 : _a.cleanup) === null || _b === void 0 ? void 0 : _b.call(_a);
         container.remove();
-        const flatIds = (_c = configuration.analysisIds) === null || _c === void 0 ? void 0 : _c.flat(Infinity);
         for (let i = 0; i < flatIds.length; i++) {
             const frame = $(`frameExplanation-${flatIds[i]}`);
             if (frame)
@@ -59258,23 +59308,33 @@ const setupMessageListener = ({ token, cleanup, pendo }) => {
     window.addEventListener('message', messageHandler);
     return () => window.removeEventListener('message', messageHandler);
 };
-const predictGuidesScript = ({ step, pendo, cleanupArray, cleanup }) => {
+const predictGuidesScript = ({ step, pendo, cleanupArray, cleanup, log }) => {
     var _a;
-    if (cleanupArray.length > 0)
+    log('[predict] initializing');
+    // Before anything else, inject styles so that the guide will be hidden
+    const pendoContainerId = step === null || step === void 0 ? void 0 : step.containerId;
+    injectStyles(pendoContainerId, log);
+    if (cleanupArray.length > 0) {
+        log('[predict] cleanupArray is not empty');
         return;
+    }
     // ----- Extract Configuration -----
-    const pendoButtonPrimaryButton = (_a = step.guideElement.find(BUTTON_CLASS_IDENTIFIER)) === null || _a === void 0 ? void 0 : _a[0];
-    if (!pendoButtonPrimaryButton)
+    const guideButton = (_a = step.guideElement.find(GUIDE_BUTTON_IDENTIFIER)) === null || _a === void 0 ? void 0 : _a[0];
+    if (!guideButton) {
+        log('[predict] no guide button found, aborting');
         return;
-    const _b = safeParse(pendoButtonPrimaryButton.textContent, null), { token } = _b, configuration = __rest(_b, ["token"]);
-    if (!configuration)
+    }
+    const _b = safeParse(guideButton.textContent, {}, log), { token } = _b, configuration = __rest(_b, ["token"]);
+    if (!configuration || !token) {
+        log('[predict] no configuration found, aborting');
         return;
-    const pendoContainerId = step === null || step === void 0 ? void 0 : step.containerId;
-    injectStyles(pendoContainerId);
-    const recordRegex = new RegExp(`/${configuration.recordRegexName}/([a-zA-Z0-9]{15,18})(?:/|$)`);
-    const recordId = getRecordIdFromUrl(recordRegex);
-    if (!recordId)
+    }
+    const recordRegex = new RegExp(`/${configuration.recordRegexName}/([a-zA-Z0-9]+)(?:/|$)`);
+    const recordId = getRecordIdFromUrl(recordRegex, log);
+    if (!recordId) {
+        log('[predict] no recordId found in URL, aborting');
         return;
+    }
     cleanupArray.push(setupMessageListener({ token, cleanup, pendo }));
     cleanupArray.push(createFloatingModal({ recordId, configuration }));
 };
@@ -59283,11 +59343,13 @@ const PredictGuides = () => {
     let pluginApiRef = null;
     let cleanupArray = [];
     const cleanup = () => {
+        var _a;
+        (_a = pluginApiRef === null || pluginApiRef === void 0 ? void 0 : pluginApiRef.log) === null || _a === void 0 ? void 0 : _a.debug('[predict] cleaning up');
         for (let i = 0; i < cleanupArray.length; i++) {
             try {
                 cleanupArray[i]();
             }
-            catch (_a) { }
+            catch (_b) { }
         }
         cleanupArray = [];
     };
@@ -59302,11 +59364,12 @@ const PredictGuides = () => {
         const predictGuidesEnabled = configReader.get(PREDICT_GUIDES_CONFIG);
         if (!predictGuidesEnabled)
             return;
+        const log = PluginAPI.log.debug.bind(PluginAPI.log);
         pluginApiRef.Events.urlChanged.on(cleanup);
         const script = {
             name: 'PredictFrameScript',
             script(step, _guide, pendo) {
-                predictGuidesScript({ step, pendo, cleanupArray, cleanup });
+                predictGuidesScript({ step, pendo, cleanupArray, cleanup, log });
                 this.on('unmounted', (evt) => {
                     if (evt.reason !== 'hidden')
                         cleanup();