@qualified-salesforce/web 0.0.1-oidc-bootstrap

package/widget/multimodal_v2/utils/navigation_strategies/dom_swap.js

@@ -0,0 +1,393 @@
+import { __webpack_require__ } from "../../../../js/runtime.js";
+import "../../../utils/native_globals.js";
+
+/* provided dependency */ var dom_swap_setTimeout = __webpack_require__(68034).pS;
+/**
+ * DOM swap strategy.
+ * For traditional server-rendered pages. Fetches HTML, swaps body, runs scripts.
+ */ const domSwapStrategy = {
+    needsInterceptor: true,
+    isApplicable: ()=>true,
+    navigate: async (url)=>navigateToUrlDomOnly(url.href)
+};
+/* export default */ const dom_swap = (domSwapStrategy);
+/*
+ * ---------------------------------------------------------
+ * DOM swap implementation helpers
+ * This code is temporarily copied over from v1 multimodal widget to unblock
+ * trusted testers from using the v2 multimodal widget.
+ * ---------------------------------------------------------
+ */ // Track what stylesheets or other elements we've injected
+const MANAGED_ATTR = "data-qualified-x-managed";
+let currentFetchController = null;
+function isExecutableScript(el) {
+    const type = (el.getAttribute("type") || "").trim().toLowerCase();
+    return !type || type === "text/javascript" || type === "application/javascript" || type === "text/ecmascript" || type === "application/ecmascript" || type === "module";
+}
+function copyScriptAttrs(from, to, param) {
+    let { baseHref } = param;
+    for (const { name, value } of [
+        ...from.attributes
+    ]){
+        if (name.toLowerCase() !== "src") {
+            to.setAttribute(name, value);
+        }
+    }
+    const src = from.getAttribute("src");
+    if (src) to.src = new URL(src, baseHref).href;
+    // Preserve execution semantics
+    const isModule = (to.getAttribute("type") || "").trim() === "module";
+    if (!isModule) {
+        // classic scripts execute in insertion order if async is false
+        if (!to.hasAttribute("async")) to.async = false;
+    }
+}
+async function loadMissingStylesheets(newDoc, baseUrl) {
+    const addedLoads = [];
+    // All stylesheets in new document
+    const newLinks = [
+        ...newDoc.head.querySelectorAll('link[rel~="stylesheet"][href]')
+    ];
+    // What the current page already has (full absolute URLs)
+    const existingHrefs = new Set([
+        ...document.head.querySelectorAll('link[rel~="stylesheet"][href]')
+    ].map((l)=>l.href));
+    // Add any missing <link rel="stylesheet"> tags and accumulate load promises.
+    for (const el of newLinks){
+        const href = el.getAttribute("href");
+        if (href) {
+            const absHref = new URL(href, baseUrl).href;
+            if (!existingHrefs.has(absHref)) {
+                const link = document.createElement("link");
+                link.rel = el.rel || "stylesheet";
+                link.href = absHref;
+                // copy a few useful attributes verbatim
+                for (const attr of [
+                    "media",
+                    "integrity",
+                    "crossorigin",
+                    "referrerpolicy",
+                    "title",
+                    "disabled"
+                ]){
+                    const val = el.getAttribute(attr);
+                    if (val !== null) {
+                        link.setAttribute(attr, val);
+                    }
+                }
+                link.setAttribute(MANAGED_ATTR, ""); // mark so we can clean it later if needed
+                addedLoads.push(new Promise((resolve)=>{
+                    link.addEventListener("load", resolve, {
+                        once: true
+                    });
+                    link.addEventListener("error", resolve, {
+                        once: true
+                    }); // don't block on errors
+                }));
+                document.head.appendChild(link);
+            }
+        }
+    }
+    // Inline <style> tags
+    for (const el of newDoc.head.querySelectorAll("style")){
+        const dataKey = el.getAttribute("data-key");
+        const key = el.id || dataKey;
+        if (key) {
+            // only copy ones we can dedupe safely
+            const styleDataKey = el.getAttribute("data-key");
+            let selector;
+            if (el.id) {
+                selector = "style#" + CSS.escape(el.id);
+            } else if (styleDataKey) {
+                selector = 'style[data-key="' + CSS.escape(styleDataKey) + '"]';
+            }
+            if (selector && !document.head.querySelector(selector)) {
+                const style = document.createElement("style");
+                if (el.id) {
+                    style.id = el.id;
+                }
+                if (styleDataKey !== null) {
+                    style.setAttribute("data-key", styleDataKey);
+                }
+                style.setAttribute(MANAGED_ATTR, "");
+                style.textContent = el.textContent;
+                document.head.appendChild(style);
+            }
+        }
+    }
+    // Remove previously managed styles that the new page doesn't want
+    const desired = new Set(newLinks.reduce((acc, el)=>{
+        const href = el.getAttribute("href");
+        if (href) {
+            acc.push(new URL(href, baseUrl).href);
+        }
+        return acc;
+    }, []));
+    for (const link of document.head.querySelectorAll('link[rel~="stylesheet"][href][' + MANAGED_ATTR + "]")){
+        const href = link.getAttribute("href");
+        if (href !== null && !desired.has(href)) {
+            link.remove();
+        }
+    }
+    return Promise.all(addedLoads);
+}
+async function prepareHeadScripts(newDoc, baseHref) {
+    // Remove our previously managed head scripts
+    for (const s of document.head.querySelectorAll("script[" + MANAGED_ATTR + "]"))s.remove();
+    const incoming = [
+        ...newDoc.head.querySelectorAll("script")
+    ];
+    // Intentionally do not dedupe external scripts; re-execute all on each navigation
+    // Defer inline head scripts until after body swap so they can see the new DOM
+    const deferredInline = [];
+    await incoming.reduce(async (prev, old)=>{
+        await prev;
+        if (!isExecutableScript(old)) return;
+        const s = document.createElement("script");
+        copyScriptAttrs(old, s, {
+            baseHref
+        });
+        s.setAttribute(MANAGED_ATTR, "");
+        if (s.src) {
+            await new Promise((resolve)=>{
+                s.addEventListener("load", resolve, {
+                    once: true
+                });
+                s.addEventListener("error", resolve, {
+                    once: true
+                });
+                document.head.appendChild(s);
+            });
+        } else {
+            // Dedupe inline head scripts by id or data-key if present
+            const dataKey = old.getAttribute("data-key");
+            const key = old.id || dataKey;
+            if (key) {
+                let selector = null;
+                if (old.id) selector = "script#" + CSS.escape(old.id);
+                else if (dataKey) selector = 'script[data-key="' + CSS.escape(dataKey) + '"]';
+                if (selector && document.head.querySelector(selector)) {
+                    return;
+                }
+            }
+            // Defer execution until after body swap
+            deferredInline.push(old);
+        }
+    }, Promise.resolve());
+    // Return a runner that executes deferred inline head scripts in order
+    return async function runPreparedHeadInlineScripts() {
+        for (const old of deferredInline){
+            const s = document.createElement("script");
+            copyScriptAttrs(old, s, {
+                baseHref
+            });
+            s.setAttribute(MANAGED_ATTR, "");
+            // For classic scripts, wrap in an IIFE to avoid duplicate top-level const/let
+            // declaration errors across soft navigations. Module scripts already have
+            // their own scope and must keep import/export at the top level, so they
+            // must not be wrapped.
+            const code = old.textContent || "";
+            const isModule = (old.type || "").trim().toLowerCase() === "module";
+            s.textContent = isModule ? code : "(function(){\n" + code + "\n})();";
+            document.head.appendChild(s);
+        // inline executes immediately on insertion
+        }
+    };
+}
+async function executeBodyScripts(root, baseHref) {
+    const scripts = [
+        ...root.querySelectorAll("script")
+    ];
+    const waitForScript = (el, timeoutMs)=>{
+        if (timeoutMs === void 0) timeoutMs = 2e3;
+        return new Promise((resolve)=>{
+            const done = ()=>{
+                el.removeEventListener("load", done);
+                el.removeEventListener("error", done);
+                resolve();
+            };
+            el.addEventListener("load", done, {
+                once: true
+            });
+            el.addEventListener("error", done, {
+                once: true
+            });
+            // Ensure we never hang indefinitely on a stalled network request
+            dom_swap_setTimeout(done, timeoutMs);
+        });
+    };
+    for (const old of scripts){
+        const executable = isExecutableScript(old);
+        if (executable) {
+            const s = document.createElement("script");
+            copyScriptAttrs(old, s, {
+                baseHref
+            });
+            if (s.src) {
+                const completion = waitForScript(s, 2e3);
+                old.replaceWith(s); // insertion triggers fetch + exec
+                // eslint-disable-next-line no-await-in-loop -- Scripts must execute sequentially to preserve order
+                await completion;
+            } else {
+                // Wrap inline body scripts in an IIFE to avoid duplicate top-level const/let errors
+                // across soft navigations while still executing DOM-affecting code.
+                const code = old.textContent || "";
+                s.textContent = "(function(){\n" + code + "\n})();";
+                old.replaceWith(s); // executes inline immediately
+            }
+        }
+    }
+    return true;
+}
+// WordPress websites with lazy loaded images can get stuck after navigation. This is a hack to fix that.
+// Heuristics:
+// - Has data-lazy-* attributes (WordPress/VC convention)
+// - CurrentSrc/src is a data: placeholder
+function fixStuckLazyImage(img) {
+    try {
+        const cur = (img.currentSrc || img.src || "").trim();
+        const isPlaceholder = cur.startsWith("data:");
+        // If nothing suggests it's stuck, skip
+        if (!isPlaceholder) return;
+        const lazySrc = img.getAttribute("data-lazy-src") || img.getAttribute("data-src");
+        const lazySrcset = img.getAttribute("data-lazy-srcset") || img.getAttribute("data-srcset");
+        const lazySizes = img.getAttribute("data-lazy-sizes");
+        // If there are no lazy attributes, nothing to promote
+        if (!lazySrc && !lazySrcset && !lazySizes) return;
+        // Promote lazy attrs to real attrs
+        if (lazySrc) img.src = new URL(lazySrc, document.baseURI).href;
+        if (lazySrcset) img.srcset = lazySrcset;
+        if (lazySizes) img.sizes = lazySizes;
+        // Remove attributes that keep CSS hiding rules active
+        if (img.hasAttribute("data-lazy-src")) img.removeAttribute("data-lazy-src");
+        if (img.hasAttribute("data-lazy-srcset")) img.removeAttribute("data-lazy-srcset");
+        if (img.hasAttribute("data-lazy-sizes")) img.removeAttribute("data-lazy-sizes");
+        if (img.hasAttribute("data-src")) img.removeAttribute("data-src");
+        if (img.hasAttribute("data-srcset")) img.removeAttribute("data-srcset");
+    } catch (unused) {
+    // ignore failures
+    }
+}
+// WordPress websites with lazy loaded images can get stuck after navigation. This is a hack to fix that.
+// Example: https://www.litmos.com/explore/lms-101-guide
+function rehydrateStuckLazyImages() {
+    try {
+        const imgs = Array.from(document.querySelectorAll("img[data-lazy-src], img[data-lazy-srcset], img[data-lazy-sizes]"));
+        imgs.forEach(fixStuckLazyImage);
+    } catch (unused) {
+    // ignore failures
+    }
+}
+// Perform navigation that updates URL/title, loads CSS, and swaps the body only.
+// Returns a runner to execute scripts and lifecycle events when you're ready.
+async function navigateDomOnly(url, param) {
+    let { history = "none", signal, scroll = "top" } = param === void 0 ? {} : param;
+    var _newDoc_head_querySelector, _window_qualified_sentinel, _window_qualified;
+    // Abort previous fetch if we're doing a non-Navigation-API nav
+    let controller;
+    if (!signal) {
+        if (currentFetchController) {
+            currentFetchController.abort();
+        }
+        controller = new AbortController();
+        currentFetchController = controller;
+        signal = controller.signal;
+    }
+    // Fetch the page (follow redirects); use final response URL for history/base
+    const response = await fetch(url, {
+        credentials: "same-origin",
+        redirect: "follow",
+        signal
+    });
+    if (!response.ok) {
+        throw new Error("Fetch failed: " + response.status + " " + response.statusText);
+    }
+    const html = await response.text();
+    const effectiveUrl = response.url || url;
+    // Parse the HTML
+    const newDoc = new DOMParser().parseFromString(html, "text/html");
+    // Compute base href for resolving relative URLs (e.g., <script src> resolution)
+    const href = (_newDoc_head_querySelector = newDoc.head.querySelector("base[href]")) == null ? void 0 : _newDoc_head_querySelector.getAttribute("href");
+    const baseHref = href ? new URL(href, effectiveUrl).href : effectiveUrl;
+    // Update URL/title if this path is managing history itself (fallback mode)
+    if (history === "push") {
+        window.history.pushState({
+            __live: true
+        }, "", effectiveUrl);
+    } else if (history === "replace") {
+        window.history.replaceState({
+            __live: true
+        }, "", effectiveUrl);
+    }
+    if (newDoc.title) {
+        document.title = newDoc.title;
+    }
+    // Insert any missing stylesheets from the new <head> into our <head>. Wait so we don't FOUC.
+    await loadMissingStylesheets(newDoc, effectiveUrl);
+    // Scroll to top of the page before replacing body so we don't FOUC
+    if (scroll === "top") {
+        window.scrollTo(0, 0);
+    }
+    (_window_qualified = window.qualified) == null ? void 0 : (_window_qualified_sentinel = _window_qualified.sentinel) == null ? void 0 : _window_qualified_sentinel.abort();
+    const offerHosts = Array.from(document.body.querySelectorAll("[id^='_qualified-offer-host']"));
+    for (const el of offerHosts)el.remove();
+    // Use the NEW body attributes, not the old ones
+    const newBodyAttrs = [
+        ...newDoc.body.attributes
+    ].map((a)=>[
+            a.name,
+            a.value
+        ]);
+    document.body.innerHTML = newDoc.body.innerHTML;
+    for (const [name, value] of newBodyAttrs){
+        document.body.setAttribute(name, value);
+    }
+    for(let i = offerHosts.length - 1; i >= 0; i--){
+        document.body.insertBefore(offerHosts[i], document.body.firstElementChild);
+    }
+    // Return a runner that, when invoked, loads and executes scripts and fires lifecycle events
+    const runScripts = async ()=>{
+        // Prepare head scripts and capture a runner for deferred inline head scripts
+        const runPreparedHeadInlineScripts = await prepareHeadScripts(newDoc, baseHref);
+        // Execute body scripts in DOM order
+        await executeBodyScripts(document.body, baseHref);
+        // Execute prepared inline head scripts now that the new DOM is in place
+        await runPreparedHeadInlineScripts();
+        // Lifecycle events (soft navigation)
+        try {
+            // Fire synthetic DOMContentLoaded so libs relying on it can re-init
+            document.dispatchEvent(new Event("DOMContentLoaded", {
+                bubbles: true
+            }));
+            // Also fire load/pageshow for libraries that hook later lifecycle
+            window.dispatchEvent(new Event("load"));
+            window.dispatchEvent(new Event("pageshow"));
+        } catch (unused) {
+        // ignore lifecycle dispatch errors
+        }
+        // Sometimes lazy loaded images get stuck after navigation. This is a hack to fix that.
+        // Example: https://www.litmos.com/explore/lms-101-guide
+        rehydrateStuckLazyImages();
+        // Alert the qualified widget that the page has changed
+        // TODO: We should not go through the public API here and utilize the widgetObject patterns
+        // instead once we refactor all our stores and state.
+        window.qualified("page");
+    };
+    return {
+        runScripts
+    };
+}
+/**
+ * Navigate to a URL using soft navigation (DOM-only, no full page reload).
+ * Returns a function that, when called, executes scripts and fires lifecycle events.
+ */ async function navigateToUrlDomOnly(url) {
+    const { runScripts } = await navigateDomOnly(url, {
+        history: "push",
+        scroll: "top"
+    });
+    return runScripts;
+}
+
+var dom_swap_navigateToUrlDomOnly = /* unused export */ undefined;
+export { dom_swap_navigateToUrlDomOnly as navigateToUrlDomOnly };
+export default dom_swap;

package/widget/multimodal_v2/utils/navigation_strategies/index.js

@@ -0,0 +1,12 @@
+
+
+
+
+
+
+
+export { default as domSwapStrategy } from "./dom_swap.js";
+export { findElementWithText, isSameOrigin } from "./navigation_utils.js";
+export { lwrStrategy } from "./lwr.js";
+export { nextJsStrategy } from "./next_js.js";
+export { wouterV3Strategy } from "./wouter_v3.js";

package/widget/multimodal_v2/utils/navigation_strategies/lwr.js

@@ -0,0 +1,61 @@
+/**
+ * For Salesforce Lightning Web Runtime (LWR) sites — e.g. Experience Cloud /
+ * Communities sites built on the `webruntime` framework.
+ *
+ * LWR's `webruntime/clientHook` installs a window-level "click" listener that:
+ * - Finds the nearest `<a>` in `event.composedPath()`.
+ * - If `routingService.router.matchRoute(href)` succeeds, calls
+ *   `event.preventDefault()` and dispatches
+ *   `routingService.navigate({ type: "standard__webPage", attributes: { url } })`.
+ *
+ * We trigger that flow by synthesizing a click on a temporary anchor.
+ *
+ * We use `dispatchEvent(new MouseEvent(...))` rather than `.click()` so that
+ * if LWR doesn't accept the navigation (e.g. unknown route), the browser
+ * does NOT silently fire its default action and trigger a hard reload —
+ * we throw so the caller's fallback (e.g. `window.location.href = url`)
+ * handles it explicitly.
+ *
+ * Going through the LWR router (instead of DOM-swapping the new page) also
+ * avoids re-executing LWR's bootstrap scripts, which is what produces
+ * `Cannot redefine property: originalDomApis` and
+ * `Cannot add property bootstrapModule, object is not extensible` —
+ * `window.LWR` is `Object.freeze`d on first load and synthetic-shadow
+ * registers globals as non-configurable.
+ */ const lwrStrategy = {
+    needsInterceptor: false,
+    isApplicable: ()=>isLwrApp(),
+    navigate: async (url)=>{
+        const a = document.createElement("a");
+        // Pass the path/query/hash through as-is and let LWR's router decide
+        // what to do with the fragment. We previously tried to strip and
+        // re-apply the hash, but `routingService.navigate()` is async — setting
+        // `window.location.hash` afterwards races with LWR's own URL updates and
+        // can produce duplicate history entries — so the "do less" version is
+        // safer until we have a concrete repro of fragment handling actually
+        // breaking on a real LWR site.
+        a.setAttribute("href", url.pathname + url.search + url.hash);
+        a.style.display = "none";
+        document.body.appendChild(a);
+        try {
+            const event = new MouseEvent("click", {
+                bubbles: true,
+                cancelable: true,
+                composed: true
+            });
+            a.dispatchEvent(event);
+            if (!event.defaultPrevented) {
+                throw new Error("LWR router did not handle navigation to " + url.href);
+            }
+        } finally{
+            a.remove();
+        }
+    }
+};
+function isLwrApp() {
+    return Boolean(window.LWR && typeof window.LWR.define === "function");
+}
+/* export default */ const lwr = (lwrStrategy);
+
+export { lwr as lwrStrategy };
+export default lwr;

package/widget/multimodal_v2/utils/navigation_strategies/navigation_utils.js

@@ -0,0 +1,46 @@
+import { __webpack_require__ } from "../../../../js/runtime.js";
+import "../../../utils/native_globals.js";
+
+/* provided dependency */ var navigation_utils_setTimeout = __webpack_require__(68034).pS;
+const isSameOrigin = (url)=>{
+    return url.origin === window.location.origin;
+};
+/**
+ * Helper function to find an element containing the specified text, with retries.
+ */ async function findElementWithText(text, options) {
+    if (options === void 0) options = {};
+    const { maxAttempts = 3, delayMs = 500 } = options;
+    // Search for the text in headings (h1-h6), paragraphs, and list items
+    const selectors = [
+        "h1",
+        "h2",
+        "h3",
+        "h4",
+        "h5",
+        "h6",
+        "p",
+        "li"
+    ];
+    const tryFindOnce = ()=>{
+        for (const selector of selectors){
+            const elements = document.querySelectorAll(selector);
+            for (const element of elements){
+                var _element_textContent;
+                if ((_element_textContent = element.textContent) == null ? void 0 : _element_textContent.includes(text)) {
+                    return element;
+                }
+            }
+        }
+        return null;
+    };
+    const sleep = (ms)=>new Promise((resolve)=>navigation_utils_setTimeout(resolve, ms));
+    async function attempt(remaining) {
+        const found = tryFindOnce();
+        if (found || remaining <= 1) return found;
+        await sleep(delayMs);
+        return attempt(remaining - 1);
+    }
+    return attempt(maxAttempts);
+}
+
+export { findElementWithText, isSameOrigin };

package/widget/multimodal_v2/utils/navigation_strategies/next_js.js

@@ -0,0 +1,24 @@
+/**
+ * For Next.js sites (pages router). DOM-swapping a Next page produces a
+ * broken result: the bundles in `/_next/static/` are module scripts that
+ * the browser dedupes by URL, so re-inserting them is a no-op and the app
+ * never re-bootstraps. The React root we replaced via `body.innerHTML` is
+ * gone, `__NEXT_DATA__` is stale relative to what booted on first load,
+ * and the page renders without text/nav/hydration.
+ *
+ * When the current page is the same Next app, `window.next.router.push`
+ * navigates client-side cleanly without tearing down the widget.
+ */ const nextJsStrategy = {
+    needsInterceptor: false,
+    isApplicable: ()=>{
+        var _window_next_router, _window_next;
+        return typeof ((_window_next = window.next) == null ? void 0 : (_window_next_router = _window_next.router) == null ? void 0 : _window_next_router.push) === "function";
+    },
+    navigate: async (url)=>{
+        await window.next.router.push(url.pathname + url.search + url.hash);
+    }
+};
+/* export default */ const next_js = (nextJsStrategy);
+
+export { next_js as nextJsStrategy };
+export default next_js;

package/widget/multimodal_v2/utils/navigation_strategies/wouter_v3.js

@@ -0,0 +1,15 @@
+/**
+ * For SPAs using wouter - pushes to history and wouter handles the rest.
+ * Example: saastrannual2026.com
+ */ const WOUTER_V3_SYMBOL = Symbol.for("wouter_v3");
+const wouterV3Strategy = {
+    needsInterceptor: false,
+    isApplicable: ()=>Boolean(window[WOUTER_V3_SYMBOL]),
+    navigate: async (url)=>{
+        window.history.pushState(null, "", url.pathname + url.search + url.hash);
+    }
+};
+/* export default */ const wouter_v3 = (wouterV3Strategy);
+
+export { wouter_v3 as wouterV3Strategy };
+export default wouter_v3;

package/widget/multimodal_v2/utils/objects_map.js

@@ -0,0 +1,38 @@
+class ObjectsMap {
+    getOrSet(objects, factory) {
+        const key = this.getKey(objects);
+        let value = this.map.get(key);
+        if (!value) {
+            value = factory(objects);
+            this.map.set(key, value);
+        }
+        return value;
+    }
+    getKey(objects) {
+        this.buffer.length = objects.length;
+        for(let i = 0; i < objects.length; i++){
+            this.buffer[i] = this.getId(objects[i]);
+        }
+        return this.buffer.sort((a, b)=>a - b).join(",");
+    }
+    getId(object) {
+        if (ObjectsMap.ID_SYMBOL in object) {
+            return object[ObjectsMap.ID_SYMBOL];
+        }
+        // Assign ID atomically by reading current value before incrementing
+        const id = ObjectsMap.idCounter;
+        ObjectsMap.idCounter = id + 1;
+        Object.assign(object, {
+            [ObjectsMap.ID_SYMBOL]: id
+        });
+        return id;
+    }
+    constructor(){
+        this.map = new Map();
+        this.buffer = [];
+    }
+}
+ObjectsMap.ID_SYMBOL = Symbol("q.utils.objects_map.id");
+ObjectsMap.idCounter = 0;
+
+export { ObjectsMap };