@thoughtspot/visual-embed-sdk 1.20.0-alpha.2 → 1.20.0-prerender.0

package/src/embed/liveboard.spec.ts

@@ -15,6 +15,10 @@ import {
     getRootEl,
     defaultParams,
     defaultParamsWithoutHiddenActions,
+    expectUrlMatchesWithParams,
+    postMessageToParent,
+    getIFrameEl,
+    mockMessageChannel,
 } from '../test/test-utils';
 import { version } from '../../package.json';
 import * as processTriggerInstance from '../utils/processTrigger';
@@ -51,7 +55,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -59,18 +64,15 @@ describe('Liveboard/viz embed tests', () => {
 
     test('should set disabled actions', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
-            disabledActions: [
-                Action.DownloadAsCsv,
-                Action.DownloadAsPdf,
-                Action.DownloadAsXlsx,
-            ],
+            disabledActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
             disabledActionReason: 'Action denied',
             ...defaultViewConfig,
             liveboardId,
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&${defaultParamsWithoutHiddenActions}&disableAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]&disableHint=Action%20denied&hideAction=[%22${Action.ReportError}%22]${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -78,17 +80,14 @@ describe('Liveboard/viz embed tests', () => {
 
     test('should set hidden actions', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
-            hiddenActions: [
-                Action.DownloadAsCsv,
-                Action.DownloadAsPdf,
-                Action.DownloadAsXlsx,
-            ],
+            hiddenActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
             ...defaultViewConfig,
             liveboardId,
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&${defaultParamsWithoutHiddenActions}&hideAction=[%22${Action.ReportError}%22,%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -96,17 +95,14 @@ describe('Liveboard/viz embed tests', () => {
 
     test('should set visible actions', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
-            visibleActions: [
-                Action.DownloadAsCsv,
-                Action.DownloadAsPdf,
-                Action.DownloadAsXlsx,
-            ],
+            visibleActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
             ...defaultViewConfig,
             liveboardId,
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&visibleAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -120,7 +116,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&visibleAction=[]${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -134,7 +131,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableVizTransform=true${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -148,7 +146,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableVizTransform=false${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
@@ -162,7 +161,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParamsVizEmbed}#/embed/viz/${liveboardId}/${vizId}`,
             );
         });
@@ -183,13 +183,15 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&col1=sales&op1=EQ&val1=1000${defaultParams}${prefixParamsVizEmbed}#/embed/viz/${liveboardId}/${vizId}`,
             );
         });
     });
 
     test('should register event handler to adjust iframe height', async () => {
+        const onSpy = jest.spyOn(LiveboardEmbed.prototype, 'on');
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,
             fullHeight: true,
@@ -197,14 +199,10 @@ describe('Liveboard/viz embed tests', () => {
             vizId,
         } as LiveboardViewConfig);
 
-        const onSpy = jest.spyOn(liveboardEmbed, 'on');
         liveboardEmbed.render();
 
         executeAfterWait(() => {
-            expect(onSpy).toHaveBeenCalledWith(
-                EmbedEvent.EmbedHeight,
-                expect.anything(),
-            );
+            expect(onSpy).toHaveBeenCalledWith(EmbedEvent.EmbedHeight, expect.anything());
         });
     });
     test('Should set the visible vizs', async () => {
@@ -215,16 +213,14 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&pinboardVisibleVizs=[%22abcd%22,%22pqrs%22]${prefixParams}#/embed/viz/${liveboardId}`,
             );
         });
     });
     test('should process the trigger, for vizEmbed', async () => {
-        const mockProcessTrigger = spyOn(
-            processTriggerInstance,
-            'processTrigger',
-        );
+        const mockProcessTrigger = spyOn(processTriggerInstance, 'processTrigger');
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             enableVizTransformations: true,
             ...defaultViewConfig,
@@ -244,7 +240,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isLiveboardEmbed=true&isPinboardV2Enabled=true#/embed/viz/${liveboardId}/tab/${activeTabId}`,
             );
         });
@@ -259,7 +256,8 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&preventPinboardFilterRemoval=true&isLiveboardEmbed=true&isPinboardV2Enabled=true#/embed/viz/${liveboardId}/tab/${activeTabId}`,
             );
         });
@@ -273,9 +271,30 @@ describe('Liveboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isContextMenuEnabledOnLeftClick=true&isLiveboardEmbed=true&isPinboardV2Enabled=true#/embed/viz/${liveboardId}/tab/${activeTabId}`,
             );
         });
     });
+
+    test('navigateToLiveboard should trigger the navigate event with the correct path', (done) => {
+        mockMessageChannel();
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+        } as LiveboardViewConfig);
+        const onSpy = jest.spyOn(liveboardEmbed, 'trigger');
+        liveboardEmbed.prerenderGeneric();
+        executeAfterWait(() => {
+            const iframe = getIFrameEl();
+            postMessageToParent(iframe.contentWindow, {
+                type: EmbedEvent.APP_INIT,
+            });
+        });
+        executeAfterWait(() => {
+            liveboardEmbed.navigateToLiveboard('lb1', 'viz1');
+            expect(onSpy).toHaveBeenCalledWith(HostEvent.Navigate, '/embed/viz/lb1/viz1');
+            done();
+        });
+    });
 });

package/src/embed/liveboard.ts

@@ -19,17 +19,20 @@ import {
     HostEvent,
     ViewConfig,
 } from '../types';
-import { getFilterQuery, getQueryParamString } from '../utils';
+import { getQueryParamString } from '../utils';
+import { getAuthPromise } from './base';
 import { V1Embed } from './ts-embed';
 
 /**
  * The configuration for the embedded Liveboard or visualization page view.
- * @Category Liveboards and Charts
+ *
+ * @group Embed components
  */
 export interface LiveboardViewConfig extends ViewConfig {
     /**
      * If set to true, the embedded object container dynamically resizes
      * according to the height of the Liveboard.
+     *
      * @version SDK: 1.1.0 | ThoughtSpot: ts7.may.cl, 7.2.1
      */
     fullHeight?: boolean;
@@ -37,6 +40,7 @@ export interface LiveboardViewConfig extends ViewConfig {
      * This is the minimum height(in pixels) for a full height Liveboard.
      * Setting this height helps resolves issues with empty Liveboards and
      * other screens navigable from a Liveboard.
+     *
      * @version SDK: 1.5.0 | ThoughtSpot: ts7.oct.cl, 7.2.1
      * @default 500
      */
@@ -48,11 +52,13 @@ export interface LiveboardViewConfig extends ViewConfig {
     /**
      * The Liveboard to display in the embedded view.
      * Use either of liveboardId or pinboardId to reference the Liveboard to embed.
+     *
      * @version SDK: 1.3.0 | ThoughtSpot ts7.aug.cl, 7.2.1
      */
     liveboardId?: string;
     /**
      * To support backward compatibility
+     *
      * @hidden
      */
     pinboardId?: string;
@@ -63,6 +69,7 @@ export interface LiveboardViewConfig extends ViewConfig {
     /**
      * If set to true, all filter chips from a
      * Liveboard page will be read-only (no X buttons)
+     *
      * @version SDK: 1.3.0 | ThoughtSpot ts7.aug.cl, 7.2.1
      */
     preventLiveboardFilterRemoval?: boolean;
@@ -70,21 +77,25 @@ export interface LiveboardViewConfig extends ViewConfig {
      * Array of viz ids which should be visible when the liveboard
      * first renders. This can be changed by triggering the "SetVisibleVizs"
      * event.
+     *
      * @version SDK: 1.9.1 | ThoughtSpot: 8.1.0.cl, 8.4.1-sw
      */
     visibleVizs?: string[];
     /**
      * To support backward compatibilty
+     *
      * @hidden
      */
     preventPinboardFilterRemoval?: boolean;
     /**
      * Render embedded Liveboards and visualizations in the new Liveboard experience mode
+     *
      * @version SDK: 1.14.0 | ThoughtSpot: 8.6.0.cl, 8.8.1-sw
      */
     liveboardV2?: boolean;
     /**
      * Tab Id of the Liveboard that is supposed to be active
+     *
      * @version SDK: 1.15.0 | ThoughtSpot: 8.7.0.cl, 8.8.1-sw
      */
     activeTabId?: string;
@@ -92,7 +103,8 @@ export interface LiveboardViewConfig extends ViewConfig {
 
 /**
  * Embed a ThoughtSpot Liveboard or visualization
- * @Category Liveboards and Charts
+ *
+ * @group Embed components
  */
 export class LiveboardEmbed extends V1Embed {
     protected viewConfig: LiveboardViewConfig;
@@ -102,14 +114,21 @@ export class LiveboardEmbed extends V1Embed {
     // eslint-disable-next-line no-useless-constructor
     constructor(domSelector: DOMSelector, viewConfig: LiveboardViewConfig) {
         super(domSelector, viewConfig);
+        if (this.viewConfig.fullHeight === true) {
+            this.on(EmbedEvent.RouteChange, this.setIframeHeightForNonEmbedLiveboard);
+            this.on(EmbedEvent.EmbedHeight, this.updateIFrameHeight);
+            this.on(EmbedEvent.EmbedIframeCenter, this.embedIframeCenter);
+        }
     }
 
     /**
      * Construct a map of params to be passed on to the
      * embedded Liveboard or visualization.
      */
-    private getEmbedParams() {
-        const params = this.getBaseQueryParams();
+    protected getEmbedParams() {
+        let params = {};
+        params[Param.EmbedApp] = true;
+        params = this.getBaseQueryParams(params);
         const {
             enableVizTransformations,
             fullHeight,
@@ -120,9 +139,8 @@ export class LiveboardEmbed extends V1Embed {
             activeTabId,
         } = this.viewConfig;
 
-        const preventLiveboardFilterRemoval =
-            this.viewConfig.preventLiveboardFilterRemoval ||
-            this.viewConfig.preventPinboardFilterRemoval;
+        const preventLiveboardFilterRemoval = this.viewConfig.preventLiveboardFilterRemoval
+            || this.viewConfig.preventPinboardFilterRemoval;
 
         if (fullHeight === true) {
             params[Param.fullHeight] = true;
@@ -131,9 +149,7 @@ export class LiveboardEmbed extends V1Embed {
             this.defaultHeight = defaultHeight;
         }
         if (enableVizTransformations !== undefined) {
-            params[
-                Param.EnableVizTransformations
-            ] = enableVizTransformations.toString();
+            params[Param.EnableVizTransformations] = enableVizTransformations.toString();
         }
         if (preventLiveboardFilterRemoval) {
             params[Param.preventLiveboardFilterRemoval] = true;
@@ -153,47 +169,41 @@ export class LiveboardEmbed extends V1Embed {
         return queryParams;
     }
 
-    /**
-     * Construct the URL of the embedded ThoughtSpot Liveboard or visualization
-     * to be loaded within the iframe.
-     * @param liveboardId The GUID of the Liveboard.
-     * @param vizId The optional GUID of a visualization within the Liveboard.
-     * @param runtimeFilters A list of runtime filters to be applied to
-     * the Liveboard or visualization on load.
-     */
-    private getIFrameSrc(
-        liveboardId: string,
-        vizId?: string,
-        runtimeFilters?: RuntimeFilter[],
-        activeTabId?: string,
-    ) {
-        const filterQuery = getFilterQuery(runtimeFilters || []);
-        const queryParams = this.getEmbedParams();
-        const queryString = [filterQuery, queryParams]
-            .filter(Boolean)
-            .join('&');
-        let url = `${this.getV1EmbedBasePath(
-            queryString,
-            true,
-            false,
-            false,
-        )}/viz/${liveboardId}`;
+    private getIframeSuffixSrc(liveboardId: string, vizId: string, activeTabId: string) {
+        let suffix = `/embed/viz/${liveboardId}`;
         if (activeTabId) {
-            url = `${url}/tab/${activeTabId}`;
+            suffix = `${suffix}/tab/${activeTabId} `;
         }
         if (vizId) {
-            url = `${url}/${vizId}`;
+            suffix = `${suffix}/${vizId}`;
         }
-
         const tsPostHashParams = this.getThoughtSpotPostUrlParams();
-        url = `${url}${tsPostHashParams}`;
+        suffix = `${suffix}${tsPostHashParams}`;
+        return suffix;
+    }
+
+    /**
+     * Construct the URL of the embedded ThoughtSpot Liveboard or visualization
+     * to be loaded within the iframe.
+     */
+    private getIFrameSrc() {
+        const { vizId, activeTabId } = this.viewConfig;
+        const liveboardId = this.viewConfig.liveboardId ?? this.viewConfig.pinboardId;
 
-        return url;
+        if (!liveboardId) {
+            this.handleError(ERROR_MESSAGE.LIVEBOARD_VIZ_ID_VALIDATION);
+        }
+        return `${this.getRootIframeSrc()}${this.getIframeSuffixSrc(
+            liveboardId,
+            vizId,
+            activeTabId,
+        )}`;
     }
 
     /**
      * Set the iframe height as per the computed height received
      * from the ThoughtSpot app.
+     *
      * @param data The event payload
      */
     private updateIFrameHeight = (data: MessagePayload) => {
@@ -213,12 +223,13 @@ export class LiveboardEmbed extends V1Embed {
 
     /**
      * Triggers an event to the embedded app
+     *
      * @param messageType The event type
      * @param data The payload to send with the message
      */
     public trigger(messageType: HostEvent, data: any = {}): Promise<any> {
         const dataWithVizId = data;
-        if (this.viewConfig.vizId) {
+        if (typeof dataWithVizId === 'object' && this.viewConfig.vizId) {
             dataWithVizId.vizId = this.viewConfig.vizId;
         }
         return super.trigger(messageType, dataWithVizId);
@@ -226,39 +237,30 @@ export class LiveboardEmbed extends V1Embed {
 
     /**
      * Render an embedded ThoughtSpot Liveboard or visualization
+     *
      * @param renderOptions An object specifying the Liveboard ID,
      * visualization ID and the runtime filters.
      */
     public render(): LiveboardEmbed {
-        const { vizId, activeTabId, runtimeFilters } = this.viewConfig;
-        const liveboardId =
-            this.viewConfig.liveboardId ?? this.viewConfig.pinboardId;
-
-        if (!liveboardId) {
-            this.handleError(ERROR_MESSAGE.LIVEBOARD_VIZ_ID_VALIDATION);
-        }
-
-        if (this.viewConfig.fullHeight === true) {
-            this.on(
-                EmbedEvent.RouteChange,
-                this.setIframeHeightForNonEmbedLiveboard,
-            );
-            this.on(EmbedEvent.EmbedHeight, this.updateIFrameHeight);
-            this.on(EmbedEvent.EmbedIframeCenter, this.embedIframeCenter);
-        }
-
         super.render();
 
-        const src = this.getIFrameSrc(
-            liveboardId,
-            vizId,
-            runtimeFilters,
-            activeTabId,
-        );
+        const src = this.getIFrameSrc();
         this.renderV1Embed(src);
 
         return this;
     }
+
+    public navigateToLiveboard(liveboardId: string, vizId?: string, activeTabId?: string) {
+        const path = this.getIframeSuffixSrc(liveboardId, vizId, activeTabId);
+        this.viewConfig.liveboardId = liveboardId;
+        this.viewConfig.activeTabId = activeTabId;
+        this.viewConfig.vizId = vizId;
+        if (this.isAppInitialized) {
+            this.trigger(HostEvent.Navigate, path);
+        } else {
+            this.render();
+        }
+    }
 }
 
 /**

package/src/embed/pinboard.spec.ts

@@ -1,6 +1,8 @@
 import { PinboardEmbed, LiveboardViewConfig } from './liveboard';
 import { init } from '../index';
-import { Action, AuthType, EmbedEvent, RuntimeFilterOp } from '../types';
+import {
+    Action, AuthType, EmbedEvent, RuntimeFilterOp,
+} from '../types';
 import {
     executeAfterWait,
     getDocumentBody,
@@ -8,6 +10,7 @@ import {
     getRootEl,
     defaultParams,
     defaultParamsWithoutHiddenActions,
+    expectUrlMatchesWithParams,
 } from '../test/test-utils';
 import { version } from '../../package.json';
 
@@ -41,7 +44,8 @@ describe('Pinboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -49,18 +53,15 @@ describe('Pinboard/viz embed tests', () => {
 
     test('should set disabled actions', async () => {
         const pinboardEmbed = new PinboardEmbed(getRootEl(), {
-            disabledActions: [
-                Action.DownloadAsCsv,
-                Action.DownloadAsPdf,
-                Action.DownloadAsXlsx,
-            ],
+            disabledActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
             disabledActionReason: 'Action denied',
             ...defaultViewConfig,
             pinboardId,
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&${defaultParamsWithoutHiddenActions}&disableAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]&disableHint=Action%20denied&hideAction=[%22${Action.ReportError}%22]${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -68,17 +69,14 @@ describe('Pinboard/viz embed tests', () => {
 
     test('should set hidden actions', async () => {
         const pinboardEmbed = new PinboardEmbed(getRootEl(), {
-            hiddenActions: [
-                Action.DownloadAsCsv,
-                Action.DownloadAsPdf,
-                Action.DownloadAsXlsx,
-            ],
+            hiddenActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
             ...defaultViewConfig,
             pinboardId,
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&${defaultParamsWithoutHiddenActions}&hideAction=[%22${Action.ReportError}%22,%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -86,17 +84,14 @@ describe('Pinboard/viz embed tests', () => {
 
     test('should set visible actions', async () => {
         const pinboardEmbed = new PinboardEmbed(getRootEl(), {
-            visibleActions: [
-                Action.DownloadAsCsv,
-                Action.DownloadAsPdf,
-                Action.DownloadAsXlsx,
-            ],
+            visibleActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
             ...defaultViewConfig,
             pinboardId,
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&visibleAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -110,7 +105,8 @@ describe('Pinboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&visibleAction=[]${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -124,7 +120,8 @@ describe('Pinboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableVizTransform=true${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -138,7 +135,8 @@ describe('Pinboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableVizTransform=false${prefixParams}#/embed/viz/${pinboardId}`,
             );
         });
@@ -152,7 +150,8 @@ describe('Pinboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParamsVizEmbed}#/embed/viz/${pinboardId}/${vizId}`,
             );
         });
@@ -173,7 +172,8 @@ describe('Pinboard/viz embed tests', () => {
         } as LiveboardViewConfig);
         pinboardEmbed.render();
         await executeAfterWait(() => {
-            expect(getIFrameSrc()).toBe(
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
                 `http://${thoughtSpotHost}/?embedApp=true&col1=sales&op1=EQ&val1=1000${defaultParams}${prefixParamsVizEmbed}#/embed/viz/${pinboardId}/${vizId}`,
             );
         });
@@ -191,10 +191,7 @@ describe('Pinboard/viz embed tests', () => {
         pinboardEmbed.render();
 
         executeAfterWait(() => {
-            expect(onSpy).toHaveBeenCalledWith(
-                EmbedEvent.EmbedHeight,
-                expect.anything(),
-            );
+            expect(onSpy).toHaveBeenCalledWith(EmbedEvent.EmbedHeight, expect.anything());
         });
     });
 });