@thoughtspot/visual-embed-sdk 1.42.0 → 1.42.1-HE2.0

package/src/embed/hostEventClient/host-event-client.ts

@@ -8,6 +8,7 @@ import {
     UIPassthroughResponse,
     TriggerPayload,
     TriggerResponse,
+    ContextType,
 } from './contracts';
 
 export class HostEventClient {
@@ -23,7 +24,7 @@ export class HostEventClient {
    * @param {any} data Data to send with the host event
    * @returns {Promise<any>} - the response from the process trigger
    */
-  protected async processTrigger(message: HostEvent, data: any): Promise<any> {
+  protected async processTrigger(message: HostEvent, data: any, context?: ContextType): Promise<any> {
       if (!this.iFrame) {
           throw new Error('Iframe element is not set');
       }
@@ -34,6 +35,7 @@ export class HostEventClient {
           message,
           thoughtspotHost,
           data,
+          context,
       );
   }
 
@@ -65,8 +67,9 @@ export class HostEventClient {
   public async hostEventFallback(
       hostEvent: HostEvent,
       data: any,
+      context?: ContextType,
   ): Promise<any> {
-      return this.processTrigger(hostEvent, data);
+      return this.processTrigger(hostEvent, data, context);
   }
 
   /**
@@ -91,7 +94,7 @@ export class HostEventClient {
 
   protected async handlePinEvent(
       payload: HostEventRequest<HostEvent.Pin>,
-  ): Promise<HostEventResponse<HostEvent.Pin>> {
+  ): Promise<HostEventResponse<HostEvent.Pin, ContextType>> {
       if (!payload || !('newVizName' in payload)) {
           return this.hostEventFallback(HostEvent.Pin, payload);
       }
@@ -132,10 +135,12 @@ export class HostEventClient {
   public async triggerHostEvent<
     HostEventT extends HostEvent,
     PayloadT,
+    ContextT extends ContextType,
   >(
       hostEvent: HostEventT,
       payload?: TriggerPayload<PayloadT, HostEventT>,
-  ): Promise<TriggerResponse<PayloadT, HostEventT>> {
+      context?: ContextT,
+  ): Promise<TriggerResponse<PayloadT, HostEventT, ContextType>> {
       switch (hostEvent) {
           case HostEvent.Pin:
               return this.handlePinEvent(payload as HostEventRequest<HostEvent.Pin>) as any;
@@ -144,7 +149,7 @@ export class HostEventClient {
                   payload as HostEventRequest<HostEvent.SaveAnswer>,
               ) as any;
           default:
-              return this.hostEventFallback(hostEvent, payload);
+              return this.hostEventFallback(hostEvent, payload, context);
       }
   }
 }

package/src/embed/liveboard.spec.ts

@@ -183,6 +183,36 @@ describe('Liveboard/viz embed tests', () => {
         });
     });
 
+    test('should set isLinkParametersEnabled to true in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            isLinkParametersEnabled: true,
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isLinkParametersEnabled=true${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
+    test('should set isLinkParametersEnabled to false in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            isLinkParametersEnabled: false,
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isLinkParametersEnabled=false${prefixParams}#/embed/viz/${liveboardId}`,
+            );
+        });
+    });
+
     test('should set visible actions as empty array', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             visibleActions: [],

package/src/embed/liveboard.ts

@@ -25,7 +25,7 @@ import { calculateVisibleElementData, getQueryParamString, isUndefined } from '.
 import { getAuthPromise } from './base';
 import { TsEmbed, V1Embed } from './ts-embed';
 import { addPreviewStylesIfNotPresent } from '../utils/global-styles';
-import { TriggerPayload, TriggerResponse } from './hostEventClient/contracts';
+import { ContextType, TriggerPayload, TriggerResponse } from './hostEventClient/contracts';
 import { logger } from '../utils/logger';
 
 
@@ -477,6 +477,7 @@ export class LiveboardEmbed extends V1Embed {
             isLiveboardStylingAndGroupingEnabled,
             isPNGInScheduledEmailsEnabled = false,
             showSpotterLimitations,
+            isLinkParametersEnabled,
         } = this.viewConfig;
 
         const preventLiveboardFilterRemoval = this.viewConfig.preventLiveboardFilterRemoval
@@ -552,6 +553,10 @@ export class LiveboardEmbed extends V1Embed {
             params[Param.ShowSpotterLimitations] = showSpotterLimitations;
         }
 
+        if (isLinkParametersEnabled !== undefined) {
+            params[Param.isLinkParametersEnabled] = isLinkParametersEnabled;
+        }
+
         params[Param.LiveboardHeaderSticky] = isLiveboardHeaderSticky;
         params[Param.LiveboardHeaderV2] = isLiveboardCompactHeaderEnabled;
         params[Param.ShowLiveboardVerifiedBadge] = showLiveboardVerifiedBadge;
@@ -733,10 +738,11 @@ export class LiveboardEmbed extends V1Embed {
      * @param {any} data The payload to send with the message
      * @returns A promise that resolves with the response from the embedded app
      */
-    public trigger<HostEventT extends HostEvent, PayloadT>(
+    public trigger<HostEventT extends HostEvent, PayloadT, ContextT extends ContextType>(
         messageType: HostEventT,
         data: TriggerPayload<PayloadT, HostEventT> = ({} as any),
-    ): Promise<TriggerResponse<PayloadT, HostEventT>> {
+        context?: ContextT,
+    ): Promise<TriggerResponse<PayloadT, HostEventT, ContextT>> {
         const dataWithVizId: any = data;
         if (messageType === HostEvent.SetActiveTab) {
             this.setActiveTab(data as { tabId: string });
@@ -745,7 +751,7 @@ export class LiveboardEmbed extends V1Embed {
         if (typeof dataWithVizId === 'object' && this.viewConfig.vizId) {
             dataWithVizId.vizId = this.viewConfig.vizId;
         }
-        return super.trigger(messageType, dataWithVizId);
+        return super.trigger(messageType, dataWithVizId, context);
     }
     /**
      * Destroys the ThoughtSpot embed, and remove any nodes from the DOM.

package/src/embed/ts-embed.spec.ts

@@ -3345,4 +3345,115 @@ describe('Unit test case for ts embed', () => {
             expect(searchEmbed.isEmbedContainerLoaded).toBe(true);
         });
     });
+
+    describe('Online event listener registration after auth failure', () => {
+        beforeAll(() => {
+            init({
+                thoughtSpotHost: 'tshost',
+                authType: AuthType.None,
+                loginFailedMessage: 'Not logged in',
+            });
+        });
+
+        test('should register online event listener when authentication fails', async () => {
+            const addEventListenerSpy = jest.spyOn(window, 'addEventListener');
+            jest.spyOn(baseInstance, 'getAuthPromise').mockRejectedValueOnce(
+                new Error('Auth failed'),
+            );
+            const searchEmbed = new SearchEmbed(getRootEl(), defaultViewConfig);
+            addEventListenerSpy.mockClear();
+            await searchEmbed.render();
+            await executeAfterWait(() => {
+                expect(getRootEl().innerHTML).toContain('Not logged in');
+                const onlineListenerCalls = addEventListenerSpy.mock.calls.filter(
+                    (call) => call[0] === 'online',
+                );
+                expect(onlineListenerCalls).toHaveLength(1);
+                const offlineListenerCalls = addEventListenerSpy.mock.calls.filter(
+                    (call) => call[0] === 'offline',
+                );
+                expect(offlineListenerCalls).toHaveLength(1);
+                const messageListenerCalls = addEventListenerSpy.mock.calls.filter(
+                    (call) => call[0] === 'message',
+                );
+                expect(messageListenerCalls).toHaveLength(0);
+            });
+
+            addEventListenerSpy.mockRestore();
+        });
+
+        test('should attempt to trigger reload when online event occurs after auth failure', async () => {
+            jest.spyOn(baseInstance, 'getAuthPromise').mockRejectedValueOnce(
+                new Error('Auth failed'),
+            );
+            const searchEmbed = new SearchEmbed(getRootEl(), defaultViewConfig);
+            const triggerSpy = jest.spyOn(searchEmbed, 'trigger').mockResolvedValue(null);
+            await searchEmbed.render();
+
+            await executeAfterWait(() => {
+                expect(getRootEl().innerHTML).toContain('Not logged in');
+                triggerSpy.mockClear();
+                const onlineEvent = new Event('online');
+                window.dispatchEvent(onlineEvent);
+                expect(triggerSpy).toHaveBeenCalledWith(HostEvent.Reload);
+            });
+
+            triggerSpy.mockReset();
+        });
+
+        test('should handle online event gracefully when no iframe exists', async () => {
+            jest.spyOn(baseInstance, 'getAuthPromise').mockRejectedValueOnce(
+                new Error('Auth failed'),
+            );
+            const searchEmbed = new SearchEmbed(getRootEl(), defaultViewConfig);
+            const errorSpy = jest.spyOn(console, 'error').mockImplementation(() => {});
+            await searchEmbed.render();
+            await executeAfterWait(() => {
+                expect(getRootEl().innerHTML).toContain('Not logged in');
+                const onlineEvent = new Event('online');
+                expect(() => {
+                    window.dispatchEvent(onlineEvent);
+                }).not.toThrow();
+            });
+    
+            errorSpy.mockReset();
+        });
+
+        test('should register all event listeners when authentication succeeds', async () => {
+            const addEventListenerSpy = jest.spyOn(window, 'addEventListener');
+            jest.spyOn(baseInstance, 'getAuthPromise').mockResolvedValueOnce(true);
+            const searchEmbed = new SearchEmbed(getRootEl(), defaultViewConfig);
+            addEventListenerSpy.mockClear();
+            await searchEmbed.render();
+            await executeAfterWait(() => {
+                const onlineListenerCalls = addEventListenerSpy.mock.calls.filter(
+                    (call) => call[0] === 'online',
+                );
+                expect(onlineListenerCalls).toHaveLength(1);
+                const offlineListenerCalls = addEventListenerSpy.mock.calls.filter(
+                    (call) => call[0] === 'offline',
+                );
+                expect(offlineListenerCalls).toHaveLength(1);
+                const messageListenerCalls = addEventListenerSpy.mock.calls.filter(
+                    (call) => call[0] === 'message',
+                );
+                expect(messageListenerCalls).toHaveLength(1);
+            });
+
+            addEventListenerSpy.mockRestore();
+        });
+        test('should successfully trigger reload when online event occurs after auth success', async () => {
+            jest.spyOn(baseInstance, 'getAuthPromise').mockResolvedValueOnce(true);
+            const searchEmbed = new SearchEmbed(getRootEl(), defaultViewConfig);
+            const triggerSpy = jest.spyOn(searchEmbed, 'trigger').mockResolvedValue({} as any);
+            await searchEmbed.render();
+            await executeAfterWait(() => {
+                triggerSpy.mockClear();
+                const onlineEvent = new Event('online');
+                window.dispatchEvent(onlineEvent);
+                expect(triggerSpy).toHaveBeenCalledWith(HostEvent.Reload);
+            });
+            triggerSpy.mockReset();
+        });
+    });
 });

package/src/embed/ts-embed.ts

@@ -10,6 +10,7 @@ import isEqual from 'lodash/isEqual';
 import isEmpty from 'lodash/isEmpty';
 import isObject from 'lodash/isObject';
 import {
+    ContextType,
     TriggerPayload,
     TriggerResponse,
     UIPassthroughArrayResponse,
@@ -312,13 +313,36 @@ export class TsEmbed {
     private subscribedListeners: Record<string, any> = {};
 
     /**
-     * Adds a global event listener to window for "message" events.
-     * ThoughtSpot detects if a particular event is targeted to this
-     * embed instance through an identifier contained in the payload,
-     * and executes the registered callbacks accordingly.
+     * Subscribe to network events (online/offline) that should
+     * work regardless of auth status
      */
-    private subscribeToEvents() {
-        this.unsubscribeToEvents();
+    private subscribeToNetworkEvents() {
+        this.unsubscribeToNetworkEvents();
+
+        const onlineEventListener = (e: Event) => {
+            this.trigger(HostEvent.Reload);
+        };
+        window.addEventListener('online', onlineEventListener);
+
+        const offlineEventListener = (e: Event) => {
+            const offlineWarning = ERROR_MESSAGE.OFFLINE_WARNING;
+            this.executeCallbacks(EmbedEvent.Error, {
+                offlineWarning,
+            });
+            logger.warn(offlineWarning);
+        };
+        window.addEventListener('offline', offlineEventListener);
+
+        this.subscribedListeners.online = onlineEventListener;
+        this.subscribedListeners.offline = offlineEventListener;
+    }
+
+    /**
+     * Subscribe to message events that depend on successful iframe setup
+     */
+    private subscribeToMessageEvents() {
+        this.unsubscribeToMessageEvents();
+
         const messageEventListener = (event: MessageEvent<any>) => {
             const eventType = this.getEventType(event);
             const eventPort = this.getEventPort(event);
@@ -338,25 +362,37 @@ export class TsEmbed {
         };
         window.addEventListener('message', messageEventListener);
 
-        const onlineEventListener = (e: Event) => {
-            this.trigger(HostEvent.Reload);
-        };
-        window.addEventListener('online', onlineEventListener);
+        this.subscribedListeners.message = messageEventListener;
+    }
+    /**
+     * Adds event listeners for both network and message events.
+     * This maintains backward compatibility with the existing method.
+     * Adds a global event listener to window for "message" events.
+     * ThoughtSpot detects if a particular event is targeted to this
+     * embed instance through an identifier contained in the payload,
+     * and executes the registered callbacks accordingly.
+     */
+    private subscribeToEvents() {
+        this.subscribeToNetworkEvents();
+        this.subscribeToMessageEvents();
+    }
 
-        const offlineEventListener = (e: Event) => {
-            const offlineWarning = 'Network not Detected. Embed is offline. Please reconnect and refresh';
-            this.executeCallbacks(EmbedEvent.Error, {
-                offlineWarning,
-            });
-            logger.warn(offlineWarning);
-        };
-        window.addEventListener('offline', offlineEventListener);
+    private unsubscribeToNetworkEvents() {
+        if (this.subscribedListeners.online) {
+            window.removeEventListener('online', this.subscribedListeners.online);
+            delete this.subscribedListeners.online;
+        }
+        if (this.subscribedListeners.offline) {
+            window.removeEventListener('offline', this.subscribedListeners.offline);
+            delete this.subscribedListeners.offline;
+        }
+    }
 
-        this.subscribedListeners = {
-            message: messageEventListener,
-            online: onlineEventListener,
-            offline: offlineEventListener,
-        };
+    private unsubscribeToMessageEvents() {
+        if (this.subscribedListeners.message) {
+            window.removeEventListener('message', this.subscribedListeners.message);
+            delete this.subscribedListeners.message;
+        }
     }
 
     private unsubscribeToEvents() {
@@ -798,6 +834,9 @@ export class TsEmbed {
 
             uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_RENDER_START);
 
+            // Always subscribe to network events, regardless of auth status
+            this.subscribeToNetworkEvents();
+
             return getAuthPromise()
                 ?.then((isLoggedIn: boolean) => {
                     if (!isLoggedIn) {
@@ -843,7 +882,9 @@ export class TsEmbed {
                             el.remove();
                         });
                     }
-                    this.subscribeToEvents();
+                    // Subscribe to message events only after successful
+                    // auth and iframe setup
+                    this.subscribeToMessageEvents();
                 })
                 .catch((error) => {
                     nextInQueue();
@@ -1228,10 +1269,11 @@ export class TsEmbed {
      * @param {any} data The payload to send with the message
      * @returns A promise that resolves with the response from the embedded app
      */
-    public async trigger<HostEventT extends HostEvent, PayloadT>(
+    public async trigger<HostEventT extends HostEvent, PayloadT, ContextT extends ContextType>(
         messageType: HostEventT,
         data: TriggerPayload<PayloadT, HostEventT> = {} as any,
-    ): Promise<TriggerResponse<PayloadT, HostEventT>> {
+        context?: ContextT,
+    ): Promise<TriggerResponse<PayloadT, HostEventT, ContextT>> {
         uploadMixpanelEvent(`${MIXPANEL_EVENT.VISUAL_SDK_TRIGGER}-${messageType}`);
 
         if (!this.isRendered) {
@@ -1243,8 +1285,18 @@ export class TsEmbed {
             this.handleError('Host event type is undefined');
             return null;
         }
+
+        // Check if iframe exists before triggering - 
+        // this prevents the error when auth fails
+        if (!this.iFrame) {
+            logger.debug(
+                `Cannot trigger ${messageType} - iframe not available (likely due to auth failure)`,
+            );
+            return null;
+        }
+
         // send an empty object, this is needed for liveboard default handlers
-        return this.hostEventClient.triggerHostEvent(messageType, data);
+        return this.hostEventClient.triggerHostEvent(messageType, data, context);
     }
 
     /**

package/src/errors.ts

@@ -19,6 +19,7 @@ export const ERROR_MESSAGE = {
     MISSING_REPORTING_OBSERVER: 'ReportingObserver not supported',
     RENDER_CALLED_BEFORE_INIT: 'Looks like render was called before calling init, the render won\'t start until init is called.\nFor more info check\n1. https://developers.thoughtspot.com/docs/Function_init#_init\n2.https://developers.thoughtspot.com/docs/getting-started#initSdk',
     SPOTTER_AGENT_NOT_INITIALIZED: 'SpotterAgent not initialized',
+    OFFLINE_WARNING : 'Network not Detected. Embed is offline. Please reconnect and refresh',
 };
 
 export const CUSTOM_ACTIONS_ERROR_MESSAGE = {