@sailfish-ai/recorder 1.10.7 → 1.10.9

package/dist/inAppReportIssueModal/index.js

@@ -21,14 +21,66 @@ export const ReportIssueContext = {
     triageBaseUrl: "https://app.sailfishqa.com",
     deactivateIsolation: () => { },
     integrationData: null,
+    showEngTicketFieldsDefault: false,
 };
 let modalEl = null;
+let effectiveShowEngTicketFields = false;
 // Function to set up custom multiselect listeners
 function setupCustomMultiSelectListeners(fieldId, onChange) {
     const container = document.getElementById(`${fieldId}-container`);
     const dropdown = document.getElementById(`${fieldId}-dropdown`);
     if (!container || !dropdown)
         return;
+    // Helper to rebuild chips display from current selection state
+    function updateChipsDisplay() {
+        const selectedValues = [];
+        const selectedChips = [];
+        dropdown.querySelectorAll(".sf-multiselect-option").forEach((opt) => {
+            const optEl = opt;
+            if (optEl.dataset.selected === "true") {
+                const value = optEl.dataset.value || "";
+                const label = optEl.textContent?.trim() || "";
+                selectedValues.push(value);
+                selectedChips.push(`<span class="sf-multiselect-chip" data-value="${value}" style="display:inline-flex; align-items:center; gap:4px; background:#e5e7eb; color:#374151; padding:2px 8px; border-radius:16px; font-size:13px; white-space:nowrap;">
+            ${label}
+            <span class="sf-multiselect-chip-remove" data-value="${value}" style="cursor:pointer; display:inline-flex; align-items:center; font-size:16px; line-height:1; color:#6b7280;" onclick="event.stopPropagation();">&times;</span>
+          </span>`);
+            }
+        });
+        const chipsContainer = container.querySelector(".sf-multiselect-chips");
+        if (chipsContainer) {
+            chipsContainer.innerHTML =
+                selectedChips.join("") ||
+                    '<span style="color:#9ca3af;">Select...</span>';
+            // Re-bind chip remove listeners
+            chipsContainer
+                .querySelectorAll(".sf-multiselect-chip-remove")
+                .forEach((removeBtn) => {
+                removeBtn.addEventListener("click", (e) => {
+                    e.stopPropagation();
+                    const value = removeBtn.dataset.value || "";
+                    // Deselect the option in the dropdown
+                    const opt = dropdown.querySelector(`.sf-multiselect-option[data-value="${value}"]`);
+                    if (opt) {
+                        opt.dataset.selected = "false";
+                        opt.style.backgroundColor = "";
+                    }
+                    updateChipsDisplay();
+                    // Collect remaining selected values
+                    const remaining = [];
+                    dropdown
+                        .querySelectorAll(".sf-multiselect-option")
+                        .forEach((o) => {
+                        if (o.dataset.selected === "true") {
+                            remaining.push(o.dataset.value || "");
+                        }
+                    });
+                    onChange(remaining);
+                });
+            });
+        }
+        return selectedValues;
+    }
     // Handle option clicks
     const options = dropdown.querySelectorAll(".sf-multiselect-option");
     options.forEach((option) => {
@@ -45,27 +97,12 @@ function setupCustomMultiSelectListeners(fieldId, onChange) {
             else {
                 optionEl.style.backgroundColor = "";
             }
-            // Get all selected values and labels
-            const selectedValues = [];
-            const selectedLabels = [];
-            dropdown.querySelectorAll(".sf-multiselect-option").forEach((opt) => {
-                const optEl = opt;
-                if (optEl.dataset.selected === "true") {
-                    selectedValues.push(optEl.dataset.value || "");
-                    selectedLabels.push(optEl.textContent || "");
-                }
-            });
-            // Update input display
-            const input = container.querySelector(".sf-multiselect-input span");
-            const displayText = selectedLabels.join(", ");
-            if (input) {
-                input.textContent = displayText || "Select...";
-                input.style.color = displayText ? "#000" : "#9ca3af";
-            }
-            // Call onChange callback
+            const selectedValues = updateChipsDisplay();
             onChange(selectedValues);
         });
     });
+    // Bind chip remove listeners for any pre-selected values
+    updateChipsDisplay();
     // Close dropdown on outside click
     document.addEventListener("click", (e) => {
         const target = e.target;
@@ -126,7 +163,7 @@ function generateEngTicketFieldsHTML() {
         </label>
         <select id="sf-eng-ticket-team"
           style="width:100%; padding:8px 12px; font-size:14px; border:1px solid #cbd5e1; border-radius:6px; outline:none; appearance:none; cursor:pointer; background-color: white; color: #9ca3af;">
-          <option value="" disabled selected style="color: #9ca3af;">Select team...</option>
+          <option value="" selected style="color: #9ca3af;">Select team...</option>
         </select>
       </div>
     `;
@@ -139,7 +176,7 @@ function generateEngTicketFieldsHTML() {
       </label>
       <select id="sf-eng-ticket-project"
         style="width:100%; padding:8px 12px; font-size:14px; border:1px solid #cbd5e1; border-radius:6px; outline:none; appearance:none; cursor:pointer; background-color: white; color: #9ca3af;">
-        <option value="" disabled selected style="color: #9ca3af;">Select project...</option>
+        <option value="" selected style="color: #9ca3af;">Select project...</option>
       </select>
     </div>
   `;
@@ -152,7 +189,7 @@ function generateEngTicketFieldsHTML() {
         </label>
         <select id="sf-eng-ticket-type"
           style="width:100%; padding:8px 12px; font-size:14px; border:1px solid #cbd5e1; border-radius:6px; outline:none; appearance:none; cursor:pointer; background-color: white; color: #9ca3af;">
-          <option value="" disabled selected style="color: #9ca3af;">Select project first...</option>
+          <option value="" selected style="color: #9ca3af;">Select project first...</option>
         </select>
       </div>
     `;
@@ -186,7 +223,7 @@ function generateEngTicketFieldsHTML() {
         </label>
         <select id="sf-eng-ticket-sprint"
           style="width:100%; padding:8px 12px; font-size:14px; border:1px solid #cbd5e1; border-radius:6px; outline:none; appearance:none; cursor:pointer; background-color: white; color: #9ca3af;">
-          <option value="" disabled selected style="color: #9ca3af;">Select sprint...</option>
+          <option value="" selected style="color: #9ca3af;">Select sprint...</option>
         </select>
       </div>
     `;
@@ -267,6 +304,8 @@ export function setupIssueReporting(options) {
     ReportIssueContext.backendApi = options.backendApi;
     ReportIssueContext.resolveSessionId = options.getSessionId;
     ReportIssueContext.integrationData = options.integrationData || null;
+    ReportIssueContext.showEngTicketFieldsDefault =
+        options.showEngTicketFieldsInReportIssueModalDefault ?? false;
     if (options.customBaseUrl)
         ReportIssueContext.triageBaseUrl = options.customBaseUrl;
     ReportIssueContext.shortcuts = mergeShortcutsConfig(options.shortcuts);
@@ -340,11 +379,13 @@ function getSessionIdSafely() {
     }
     return ReportIssueContext.resolveSessionId();
 }
-export function openReportIssueModal() {
+export function openReportIssueModal(options) {
     if (isRecording) {
         stopRecording();
         return;
     }
+    effectiveShowEngTicketFields =
+        options?.showEngTicketFields ?? ReportIssueContext.showEngTicketFieldsDefault;
     injectModalHTML();
     if (modalEl)
         document.body.appendChild(modalEl);
@@ -672,7 +713,7 @@ function injectModalHTML(initialMode = "lookback") {
             Create an Issue
           </label>
 
-          <label id="sf-create-eng-ticket-label" style="display:${ReportIssueContext.integrationData ? "flex" : "none"}; align-items:center; gap:8px; font-size:14px; font-weight:500; cursor:pointer;">
+          <label id="sf-create-eng-ticket-label" style="display:${ReportIssueContext.integrationData && effectiveShowEngTicketFields ? "flex" : "none"}; align-items:center; gap:8px; font-size:14px; font-weight:500; cursor:pointer;">
             <input type="checkbox" id="sf-create-eng-ticket-checkbox" ${currentState.createEngTicket ? "checked" : ""}
               style="width:16px; height:16px; accent-color:#295DBF; cursor:pointer;">
             Create an Eng Ticket
@@ -694,7 +735,7 @@ function injectModalHTML(initialMode = "lookback") {
         </div>
 
         <!-- Engineering Ticket Fields (shown when create eng ticket is checked) -->
-        <div id="sf-eng-ticket-fields-container" style="display:${currentState.createEngTicket ? "block" : "none"}; margin-top: ${currentState.createIssue ? "12px" : "0"};">
+        <div id="sf-eng-ticket-fields-container" style="display:${currentState.createEngTicket && ReportIssueContext.integrationData ? "block" : "none"}; margin-top: ${currentState.createIssue ? "12px" : "0"};">
           ${generateEngTicketFieldsHTML()}
         </div>
       </div>
@@ -769,10 +810,12 @@ function injectModalHTML(initialMode = "lookback") {
                     renderDynamicFields(currentState.engTicketProject, currentState.engTicketIssueType);
                 }
             }
-            // If integration just became available, show the checkbox
-            const label = document.getElementById("sf-create-eng-ticket-label");
-            if (label) {
-                label.style.display = "flex";
+            // If integration just became available, show the checkbox (only if eng ticket fields are enabled)
+            if (effectiveShowEngTicketFields) {
+                const label = document.getElementById("sf-create-eng-ticket-label");
+                if (label) {
+                    label.style.display = "flex";
+                }
             }
         });
     }
@@ -1407,45 +1450,58 @@ async function createTriage(startTimestamp, endTimestamp, description) {
     try {
         showStatusModal(true);
         const response = await createTriageFromRecorder(ReportIssueContext.apiKey, ReportIssueContext.backendApi, getSessionIdSafely(), startTimestamp, endTimestamp, description);
+        if (response?.errors?.length) {
+            const errorMsg = response.errors.map((e) => e.message).join("; ");
+            console.error("GraphQL error creating triage:", errorMsg);
+            showStatusModal(false, null, errorMsg);
+            return;
+        }
         const triageId = response?.data?.createTriageFromRecorder?.id;
         if (triageId) {
             showStatusModal(false, { type: "triage", id: triageId });
         }
         else {
             console.error("No Triage ID returned from backend.");
-            showStatusModal(false, null);
+            showStatusModal(false, null, "No triage was created. Please try again.");
         }
     }
     catch (error) {
         console.error("Error creating triage:", error);
-        showStatusModal(false, null);
+        showStatusModal(false, null, "Something went wrong. Please try again.");
     }
 }
 async function createTriageAndIssue(startTimestamp, endTimestamp, description, issueName, issueDescription, createEngTicket, engTicketTeam, engTicketProject, engTicketPriority, engTicketLabels, engTicketIssueType, engTicketCustomFields) {
     try {
         showStatusModal(true);
         const response = await createTriageAndIssueFromRecorder(ReportIssueContext.apiKey, ReportIssueContext.backendApi, getSessionIdSafely(), startTimestamp, endTimestamp, description, issueName, issueDescription, createEngTicket, engTicketTeam, engTicketProject, engTicketPriority, engTicketLabels, engTicketIssueType, engTicketCustomFields);
+        if (response?.errors?.length) {
+            const errorMsg = response.errors.map((e) => e.message).join("; ");
+            console.error("GraphQL error creating triage and issue:", errorMsg);
+            showStatusModal(false, null, errorMsg);
+            return;
+        }
         const issueId = response?.data?.createTriageAndIssueFromRecorder?.id;
         if (issueId) {
             showStatusModal(false, { type: "issue", id: issueId });
         }
         else {
             console.error("No Issue ID returned from backend.");
-            showStatusModal(false, null);
+            showStatusModal(false, null, "No issue was created. Please try again.");
         }
     }
     catch (error) {
         console.error("Error creating triage and issue:", error);
-        showStatusModal(false, null);
+        showStatusModal(false, null, "Something went wrong. Please try again.");
     }
 }
-function showStatusModal(isLoading, result) {
+function showStatusModal(isLoading, result, errorMessage) {
     const triageId = result?.type === "triage" ? result.id : undefined;
     const issueId = result?.type === "issue" ? result.id : undefined;
-    showTriageStatusModal(isLoading, triageId, issueId);
+    showTriageStatusModal(isLoading, triageId, issueId, errorMessage);
 }
-function showTriageStatusModal(isLoading, triageId, issueId) {
+function showTriageStatusModal(isLoading, triageId, issueId, errorMessage) {
     removeExistingModals();
+    const isError = !isLoading && errorMessage;
     // Prefer issue URL if available, otherwise use triage URL
     const resultUrl = issueId
         ? `${ReportIssueContext.triageBaseUrl}/issues/${issueId}?from=inAppReportIssue`
@@ -1462,10 +1518,16 @@ function showTriageStatusModal(isLoading, triageId, issueId) {
         alignItems: "center",
         justifyContent: "center",
     });
-    const statusTitle = isLoading ? "Reporting Issue..." : "Issue reported!";
+    const statusTitle = isLoading
+        ? "Reporting Issue..."
+        : isError
+            ? "Failed to report issue"
+            : "Issue reported!";
     const statusSubtitle = isLoading
         ? `<p style="font-size:14px; color:#64748b; line-height:20px;">This may take ~10 seconds</p>`
-        : "";
+        : isError
+            ? `<p style="font-size:14px; color:#ef4444; line-height:20px;">${errorMessage}</p>`
+            : "";
     const spinner = isLoading
         ? `<div style="display:flex; justify-content:center; align-items:center; padding: 40px 0;">
         <div style="width:24px; height:24px; border:2px solid #295dbf; border-top:2px solid white; border-radius:50%; animation:spin 1s linear infinite;"></div>
@@ -1496,11 +1558,11 @@ function showTriageStatusModal(isLoading, triageId, issueId) {
         </svg>
       </button>
 
-      <h2 style="font-size:18px; font-weight:600; margin-bottom:${isLoading ? 8 : 40}px; line-height:28px;">${statusTitle}</h2>
+      <h2 style="font-size:18px; font-weight:600; margin-bottom:${isLoading || isError ? 8 : 40}px; line-height:28px;">${statusTitle}</h2>
       ${statusSubtitle}
       ${spinner}
 
-      <div style="display:flex; justify-content:flex-end; align-items:center; gap:8px;">
+      <div style="display:${isError ? "none" : "flex"}; justify-content:flex-end; align-items:center; gap:8px;">
         <button id="sf-copy-triage-link"
           style="background:white; border:1px solid #e2e8f0; padding:8px 16px; border-radius:6px;
           font-size:14px; color: #0f172a; cursor:pointer;">
@@ -1555,8 +1617,10 @@ function showTriageStatusModal(isLoading, triageId, issueId) {
                 window.open(resultUrl, "_blank");
             }
         });
-        // Auto-hide after success
-        setTimeout(() => fadeCardAndRemove(container, card, 300), 10000);
+        // Auto-hide after success (not on error, so user can read the message)
+        if (!isError) {
+            setTimeout(() => fadeCardAndRemove(container, card, 300), 10000);
+        }
     }
 }
 function fadeCardAndRemove(container, card, durationMs = 300) {

package/dist/inAppReportIssueModal/integrations.js

@@ -61,7 +61,6 @@ export async function refreshIntegrationData(apiKey, backendApi) {
 export function populateSelectOptions(selectElement, options, defaultValue) {
     const placeholderOption = document.createElement("option");
     placeholderOption.value = "";
-    placeholderOption.disabled = true;
     placeholderOption.selected = !defaultValue;
     placeholderOption.textContent = "Select...";
     placeholderOption.style.color = "#9ca3af";
@@ -129,7 +128,6 @@ export function populateSprintOptions(selectElement, sprints, currentValue) {
     // Placeholder option
     const placeholderOption = document.createElement("option");
     placeholderOption.value = "";
-    placeholderOption.disabled = true;
     placeholderOption.selected = !currentValue;
     placeholderOption.textContent = "Select sprint...";
     placeholderOption.style.color = "#9ca3af";
@@ -194,7 +192,6 @@ export function updateIssueTypeOptions(selectElement, projectId) {
     selectElement.innerHTML = "";
     const placeholderOption = document.createElement("option");
     placeholderOption.value = "";
-    placeholderOption.disabled = true;
     placeholderOption.textContent = "Select...";
     placeholderOption.style.color = "#9ca3af";
     selectElement.appendChild(placeholderOption);

package/dist/inAppReportIssueModal/types.js

@@ -14,4 +14,5 @@ export const ReportIssueContext = {
     triageBaseUrl: "https://app.sailfishqa.com",
     deactivateIsolation: () => { },
     integrationData: null,
+    showEngTicketFieldsDefault: false,
 };

package/dist/inAppReportIssueModal/ui.js

@@ -3,10 +3,17 @@ export function renderCustomMultiSelect(fieldId, fieldName, options, selectedVal
     const requiredMark = isRequired
         ? '<span style="color:#ef4444;">*</span>'
         : "";
-    const selectedLabels = options
+    const selectedChips = options
         .filter((opt) => selectedValues.includes(opt.id || opt.value || opt.name || opt))
-        .map((opt) => opt.name || opt.value || opt)
-        .join(", ");
+        .map((opt) => {
+        const value = opt.id || opt.value || opt.name || opt;
+        const label = opt.name || opt.value || opt;
+        return `<span class="sf-multiselect-chip" data-value="${value}" style="display:inline-flex; align-items:center; gap:4px; background:#e5e7eb; color:#374151; padding:2px 8px; border-radius:16px; font-size:13px; white-space:nowrap;">
+        ${label}
+        <span class="sf-multiselect-chip-remove" data-value="${value}" style="cursor:pointer; display:inline-flex; align-items:center; font-size:16px; line-height:1; color:#6b7280;" onclick="event.stopPropagation();">&times;</span>
+      </span>`;
+    })
+        .join("");
     const optionsHTML = options
         .map((opt) => {
         const value = opt.id || opt.value || opt.name || opt;
@@ -25,9 +32,9 @@ export function renderCustomMultiSelect(fieldId, fieldName, options, selectedVal
         ${fieldName} ${requiredMark}
       </label>
       <div class="sf-custom-multiselect" id="${fieldId}-container" data-field-id="${fieldId}" style="position:relative;">
-        <div class="sf-multiselect-input" style="width:100%; padding:8px 12px; font-size:14px; border:1px solid #cbd5e1; border-radius:6px; background-color:white; cursor:pointer; min-height:38px; display:flex; align-items:center;" onclick="document.getElementById('${fieldId}-dropdown').style.display = document.getElementById('${fieldId}-dropdown').style.display === 'none' ? 'block' : 'none';">
-          <span style="color:${selectedLabels ? "#000" : "#9ca3af"}; flex:1;">${selectedLabels || "Select..."}</span>
-          <svg width="16" height="16" viewBox="0 0 16 16" fill="none" style="margin-left:8px;">
+        <div class="sf-multiselect-input" style="width:100%; padding:8px 12px; font-size:14px; border:1px solid #cbd5e1; border-radius:6px; background-color:white; cursor:pointer; min-height:38px; display:flex; align-items:center; flex-wrap:wrap; gap:4px;" onclick="document.getElementById('${fieldId}-dropdown').style.display = document.getElementById('${fieldId}-dropdown').style.display === 'none' ? 'block' : 'none';">
+          <span class="sf-multiselect-chips" style="display:flex; flex-wrap:wrap; gap:4px; flex:1;">${selectedChips || `<span style="color:#9ca3af;">Select...</span>`}</span>
+          <svg width="16" height="16" viewBox="0 0 16 16" fill="none" style="margin-left:8px; flex-shrink:0;">
             <path d="M4 6L8 10L12 6" stroke="#64748B" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/>
           </svg>
         </div>
@@ -183,7 +190,7 @@ export function renderDynamicField(field, fieldValue, users = []) {
               style="${baseInputStyle} appearance:none; cursor:pointer; background-color: white; ${!hasValue ? "color: #9ca3af;" : ""}"
               ${isRequired ? "required" : ""}
             >
-              <option value="" disabled ${!hasValue ? "selected" : ""} style="color: #9ca3af;">Select ${fieldName.toLowerCase()}...</option>
+              <option value="" ${!hasValue ? "selected" : ""} style="color: #9ca3af;">Select ${fieldName.toLowerCase()}...</option>
               ${options}
             </select>
           </div>
@@ -214,7 +221,7 @@ export function renderDynamicField(field, fieldValue, users = []) {
               style="${baseInputStyle} appearance:none; cursor:pointer; background-color: white; ${!hasValue ? "color: #9ca3af;" : ""}"
               ${isRequired ? "required" : ""}
             >
-              <option value="" disabled ${!hasValue ? "selected" : ""} style="color: #9ca3af;">Select ${fieldName.toLowerCase()}...</option>
+              <option value="" ${!hasValue ? "selected" : ""} style="color: #9ca3af;">Select ${fieldName.toLowerCase()}...</option>
               ${options}
             </select>
           </div>

package/dist/index.js

@@ -12,6 +12,7 @@ import { getUrlAndStoredUuids, initializeConsolePlugin, initializeDomContentEven
 import { HAS_DOCUMENT, HAS_LOCAL_STORAGE, HAS_SESSION_STORAGE, HAS_WINDOW, } from "./runtimeEnv";
 import { ensureSessionListeners, getOrSetSessionId } from "./session";
 import { withAppUrlMetadata } from "./utils";
+import { onNavigationChange } from "./websocket";
 import { clearStaleFuncSpanState, getFuncSpanHeader, isFunctionSpanTrackingEnabled, restoreFuncSpanState, sendEvent, sendMessage, } from "./websocket";
 import { yieldToMain } from "./scheduler";
 const DEBUG = readDebugFlag(); // A wrapper around fetch that suppresses connection refused errors
@@ -146,7 +147,7 @@ function trackDomainChangesOnce() {
         if (forceSend || currentDomain !== lastDomain) {
             lastDomain = currentDomain;
             const pageVisitUUID = uuidv4();
-            const prevPageVisitUUID = sessionStorage.getItem("pageVisitUUID");
+            const prevPageVisitUUID = sessionStorage.getItem("pageVisitUUID") ?? "";
             sessionStorage.setItem("pageVisitUUID", pageVisitUUID);
             sessionStorage.setItem("prevPageVisitUUID", prevPageVisitUUID);
             invalidateUrlCache();
@@ -163,6 +164,8 @@ function trackDomainChangesOnce() {
         }
     };
     const debouncedCheck = debounce(() => checkDomainChange(), 500);
+    // Fire immediately on pushState/replaceState/popstate — don't wait for interval
+    onNavigationChange(() => checkDomainChange());
     // Force the first check to send the initial URL on load
     checkDomainChange(true);
     // Start a single interval and remember it
@@ -1044,13 +1047,20 @@ export async function startRecording({ apiKey, backendApi = "https://api-service
         captureStreamPrefixKb,
         captureStreamTimeoutMs,
     };
-    // 1a. XHR interceptor
+    // Seed pageVisitUUID in sessionStorage so the fetch/XHR interceptors can
+    // build a complete X-Sf3-Rid header on the very first request.
+    // trackDomainChangesOnce() sets this later (after WS connect), but that's
+    // too late — requests fire before the first await completes.
+    if (!sessionStorage.getItem("pageVisitUUID")) {
+        sessionStorage.setItem("pageVisitUUID", uuidv4());
+        invalidateUrlCache();
+    }
+    // 1a. XHR + Fetch interceptors (must both run synchronously before any yield,
+    //     so fire-and-forget callers patch fetch before frameworks capture it)
     if (!g.xhrPatched) {
         setupXMLHttpRequestInterceptor(domainsToNotPropagateHeaderTo, bodyCaptureConfig);
         g.xhrPatched = true;
     }
-    await yieldToMain();
-    // 1b. Fetch interceptor
     if (!g.fetchPatched) {
         setupFetchInterceptor(domainsToNotPropagateHeaderTo, bodyCaptureConfig);
         g.fetchPatched = true;
@@ -1215,6 +1225,7 @@ export const initRecorder = async (options) => {
                     shortcuts: options.reportIssueShortcuts,
                     customBaseUrl: options.customBaseUrl,
                     integrationData,
+                    showEngTicketFieldsInReportIssueModalDefault: options.showEngTicketFieldsInReportIssueModalDefault,
                 });
                 g.issueReportingInit = true;
             }

package/dist/recorder.cjs

@@ -1,4 +1,4 @@
 "use strict";
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
-const e = require("./chunks/index-BlPJWz9y.js");
-exports.DEFAULT_CAPTURE_SETTINGS = e.DEFAULT_CAPTURE_SETTINGS, exports.DEFAULT_CONSOLE_RECORDING_SETTINGS = e.DEFAULT_CONSOLE_RECORDING_SETTINGS, exports.STORAGE_VERSION = e.STORAGE_VERSION, exports.addOrUpdateMetadata = e.addOrUpdateMetadata, exports.buildBatches = e.buildBatches, exports.clearStaleFuncSpanState = e.clearStaleFuncSpanState, exports.createTriageAndIssueFromRecorder = e.createTriageAndIssueFromRecorder, exports.createTriageFromRecorder = e.createTriageFromRecorder, exports.disableFunctionSpanTracking = e.disableFunctionSpanTracking, exports.enableFunctionSpanTracking = e.enableFunctionSpanTracking, exports.ensureHrefCache = e.ensureHrefCache, exports.eventSize = e.eventSize, exports.fetchAndSendIp = e.fetchAndSendIp, exports.fetchCaptureSettings = e.fetchCaptureSettings, exports.fetchEngineeringTicketPlatformIntegrations = e.fetchEngineeringTicketPlatformIntegrations, exports.fetchFunctionSpanTrackingEnabled = e.fetchFunctionSpanTrackingEnabled, exports.flushBufferedEvents = e.flushBufferedEvents, exports.getCachedHref = e.getCachedHref, exports.getCachedHrefNoQuery = e.getCachedHrefNoQuery, exports.getFuncSpanHeader = e.getFuncSpanHeader, exports.getOrSetSessionId = e.getOrSetSessionId, exports.getUrlAndStoredUuids = e.getUrlAndStoredUuids, exports.identify = e.identify, exports.initRecorder = e.initRecorder, exports.initializeConsolePlugin = e.initializeConsolePlugin, exports.initializeDomContentEvents = e.initializeDomContentEvents, exports.initializeFunctionSpanTrackingFromApi = e.initializeFunctionSpanTrackingFromApi, exports.initializeRecording = e.initializeRecording, exports.initializeWebSocket = e.initializeWebSocket, exports.invalidateUrlCache = e.invalidateUrlCache, exports.isFunctionSpanTrackingEnabled = e.isFunctionSpanTrackingEnabled, exports.matchUrlWithWildcard = e.matchUrlWithWildcard, Object.defineProperty(exports, "nowTimestamp", { enumerable: true, get: () => e.nowTimestamp }), exports.openReportIssueModal = e.openReportIssueModal, exports.restoreFuncSpanState = e.restoreFuncSpanState, exports.sendDomainsToNotPropagateHeaderTo = e.sendDomainsToNotPropagateHeaderTo, exports.sendEvent = e.sendEvent, exports.sendGraphQLRequest = e.sendGraphQLRequest, exports.sendMessage = e.sendMessage, exports.startRecording = e.startRecording, exports.startRecordingSession = e.startRecordingSession, exports.trackingEvent = e.trackingEvent, exports.withAppUrlMetadata = e.withAppUrlMetadata;
+const e = require("./chunks/index-B8gnDRst.js");
+exports.DEFAULT_CAPTURE_SETTINGS = e.DEFAULT_CAPTURE_SETTINGS, exports.DEFAULT_CONSOLE_RECORDING_SETTINGS = e.DEFAULT_CONSOLE_RECORDING_SETTINGS, exports.STORAGE_VERSION = e.STORAGE_VERSION, exports.addOrUpdateMetadata = e.addOrUpdateMetadata, exports.buildBatches = e.buildBatches, exports.clearStaleFuncSpanState = e.clearStaleFuncSpanState, exports.createTriageAndIssueFromRecorder = e.createTriageAndIssueFromRecorder, exports.createTriageFromRecorder = e.createTriageFromRecorder, exports.disableFunctionSpanTracking = e.disableFunctionSpanTracking, exports.enableFunctionSpanTracking = e.enableFunctionSpanTracking, exports.ensureHrefCache = e.ensureHrefCache, exports.eventSize = e.eventSize, exports.fetchAndSendIp = e.fetchAndSendIp, exports.fetchCaptureSettings = e.fetchCaptureSettings, exports.fetchEngineeringTicketPlatformIntegrations = e.fetchEngineeringTicketPlatformIntegrations, exports.fetchFunctionSpanTrackingEnabled = e.fetchFunctionSpanTrackingEnabled, exports.flushBufferedEvents = e.flushBufferedEvents, exports.getCachedHref = e.getCachedHref, exports.getCachedHrefNoQuery = e.getCachedHrefNoQuery, exports.getFuncSpanHeader = e.getFuncSpanHeader, exports.getOrSetSessionId = e.getOrSetSessionId, exports.getUrlAndStoredUuids = e.getUrlAndStoredUuids, exports.identify = e.identify, exports.initRecorder = e.initRecorder, exports.initializeConsolePlugin = e.initializeConsolePlugin, exports.initializeDomContentEvents = e.initializeDomContentEvents, exports.initializeFunctionSpanTrackingFromApi = e.initializeFunctionSpanTrackingFromApi, exports.initializeRecording = e.initializeRecording, exports.initializeWebSocket = e.initializeWebSocket, exports.invalidateUrlCache = e.invalidateUrlCache, exports.isFunctionSpanTrackingEnabled = e.isFunctionSpanTrackingEnabled, exports.matchUrlWithWildcard = e.matchUrlWithWildcard, Object.defineProperty(exports, "nowTimestamp", { enumerable: true, get: () => e.nowTimestamp }), exports.onNavigationChange = e.onNavigationChange, exports.openReportIssueModal = e.openReportIssueModal, exports.restoreFuncSpanState = e.restoreFuncSpanState, exports.sendDomainsToNotPropagateHeaderTo = e.sendDomainsToNotPropagateHeaderTo, exports.sendEvent = e.sendEvent, exports.sendGraphQLRequest = e.sendGraphQLRequest, exports.sendMessage = e.sendMessage, exports.startRecording = e.startRecording, exports.startRecordingSession = e.startRecordingSession, exports.trackingEvent = e.trackingEvent, exports.withAppUrlMetadata = e.withAppUrlMetadata;

package/dist/recorder.js

@@ -1,4 +1,4 @@
-import { D, a, S, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t, u, v, w, x, z, A, B, C, E, F, G, H, I, J, K, L, M, N, O, P, Q } from "./chunks/index-soHaKXF4.js";
+import { D, a, S, b, c, d, e, f, g, h, i, j, k, l, m, n, o, p, q, r, s, t, u, v, w, x, z, A, B, C, E, F, G, H, I, J, K, L, M, N, O, P, Q, R } from "./chunks/index-w2Ted1rp.js";
 export {
   D as DEFAULT_CAPTURE_SETTINGS,
   a as DEFAULT_CONSOLE_RECORDING_SETTINGS,
@@ -33,14 +33,15 @@ export {
   E as isFunctionSpanTrackingEnabled,
   F as matchUrlWithWildcard,
   G as nowTimestamp,
-  H as openReportIssueModal,
-  I as restoreFuncSpanState,
-  J as sendDomainsToNotPropagateHeaderTo,
-  K as sendEvent,
-  L as sendGraphQLRequest,
-  M as sendMessage,
-  N as startRecording,
-  O as startRecordingSession,
-  P as trackingEvent,
-  Q as withAppUrlMetadata
+  H as onNavigationChange,
+  I as openReportIssueModal,
+  J as restoreFuncSpanState,
+  K as sendDomainsToNotPropagateHeaderTo,
+  L as sendEvent,
+  M as sendGraphQLRequest,
+  N as sendMessage,
+  O as startRecording,
+  P as startRecordingSession,
+  Q as trackingEvent,
+  R as withAppUrlMetadata
 };

package/dist/types/inAppReportIssueModal/index.d.ts

@@ -27,6 +27,7 @@ export declare const ReportIssueContext: {
     triageBaseUrl: string;
     deactivateIsolation: () => void;
     integrationData: any;
+    showEngTicketFieldsDefault: boolean;
 };
 export declare function setupIssueReporting(options: {
     apiKey: string;
@@ -35,6 +36,9 @@ export declare function setupIssueReporting(options: {
     shortcuts?: Partial<ShortcutsConfig>;
     customBaseUrl?: string;
     integrationData?: any;
+    showEngTicketFieldsInReportIssueModalDefault?: boolean;
+}): void;
+export declare function openReportIssueModal(options?: {
+    showEngTicketFields?: boolean;
 }): void;
-export declare function openReportIssueModal(): void;
 export {};

package/dist/types/inAppReportIssueModal/types.d.ts

@@ -36,4 +36,5 @@ export declare const ReportIssueContext: {
     triageBaseUrl: string;
     deactivateIsolation: () => void;
     integrationData: any;
+    showEngTicketFieldsDefault: boolean;
 };

package/dist/types/index.d.ts

@@ -73,6 +73,7 @@ export declare const initRecorder: (options: {
      */
     chunkSnapshot?: boolean;
     useWsWorker?: boolean;
+    showEngTicketFieldsInReportIssueModalDefault?: boolean;
 }) => Promise<void>;
 export * from "./graphql";
 export { openReportIssueModal } from "./inAppReportIssueModal";

package/dist/types/websocket.d.ts

@@ -3,6 +3,9 @@ export interface WsHandle {
     readyState: number;
     close: () => void;
 }
+type NavigationCallback = () => void;
+/** Register a callback to be invoked immediately on pushState/replaceState/popstate/hashchange. */
+export declare function onNavigationChange(cb: NavigationCallback): void;
 /** Install navigation listeners to keep the cached URL fresh. */
 export declare function ensureHrefCache(): void;
 /** Get cached href (falls back to live read if cache not initialized). */
@@ -47,3 +50,4 @@ export declare function getFuncSpanHeader(): {
     name: string;
     value: string;
 } | null;
+export {};

package/dist/websocket.js

@@ -102,9 +102,20 @@ let flushIntervalId = null;
 let _cachedHref = "";
 let _cachedHrefNoQuery = "";
 let _hrefListenersInstalled = false;
+const _navigationCallbacks = [];
+/** Register a callback to be invoked immediately on pushState/replaceState/popstate/hashchange. */
+export function onNavigationChange(cb) {
+    _navigationCallbacks.push(cb);
+}
 function _updateHrefCache() {
     _cachedHref = window.location.href;
     _cachedHrefNoQuery = window.location.origin + window.location.pathname;
+    for (const cb of _navigationCallbacks) {
+        try {
+            cb();
+        }
+        catch (_) { /* never break navigation */ }
+    }
 }
 /** Install navigation listeners to keep the cached URL fresh. */
 export function ensureHrefCache() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sailfish-ai/recorder",
-  "version": "1.10.7",
+  "version": "1.10.9",
   "publishPublicly": true,
   "type": "module",
   "main": "dist/recorder.cjs",