@thoughtspot/visual-embed-sdk 1.24.0-sage.3 → 1.24.1

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@thoughtspot/visual-embed-sdk",
-    "version": "1.24.0-sage.3",
+    "version": "1.24.1",
     "description": "ThoughtSpot Embed SDK",
     "module": "lib/src/index.js",
     "main": "dist/tsembed.js",
@@ -35,6 +35,12 @@
             ]
         }
     },
+    "size-limit": [
+        {
+            "path": "dist/tsembed.js",
+            "limit": "40 kB"
+        }
+    ],
     "scripts": {
         "lint": "eslint 'src/**'",
         "lint:fix": "eslint 'src/**/*.*' --fix",
@@ -59,6 +65,7 @@
         "posttest": "cat ./coverage/sdk/lcov.info | coveralls",
         "is-publish-allowed": "node scripts/is-publish-allowed.js",
         "prepublishOnly": "npm run is-publish-allowed && npm run test && npm run tsc && npm run bundle-dts-file && npm run bundle-dts && npm run bundle-dts-react && npm run bundle-dts-react-full && npm run build",
+        "check-size": "npm run build && size-limit",
         "publish-dev": "npm publish --tag dev",
         "publish-prod": "npm publish --tag latest"
     },
@@ -89,6 +96,7 @@
         "@rollup/plugin-json": "^4.1.0",
         "@rollup/plugin-node-resolve": "^11.2.1",
         "@rollup/plugin-replace": "^5.0.2",
+        "@size-limit/preset-big-lib": "^8.2.6",
         "@testing-library/dom": "^7.31.0",
         "@testing-library/jest-dom": "^5.14.1",
         "@testing-library/react": "^11.2.7",
@@ -131,11 +139,10 @@
         "identity-obj-proxy": "^3.0.0",
         "istanbul-merge": "^1.1.1",
         "jest": "^26.6.3",
-        "jest-puppeteer": "^4.4.0",
+        "jest-fetch-mock": "^3.0.3",
         "jsdom": "^17.0.0",
         "node-sass": "^8.0.0",
         "prettier": "2.1.2",
-        "puppeteer": "^7.0.1",
         "react": "^16.14.0",
         "react-dom": "^16.14.0",
         "react-resizable": "^1.11.0",

package/src/auth.ts

@@ -22,7 +22,7 @@ export let samlAuthWindow: Window = null;
 export let samlCompletionPromise: Promise<void> = null;
 let sessionInfo: sessionInfoInterface = null;
 let sessionInfoResolver: (value: sessionInfoInterface) => void = null;
-const sessionInfoPromise = new Promise((resolve:(value: sessionInfoInterface) => void) => {
+const sessionInfoPromise = new Promise((resolve: (value: sessionInfoInterface) => void) => {
     sessionInfoResolver = resolve;
 });
 let releaseVersion = '';
@@ -44,7 +44,7 @@ interface sessionInfoInterface {
     userGUID: any;
     isPublicUser: any;
     mixpanelToken: any;
-    [key:string]:any;
+    [key: string]: any;
 }
 
 /**
@@ -213,7 +213,7 @@ export const initSession = (sessionDetails: sessionInfoInterface) => {
     }
 };
 
-export const getSessionDetails = (sessionInfoResp: any):sessionInfoInterface => {
+export const getSessionDetails = (sessionInfoResp: any): sessionInfoInterface => {
     const devMixpanelToken = sessionInfoResp.configInfo.mixpanelConfig.devSdkKey;
     const prodMixpanelToken = sessionInfoResp.configInfo.mixpanelConfig.prodSdkKey;
     const mixpanelToken = sessionInfoResp.configInfo.mixpanelConfig.production
@@ -223,6 +223,9 @@ export const getSessionDetails = (sessionInfoResp: any):sessionInfoInterface =>
         userGUID: sessionInfoResp.userGUID,
         mixpanelToken,
         isPublicUser: sessionInfoResp.configInfo.isPublicUser,
+        releaseVersion: sessionInfoResp.releaseVersion,
+        clusterId: sessionInfoResp.configInfo.selfClusterId,
+        clusterName: sessionInfoResp.configInfo.selfClusterName,
         ...sessionInfoResp,
     };
 };

package/src/css-variables.ts

@@ -23,6 +23,13 @@ export interface CustomCssVariables {
      */
     '--ts-var-root-text-transform'?: string;
 
+    /**
+     * application color, it replaces #2770EF which is rd-color(blue,base) and
+     * its similar colors like rd-color(blue,60), rd-color(accent, base) and
+     * rd-color(text, accent) in the app.
+     */
+    '--ts-var-application-color'?: string;
+
     /**
      * Background color of the top navigation panel.
      */
@@ -345,6 +352,11 @@ export interface CustomCssVariables {
      */
     '--ts-var-menu--hover-background'?: string;
 
+    /**
+     * Text color for selected menu items.
+     */
+    '--ts-var-menu-selected-text-color'?: string;
+
     /**
      * Background color of the dialogs.
      */
@@ -369,4 +381,39 @@ export interface CustomCssVariables {
      * Background color of the footer area on dialogs.
      */
     '--ts-var-dialog-footer-background'?: string;
+
+    /**
+     * Background for selected state in list
+     */
+    '--ts-var-list-selected-background'?: string;
+
+    /**
+     * Background for hover state in list
+     */
+    '--ts-var-list-hover-background'?: string;
+
+    /**
+     * Background for hover state in segment control.
+     */
+    '--ts-var-segment-control-hover-background'?: string;
+
+    /**
+     * Text color for slected item in modular home's watchlist.
+     */
+    '--ts-var-home-watchlist-selected-text-color'?: string;
+
+    /**
+     * Text color for favorite carousel find your favorites card in modular home.
+     */
+    '--ts-var-home-favorite-suggestion-card-text-color'?: string;
+
+    /**
+     * Icon color for favorite carousel find your favorites card in modular home.
+     */
+    '--ts-var-home-favorite-suggestion-card-icon-color'?: string;
+
+    /**
+     * Background for favorite carousel find your favorites card in modular home.
+     */
+    '--ts-var-home-favorite-suggestion-card-background'?: string;
   }

package/src/embed/app.spec.ts

@@ -144,6 +144,39 @@ describe('App embed tests', () => {
                 });
             });
         }
+
+        const pageRouteMapForModularHome = {
+            [Page.Search]: 'answer',
+            [Page.Answers]: 'home/answers',
+            [Page.Pinboards]: 'home/liveboards',
+            [Page.Liveboards]: 'home/liveboards',
+            [Page.Data]: 'data/tables',
+            [Page.Home]: 'home',
+            [Page.SpotIQ]: 'home/spotiq-analysis',
+        };
+
+        const pageIdsForModularHomes = Object.keys(pageRouteMapForModularHome);
+        for (let i = 0; i < pageIdsForModularHomes.length; i++) {
+            const pageIdsForModularHome = pageIdsForModularHomes[i];
+
+            test(`${pageIdsForModularHome}`, async () => {
+                const route = pageRouteMap[pageIdsForModularHome];
+                const appEmbed = new AppEmbed(getRootEl(), {
+                    ...defaultViewConfig,
+                    modularHomeExperience: true,
+                    pageId: pageIdsForModularHome as Page,
+                } as AppViewConfig);
+                appEmbed.render();
+
+                await executeAfterWait(() => {
+                    expectUrlMatchesWithParams(
+                        getIFrameSrc(),
+                        `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false${defaultParams}${defaultParamsPost}#/${route}`,
+                    );
+                    cleanUp();
+                });
+            });
+        }
     });
 
     test('should navigate to a path', async () => {
@@ -269,6 +302,36 @@ describe('App embed tests', () => {
         });
     });
 
+    test('Should add modularHomeExperience flag to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            modularHomeExperience: true,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=true${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
+    test('Should add hideHomepageLeftNav flag to the iframe src', async () => {
+        const appEmbed = new AppEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            hideHomepageLeftNav: false,
+        } as AppViewConfig);
+
+        appEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&modularHomeExperience=false&hideHomepageLeftNav=false${defaultParams}${defaultParamsPost}#/home`,
+            );
+        });
+    });
+
     test('should register event handlers to adjust iframe height', async () => {
         const onSpy = jest.spyOn(AppEmbed.prototype, 'on')
             .mockImplementation((event, callback) => {

package/src/embed/app.ts

@@ -59,8 +59,19 @@ export interface AppViewConfig extends ViewConfig {
     /**
      * If true, the main navigation bar within the ThoughtSpot app
      * is displayed. By default, the navigation bar is hidden.
+     * This flag also control the homepage left nav-bar.
      */
     showPrimaryNavbar?: boolean;
+    /**
+     * Flag to control Homepage Left Nav Bar
+     * If showPrimaryNavbar is true, ie navigation bar(Global nav-bar) and Homepage left
+     * nav-bar is visible, this flag will only hide the homepage left nav.
+     * Precedence of showPrimaryNavbar flag > hideHomepageLeftNav flag.
+     *
+     * @default false
+     * @version SDK: 1.27.0 | Thoughtspot: 9.8.0.cl
+     */
+    hideHomepageLeftNav?: boolean;
     /**
      * If true, help and profile buttons will hide on NavBar. By default,
      * they are shown.
@@ -79,12 +90,24 @@ export interface AppViewConfig extends ViewConfig {
     /**
      * A URL path within the app that is to be embedded.
      * If both path and pageId attributes are defined, the path definition
-     * takes precedence.
+     * takes precedence. This is the path post the `#/` in the URL of the standalone
+     * ThoughtSpot app. Use this to open the embedded view to a specific path.
+     *
+     * For eg, if you want the component to open to a specific liveboard
+     * you could set the path to `pinboard/<liveboardId>/tab/<tabId>`.
+     *
+     * @example
+     * ```
+     * <AppEmbed path="pinboard/1234/tab/7464" />
+     * ```
      */
     path?: string;
     /**
      * The application page to set as the start page
      * in the embedded view.
+     *
+     * Use this to open to particular page in the app. To open to a specific
+     * path within the app, use the `path` attribute which is more flexible.
      */
     pageId?: Page;
     /**
@@ -111,13 +134,13 @@ export interface AppViewConfig extends ViewConfig {
      * @version SDK: 1.13.0 | ThoughtSpot: 8.5.0.cl, 8.8.1-sw
      */
     enableSearchAssist?: boolean;
-     /**
-      * If set to true, the embedded object container dynamically resizes
-      * according to the height of the pages which support fullHeight mode.
-      *
-      * @version SDK: 1.21.0 | ThoughtSpot: 9.4.0.cl, 9.4.0-sw
-      */
-    fullHeight?:boolean;
+    /**
+     * If set to true, the embedded object container dynamically resizes
+     * according to the height of the pages which support fullHeight mode.
+     *
+     * @version SDK: 1.21.0 | ThoughtSpot: 9.4.0.cl, 9.4.0-sw
+     */
+    fullHeight?: boolean;
     /**
      * Flag to control Data panel experience
      *
@@ -126,6 +149,13 @@ export interface AppViewConfig extends ViewConfig {
      * @hidden
      */
     dataPanelV2?: boolean;
+    /**
+     * Flag to control new Modular Home experience
+     *
+     * @default false
+     * @version SDK: 1.27.0 | Thoughtspot: 9.8.0.cl
+     */
+    modularHomeExperience?: boolean;
 }
 
 /**
@@ -138,6 +168,8 @@ export class AppEmbed extends V1Embed {
 
     private defaultHeight = '100%';
 
+    protected embedComponentType = 'AppEmbed';
+
     // eslint-disable-next-line no-useless-constructor
     constructor(domSelector: DOMSelector, viewConfig: AppViewConfig) {
         super(domSelector, viewConfig);
@@ -164,6 +196,8 @@ export class AppEmbed extends V1Embed {
             enableSearchAssist,
             fullHeight,
             dataPanelV2 = false,
+            hideHomepageLeftNav = false,
+            modularHomeExperience = false,
         } = this.viewConfig;
 
         let params = {};
@@ -194,6 +228,8 @@ export class AppEmbed extends V1Embed {
         }
 
         params[Param.DataPanelV2Enabled] = dataPanelV2;
+        params[Param.HideHomepageLeftNav] = hideHomepageLeftNav;
+        params[Param.ModularHomeExperienceEnabled] = modularHomeExperience;
         const queryParams = getQueryParamString(params, true);
 
         return queryParams;
@@ -205,8 +241,8 @@ export class AppEmbed extends V1Embed {
      * @param pageId The ID of the page to be embedded.
      */
     private getIFrameSrc() {
-        const { pageId, path } = this.viewConfig;
-        const pageRoute = this.formatPath(path) || this.getPageRoute(pageId);
+        const { pageId, path, modularHomeExperience } = this.viewConfig;
+        const pageRoute = this.formatPath(path) || this.getPageRoute(pageId, modularHomeExperience);
         let url = `${this.getRootIframeSrc()}/${pageRoute}`;
 
         const tsPostHashParams = this.getThoughtSpotPostUrlParams();
@@ -243,21 +279,22 @@ export class AppEmbed extends V1Embed {
      * Gets the ThoughtSpot route of the page for a particular page ID.
      *
      * @param pageId The identifier for a page in the ThoughtSpot app.
+     * @param modularHomeExperience
      */
-    private getPageRoute(pageId: Page) {
+    private getPageRoute(pageId: Page, modularHomeExperience = false) {
         switch (pageId) {
             case Page.Search:
                 return 'answer';
             case Page.Answers:
-                return 'answers';
+                return modularHomeExperience ? 'home/answers' : 'answers';
             case Page.Liveboards:
-                return 'pinboards';
+                return modularHomeExperience ? 'home/liveboards' : 'pinboards';
             case Page.Pinboards:
-                return 'pinboards';
+                return modularHomeExperience ? 'home/liveboards' : 'pinboards';
             case Page.Data:
                 return 'data/tables';
             case Page.SpotIQ:
-                return 'insights/results';
+                return modularHomeExperience ? 'home/spotiq-analysis' : 'insights/results';
             case Page.Home:
             default:
                 return 'home';

package/src/embed/base.ts

@@ -44,13 +44,13 @@ export interface executeTMLInput {
 
 export interface exportTMLInput {
     metadata: {
-      identifier: string;
-      type?: 'LIVEBOARD' | 'ANSWER' | 'LOGICAL_TABLE' | 'CONNECTION';
+        identifier: string;
+        type?: 'LIVEBOARD' | 'ANSWER' | 'LOGICAL_TABLE' | 'CONNECTION';
     }[];
     export_associated?: boolean;
     export_fqn?: boolean;
     edoc_format?: 'YAML' | 'JSON';
-  }
+}
 
 export let authPromise: Promise<boolean>;
 /**
@@ -192,9 +192,9 @@ export const init = (embedConfig: EmbedConfig): AuthEventEmitter => {
     setAuthEE(authEE);
     handleAuth();
 
+    const { password, ...configToTrack } = config;
     uploadMixpanelEvent(MIXPANEL_EVENT.VISUAL_SDK_CALLED_INIT, {
-        authType: config.authType,
-        host: config.thoughtSpotHost,
+        ...configToTrack,
         usedCustomizationSheet: embedConfig.customizations?.style?.customCSSUrl != null,
         usedCustomizationVariables: embedConfig.customizations?.style?.customCSS?.variables != null,
         usedCustomizationRules:
@@ -258,8 +258,10 @@ export const renderInQueue = (fn: (next?: (val?: any) => void) => Promise<any>):
 
 /**
  * Imports TML representation of the metadata objects into ThoughtSpot.
+ *
  * @param data
  * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
+ * @group Global methods
  */
 export const executeTML = async (data: executeTMLInput): Promise<any> => {
     const { thoughtSpotHost, authType } = config;
@@ -305,9 +307,12 @@ export const executeTML = async (data: executeTMLInput): Promise<any> => {
 };
 
 /**
- * Exports TML representation of the metadata objects from ThoughtSpot in JSON or YAML format.
+ * Exports TML representation of the metadata objects from ThoughtSpot in JSON or YAML
+ * format.
+ *
  * @param data
  * @version SDK: 1.23.0 | ThoughtSpot: 9.4.0.cl
+ * @group Global methods
  */
 export const exportTML = async (data: exportTMLInput): Promise<any> => {
     const { thoughtSpotHost, authType } = config;

package/src/embed/liveboard.spec.ts

@@ -337,22 +337,22 @@ describe('Liveboard/viz embed tests', () => {
             done();
         });
     });
-
-    test('SetActiveTab Hostevent trigger the navigate event with the correct path, not vizEmbed', async () => {
-        const mockProcessTrigger = jest.spyOn(tsEmbed.TsEmbed.prototype, 'trigger');
+    test('should set runtime parametere values in url params', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
-            enableVizTransformations: true,
             ...defaultViewConfig,
             liveboardId,
+            runtimeParameters: [
+                {
+                    name: 'Integer Date Range',
+                    value: 1,
+                },
+            ],
         } as LiveboardViewConfig);
         liveboardEmbed.render();
         await executeAfterWait(() => {
-            const result = liveboardEmbed.trigger(HostEvent.SetActiveTab, {
-                tabId: newActiveTabId,
-            });
-            expect(mockProcessTrigger).toHaveBeenCalledWith(
-                HostEvent.Navigate,
-                `embed/viz/${liveboardId}/tab/${newActiveTabId}`,
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}&param1=Integer%20Date%20Range&paramVal1=1#/embed/viz/${liveboardId}`,
             );
         });
     });
@@ -373,4 +373,23 @@ describe('Liveboard/viz embed tests', () => {
             expect(mockProcessTrigger).not.toBeCalled();
         });
     });
+
+    test('SetActiveTab Hostevent trigger the navigate event with the correct path, not vizEmbed', async () => {
+        const mockProcessTrigger = jest.spyOn(tsEmbed.TsEmbed.prototype, 'trigger');
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            enableVizTransformations: true,
+            ...defaultViewConfig,
+            liveboardId,
+        } as LiveboardViewConfig);
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            const result = liveboardEmbed.trigger(HostEvent.SetActiveTab, {
+                tabId: newActiveTabId,
+            });
+            expect(mockProcessTrigger).toHaveBeenCalledWith(
+                HostEvent.Navigate,
+                `embed/viz/${liveboardId}/tab/${newActiveTabId}`,
+            );
+        });
+    });
 });

package/src/embed/liveboard.ts

@@ -15,11 +15,12 @@ import {
     MessagePayload,
     Param,
     RuntimeFilter,
+    RuntimeParameter,
     DOMSelector,
     HostEvent,
     ViewConfig,
 } from '../types';
-import { getQueryParamString } from '../utils';
+import { getQueryParamString, getRuntimeParameters } from '../utils';
 import { getAuthPromise } from './base';
 import { V1Embed } from './ts-embed';
 
@@ -105,6 +106,10 @@ export interface LiveboardViewConfig extends ViewConfig {
      * @version SDK: 1.25.0 | Thoughtspot: 9.6.0.cl
      */
     hideTabPanel?: boolean;
+    /**
+     * The list of parameter override to apply to a Liveboard.
+     */
+    runtimeParameters?: RuntimeParameter[];
 }
 
 /**
@@ -127,6 +132,8 @@ export class LiveboardEmbed extends V1Embed {
 
     private defaultHeight = 500;
 
+    protected embedComponentType = 'LiveboardEmbed';
+
     // eslint-disable-next-line no-useless-constructor
     constructor(domSelector: DOMSelector, viewConfig: LiveboardViewConfig) {
         super(domSelector, viewConfig);
@@ -154,6 +161,7 @@ export class LiveboardEmbed extends V1Embed {
             vizId,
             hideTabPanel,
             activeTabId,
+            runtimeParameters,
         } = this.viewConfig;
 
         const preventLiveboardFilterRemoval = this.viewConfig.preventLiveboardFilterRemoval
@@ -184,7 +192,10 @@ export class LiveboardEmbed extends V1Embed {
         if (hideTabPanel) {
             params[Param.HideTabPanel] = hideTabPanel;
         }
-        const queryParams = getQueryParamString(params, true);
+        let queryParams = getQueryParamString(params, true);
+
+        const parameterQuery = getRuntimeParameters(runtimeParameters || []);
+        if (parameterQuery) queryParams += `&${parameterQuery}`;
 
         return queryParams;
     }

package/src/embed/sage.ts

@@ -100,6 +100,8 @@ export class SageEmbed extends V1Embed {
      */
     protected viewConfig: SageViewConfig;
 
+    protected embedComponentType = 'SageEmbed';
+
     // eslint-disable-next-line no-useless-constructor
     constructor(domSelector: DOMSelector, viewConfig: SageViewConfig) {
         super(domSelector, viewConfig);

package/src/embed/search-bar.tsx

@@ -1,6 +1,4 @@
-import {
-    DOMSelector, Param, Action, ViewConfig,
-} from '../types';
+import { Param, ViewConfig } from '../types';
 import { getQueryParamString } from '../utils';
 import { TsEmbed } from './ts-embed';
 import { SearchOptions } from './search';
@@ -8,7 +6,8 @@ import { SearchOptions } from './search';
 /**
  * @group Embed components
  */
-export interface SearchBarViewConfig extends Omit<ViewConfig, 'runtimeFilters' | 'showAlerts' | 'dataPanelV2'> {
+export interface SearchBarViewConfig
+    extends Omit<ViewConfig, 'runtimeFilters' | 'showAlerts' | 'dataPanelV2'> {
     /**
      * The array of data source GUIDs to set on load.
      * Only a single dataSource supported currently.
@@ -22,6 +21,12 @@ export interface SearchBarViewConfig extends Omit<ViewConfig, 'runtimeFilters' |
      * @version: SDK: 1.19.0
      */
     dataSource?: string;
+    /**
+     * Flag to set if last selected dataSource should be used
+     *
+     * @version: SDK: 1.24.0
+     */
+    useLastSelectedSources?: boolean;
     /**
      * Configuration for search options
      */
@@ -40,6 +45,8 @@ export class SearchBarEmbed extends TsEmbed {
      */
     protected viewConfig: SearchBarViewConfig;
 
+    protected embedComponentType = 'SearchBarEmbed';
+
     constructor(domSelector: string, viewConfig: SearchBarViewConfig) {
         super(domSelector);
         this.viewConfig = viewConfig;
@@ -52,7 +59,12 @@ export class SearchBarEmbed extends TsEmbed {
      * @param dataSources A list of data source GUIDs
      */
     private getIFrameSrc() {
-        const { searchOptions, dataSource, dataSources } = this.viewConfig;
+        const {
+            searchOptions,
+            dataSource,
+            dataSources,
+            useLastSelectedSources = false,
+        } = this.viewConfig;
         const path = 'search-bar-embed';
         const queryParams = this.getBaseQueryParams();
 
@@ -74,7 +86,10 @@ export class SearchBarEmbed extends TsEmbed {
             }
         }
 
-        queryParams[Param.UseLastSelectedDataSource] = false;
+        queryParams[Param.UseLastSelectedDataSource] = useLastSelectedSources;
+        if (dataSource || dataSources) {
+            queryParams[Param.UseLastSelectedDataSource] = false;
+        }
         queryParams[Param.searchEmbed] = true;
         let query = '';
         const queryParamsString = getQueryParamString(queryParams, true);

package/src/embed/search.spec.ts

@@ -350,4 +350,65 @@ describe('Search embed tests', () => {
             );
         });
     });
+    test('should set useLastSelectedSources to true if useLastSelectedSources flag is true', async () => {
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            useLastSelectedSources: true,
+        });
+        searchEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/v2/?${defaultParamsWithHiddenActions}&dataSourceMode=expand&enableDataPanelV2=false&useLastSelectedSources=true${prefixParams}#/embed/saved-answer/${answerId}`,
+            );
+        });
+    });
+    test('should set useLastSelectedSources to false if datasource is given irrespective of useLastSelectedSources', async () => {
+        const dataSource = 'data-source-1';
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            useLastSelectedSources: true,
+            dataSource,
+        });
+        searchEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/v2/?${defaultParamsWithHiddenActions}&dataSources=[%22data-source-1%22]&dataSourceMode=expand&enableDataPanelV2=false&useLastSelectedSources=false${prefixParams}#/embed/saved-answer/${answerId}`,
+            );
+        });
+    });
+    test('should set useLastSelectedSources to false if datasources are given irrespective of useLastSelectedSources', async () => {
+        const dataSources = ['data-source-1'];
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            useLastSelectedSources: true,
+            dataSources,
+        });
+        searchEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/v2/?${defaultParamsWithHiddenActions}&dataSources=[%22data-source-1%22]&dataSourceMode=expand&enableDataPanelV2=false&useLastSelectedSources=false${prefixParams}#/embed/saved-answer/${answerId}`,
+            );
+        });
+    });
+    test('should set runtime parametere values in url params', async () => {
+        const searchEmbed = new SearchEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            runtimeParameters: [
+                {
+                    name: 'Integer Date Range',
+                    value: 1,
+                },
+            ],
+        });
+        searchEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(
+                getIFrameSrc(),
+                `http://${thoughtSpotHost}/v2/?${defaultParamsWithHiddenActions}&dataSourceMode=expand&useLastSelectedSources=false${prefixParams}&param1=Integer%20Date%20Range&paramVal1=1#/embed/saved-answer/${answerId}`,
+            );
+        });
+    });
 });