@pendo/agent 2.287.0 → 2.288.0

package/dist/dom.esm.js

@@ -7287,7 +7287,7 @@ function getScreenPosition(element) {
     };
 }
 
-var VERSION = '2.287.0_';
+var VERSION = '2.288.0_';
 
 var decodeURIComponent = _.isFunction(window.decodeURIComponent) ? window.decodeURIComponent : _.identity;
 

package/dist/pendo.module.js

@@ -3903,8 +3903,8 @@ var SERVER = '';
 var ASSET_HOST = '';
 var ASSET_PATH = '';
 var DESIGNER_SERVER = '';
-var VERSION = '2.287.0_';
-var PACKAGE_VERSION = '2.287.0';
+var VERSION = '2.288.0_';
+var PACKAGE_VERSION = '2.288.0';
 var LOADER = 'xhr';
 /* eslint-enable agent-eslint-rules/no-gulp-env-references */
 /**
@@ -12149,8 +12149,13 @@ class LocalStorageEventBuffer {
         * @label UNSENT_EVENTS_KEY
         */
         storage.registry.addLocal(UNSENT_EVENTS_KEY);
-        this.events = JSON.parse(storage.read(UNSENT_EVENTS_KEY) || '{}');
-        storage.clear(UNSENT_EVENTS_KEY);
+        try {
+            this.events = JSON.parse(storage.read(UNSENT_EVENTS_KEY) || '{}');
+            storage.clear(UNSENT_EVENTS_KEY);
+        }
+        catch (e) {
+            this.events = {};
+        }
     }
     write(storage) {
         if (_.size(this.events) > 0) {
@@ -38060,7 +38065,7 @@ const FormValidation = (function () {
 })();
 
 class DOMPrompt {
-    constructor(pendo, PluginAPI, id, privacyFitlers, inputCssSelector, submitCssSelector) {
+    constructor(pendo, PluginAPI, id, privacyFilters, inputCssSelectors, submitCssSelectors) {
         this.listeners = [];
         this.latestPromptValue = '';
         this.dom = pendo.dom;
@@ -38068,27 +38073,69 @@ class DOMPrompt {
         this.api = PluginAPI;
         this.q = PluginAPI.q;
         this.id = id;
-        this.setFilters(privacyFitlers);
-        this.inputEl = new this.dom.Element(inputCssSelector);
-        this.submitEl = new this.dom.Element(submitCssSelector);
-        this.inputEl.addEventListener('change', (evt) => {
-            // capture value from copy / paste
-            this.capturePromptValue();
-        }, true);
-        this.inputEl.addEventListener('keydown', (evt) => {
-            const wasEnterKey = evt.code === 'Enter' || evt.key === 'Enter' || evt.keyCode === 13;
-            if (wasEnterKey) {
-                this.submit(this.latestPromptValue);
+        this.setFilters(privacyFilters);
+        if (!this._.isArray(inputCssSelectors)) {
+            this.api.log.error('inputCssSelectors must be an array, received:', typeof inputCssSelectors);
+            inputCssSelectors = [];
+        }
+        if (!this._.isArray(submitCssSelectors)) {
+            this.api.log.error('submitCssSelectors must be an array, received:', typeof submitCssSelectors);
+            submitCssSelectors = [];
+        }
+        this.inputEls = this._.map(inputCssSelectors, cssSelector => new this.dom.Element(cssSelector));
+        this.submitEls = this._.map(submitCssSelectors, cssSelector => new this.dom.Element(cssSelector));
+        this.setupInputListeners();
+        this.setupSubmitListeners();
+        this.setupObserver();
+    }
+    setupInputListeners() {
+        this._.each(this.inputEls, (inputEl) => {
+            if (!inputEl) {
+                return;
             }
-        }, true);
-        this.inputEl.addEventListener('keyup', (evt) => {
-            this.capturePromptValue();
-        }, true);
-        this.submitEl.addEventListener('click', () => {
-            this.submit(this.latestPromptValue);
-        }, true);
+            inputEl.addEventListener('change', (evt) => {
+                // capture value from copy / paste
+                this.capturePromptValue();
+            }, true);
+            inputEl.addEventListener('keydown', (evt) => {
+                const wasEnterKey = evt.code === 'Enter' || evt.key === 'Enter' || evt.keyCode === 13;
+                if (wasEnterKey) {
+                    this.submit(this.latestPromptValue);
+                }
+            }, true);
+            inputEl.addEventListener('keyup', (evt) => {
+                this.capturePromptValue();
+            }, true);
+        });
+    }
+    setupSubmitListeners() {
+        this._.each(this.submitEls, (submitEl) => {
+            if (!submitEl) {
+                return;
+            }
+            const clickHandler = (evt) => {
+                // Capture current value at mousedown time, before app's click handlers run
+                const currentValue = this.getPromptValue();
+                const valueToSubmit = currentValue || this.latestPromptValue;
+                this.submit(valueToSubmit);
+            };
+            submitEl.addEventListener('mousedown', clickHandler, true);
+            const keydownHandler = (evt) => {
+                const wasEnterKey = evt.code === 'Enter' || evt.key === 'Enter' || evt.keyCode === 13;
+                if (wasEnterKey) {
+                    const currentValue = this.getPromptValue();
+                    const valueToSubmit = currentValue || this.latestPromptValue;
+                    this.submit(valueToSubmit);
+                }
+            };
+            submitEl.addEventListener('keydown', keydownHandler, true);
+        });
+    }
+    setupObserver() {
         this.promptContainer = new this.dom.Observer();
-        this.promptContainer.addObservers(this.inputEl, this.submitEl);
+        const validInputEls = this._.filter(this.inputEls, el => el);
+        const validSubmitEls = this._.filter(this.submitEls, el => el);
+        this.promptContainer.addObservers(...validInputEls, ...validSubmitEls);
     }
     setFilters(candidateFilter) {
         if (!candidateFilter) {
@@ -38111,11 +38158,10 @@ class DOMPrompt {
         return candidateValue.replace(filtersToUse, 'redacted');
     }
     submit(origVal) {
-        // Don't submit an empty prompt
-        if (!origVal)
+        if (!origVal) {
             return;
+        }
         const val = this.applyPrivacyFilter(origVal);
-        // build the payload: id, value, was filter used
         const payload = {
             agentId: this.id,
             prompt: val,
@@ -38124,7 +38170,7 @@ class DOMPrompt {
         this._.each(this.listeners, (cb) => cb(payload));
     }
     /*
-    * Genernally we want to capture the value from "input" but there can be implementation
+    * Generally we want to capture the value from "input" but there can be implementation
     * dependent scenarios where the input's value has already been cleared by the time
     * the event handler is called. So, in that case, we don't want to throw our saved value out.
     */
@@ -38136,15 +38182,44 @@ class DOMPrompt {
         return tmp;
     }
     getPromptValue() {
-        return this.inputEl.getText();
+        const elementWithValue = this._.find(this.inputEls, (el) => {
+            if (el) {
+                try {
+                    const value = el.getText();
+                    return value && value.trim();
+                }
+                catch (err) {
+                    return false;
+                }
+            }
+            return false;
+        });
+        if (elementWithValue) {
+            try {
+                const value = elementWithValue.getText();
+                return value.trim();
+            }
+            catch (err) { }
+        }
+        return '';
     }
     onSubmit(callback) {
         this.listeners.push(callback);
     }
     teardown() {
-        this.promptContainer.teardown();
-        this.inputEl.teardown();
-        this.submitEl.teardown();
+        if (this.promptContainer) {
+            this.promptContainer.teardown();
+        }
+        this._.each(this.inputEls, (inputEl) => {
+            if (inputEl) {
+                inputEl.teardown();
+            }
+        });
+        this._.each(this.submitEls, (submitEl) => {
+            if (submitEl) {
+                submitEl.teardown();
+            }
+        });
     }
 }
 
@@ -38269,17 +38344,19 @@ class PromptPlugin {
     }
     observePrompt(config) {
         const { id, cssSelectors, privacyFilters } = config;
-        let inputCssSelector, submitCssSelector;
-        inputCssSelector = this.parseCssSelector('input', cssSelectors);
-        submitCssSelector = this.parseCssSelector('submit', cssSelectors);
-        const prompt = new DOMPrompt(this.pendo, this.api, id, privacyFilters, inputCssSelector, submitCssSelector);
+        let inputCssSelectors, submitCssSelectors;
+        inputCssSelectors = this.parseCssSelector('input', cssSelectors);
+        submitCssSelectors = this.parseCssSelector('submit', cssSelectors);
+        const prompt = new DOMPrompt(this.pendo, this.api, id, privacyFilters, inputCssSelectors, submitCssSelectors);
         prompt.onSubmit((promptPayload) => {
             this.sendEvent(promptPayload);
         });
         this.prompts.push(prompt);
     }
     parseCssSelector(type, configs) {
-        return this._.find(configs, (target) => target.type === type).cssSelector;
+        const filtered = this._.filter(configs, cfg => cfg.type === type);
+        const selectors = this._.map(filtered, cfg => cfg.cssSelector);
+        return selectors;
     }
     sendEvent(promptEvent) {
         const event = this._.extend({
@@ -47234,6 +47311,12 @@ class SessionRecorder {
         * will ensure that it and the snapshot events are sent together and first for the next session of events.
         */
         if (isMeta) {
+            // Replace the URL captured by rrweb for META events with the location API aware version of the URL. This
+            // makes sure the URL captured in replay respects any URL modification/obfuscation set up by end users
+            // using the location API.
+            if (this.pendo._.has(event, 'data.href')) {
+                event.data.href = this.pendo.location.getHref();
+            }
             this.send();
         }
         this.buffer.push(event);