@thoughtspot/visual-embed-sdk 1.26.2 → 1.27.0-logger

package/src/embed/ts-embed.ts

@@ -8,7 +8,7 @@
  */
 
 import isEqual from 'lodash/isEqual';
-
+import { logger } from '../utils/logger';
 import { getAuthenticationToken } from '../authToken';
 import { AnswerService } from '../utils/graphql/answerService/answerService';
 import {
@@ -52,7 +52,7 @@ import {
     RuntimeFilter,
 } from '../types';
 import { uploadMixpanelEvent, MIXPANEL_EVENT } from '../mixpanel-service';
-import { processEventData } from '../utils/processData';
+import { processEventData, processAuthFailure } from '../utils/processData';
 import { processTrigger } from '../utils/processTrigger';
 import pkgInfo from '../../package.json';
 import {
@@ -199,7 +199,7 @@ export class TsEmbed {
             error,
         });
         // Log error
-        console.error(error);
+        logger.error(error);
     }
 
     /**
@@ -283,7 +283,7 @@ export class TsEmbed {
             this.executeCallbacks(EmbedEvent.Error, {
                 offlineWarning,
             });
-            console.warn(offlineWarning);
+            logger.warn(offlineWarning);
         };
         window.addEventListener('offline', offlineEventListener);
 
@@ -309,7 +309,12 @@ export class TsEmbed {
     private appInitCb = async (_: any, responder: any) => {
         let authToken = '';
         if (this.embedConfig.authType === AuthType.TrustedAuthTokenCookieless) {
-            authToken = await getAuthenticationToken(this.embedConfig);
+            try {
+                authToken = await getAuthenticationToken(this.embedConfig);
+            } catch (e) {
+                processAuthFailure(e, this.isPreRendered ? this.preRenderWrapper : this.el);
+                return;
+            }
         }
         this.isAppInitialized = true;
         responder({
@@ -339,11 +344,16 @@ export class TsEmbed {
     private updateAuthToken = async (_: any, responder: any) => {
         const { autoLogin = false, authType } = this.embedConfig; // Set autoLogin default to false
         if (authType === AuthType.TrustedAuthTokenCookieless) {
-            const authToken = await getAuthenticationToken(this.embedConfig);
-            responder({
-                type: EmbedEvent.AuthExpire,
-                data: { authToken },
-            });
+            let authToken = '';
+            try {
+                authToken = await getAuthenticationToken(this.embedConfig);
+                responder({
+                    type: EmbedEvent.AuthExpire,
+                    data: { authToken },
+                });
+            } catch (e) {
+                processAuthFailure(e, this.isPreRendered ? this.preRenderWrapper : this.el);
+            }
         } else if (autoLogin) {
             handleAuth();
         }
@@ -493,6 +503,9 @@ export class TsEmbed {
             queryParams[Param.ShowInsertToSlide] = insertInToSlide;
         }
 
+        queryParams[Param.OverrideNativeConsole] = true;
+        queryParams[Param.ClientLogLevel] = this.embedConfig.logLevel;
+
         return queryParams;
     }
 
@@ -508,7 +521,11 @@ export class TsEmbed {
         const queryParams = this.shouldEncodeUrlQueryParams
             ? `?base64UrlEncodedFlags=${getEncodedQueryParamsString(queryString)}`
             : `?${queryString}`;
-        const path = `${this.thoughtSpotHost}/${queryParams}#`;
+        let host = this.thoughtSpotHost;
+        if (!isUndefined(this.embedConfig.enableReactShell)) {
+            host = this.embedConfig.enableReactShell as boolean ? '/v2' : '/v1';
+        }
+        const path = `${host}/${queryParams}#`;
         return path;
     }
 
@@ -527,6 +544,7 @@ export class TsEmbed {
 
         iFrame.src = frameSrc;
         iFrame.id = TS_EMBED_ID;
+        iFrame.setAttribute('data-ts-iframe', 'true');
 
         // according to screenfull.js documentation
         // allowFullscreen, webkitallowfullscreen and mozallowfullscreen must be
@@ -938,10 +956,10 @@ export class TsEmbed {
                 });
             } catch (e) {
                 eventPort.postMessage({ error: e });
-                console.log(e);
+                logger.log(e);
             }
         } else {
-            console.log('Event Port is not defined');
+            logger.log('Event Port is not defined');
         }
     }
 
@@ -980,7 +998,7 @@ export class TsEmbed {
      */
     public preRender(showPreRenderByDefault = false): TsEmbed {
         if (!this.viewConfig.preRenderId) {
-            console.error('PreRender id is required for preRender');
+            logger.error('PreRender id is required for preRender');
             return this;
         }
         this.isPreRendered = true;
@@ -1029,7 +1047,7 @@ export class TsEmbed {
             this.insertedDomEl?.parentNode.removeChild(this.insertedDomEl);
             this.unsubscribeToEvents();
         } catch (e) {
-            console.log('Error destroying TS Embed', e);
+            logger.log('Error destroying TS Embed', e);
         }
     }
 
@@ -1069,7 +1087,7 @@ export class TsEmbed {
                     !isUndefined(viewConfig[key])
                     && !isEqual(viewConfig[key], preRenderedObject.viewConfig[key])
                 ) {
-                    console.warn(
+                    logger.warn(
                         `${this.embedComponentType} was pre-rendered with `
                             + `"${key}" as "${JSON.stringify(preRenderedObject.viewConfig[key])}" `
                             + `but a different value "${JSON.stringify(viewConfig[key])}" `
@@ -1090,7 +1108,7 @@ export class TsEmbed {
      */
     public showPreRender(): void {
         if (!this.viewConfig.preRenderId) {
-            console.error('PreRender id is required for preRender');
+            logger.error('PreRender id is required for preRender');
             return;
         }
         if (!this.isPreRenderAvailable()) {
@@ -1139,7 +1157,7 @@ export class TsEmbed {
      */
     public syncPreRenderStyle(): void {
         if (!this.isPreRenderAvailable() || !this.el) {
-            console.error('PreRender should be called before using syncPreRenderStyle');
+            logger.error('PreRender should be called before using syncPreRenderStyle');
             return;
         }
         const elBoundingClient = this.el.getBoundingClientRect();
@@ -1159,7 +1177,7 @@ export class TsEmbed {
     public hidePreRender(): void {
         if (!this.isPreRenderAvailable()) {
             // if the embed component is not preRendered , nothing to hide
-            console.warn('PreRender should be called before hiding it using hidePreRender.');
+            logger.warn('PreRender should be called before hiding it using hidePreRender.');
             return;
         }
         const preRenderHideStyles = {

package/src/index.ts

@@ -45,6 +45,7 @@ import {
     customCssInterface,
     ContextMenuTriggerOptions,
     RuntimeParameter,
+    LogLevel,
 } from './types';
 import { CustomCssVariables } from './css-variables';
 import { SageEmbed, SageViewConfig } from './embed/sage';
@@ -101,4 +102,5 @@ export {
     customCssInterface,
     CustomCssVariables,
     RuntimeParameter,
+    LogLevel,
 };

package/src/mixpanel-service.ts

@@ -1,4 +1,5 @@
 import * as mixpanel from 'mixpanel-browser';
+import { logger } from './utils/logger';
 
 export const EndPoints = {
     CONFIG: '/callosum/v1/system/config',
@@ -77,7 +78,7 @@ export function initMixpanel(sessionInfo: any): void {
             emptyQueue();
         }
     } catch (e) {
-        console.error('Error initializing mixpanel', e);
+        logger.error('Error initializing mixpanel', e);
     }
 }
 

package/src/react/index.spec.tsx

@@ -49,7 +49,7 @@ describe('React Components', () => {
                 ),
             ).toBe(true);
             expect(getIFrameSrc(container)).toBe(
-                `http://${thoughtSpotHost}/?hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}&authType=None&blockNonEmbedFullAppAccess=true&hideAction=[%22${Action.ReportError}%22,%22editACopy%22,%22saveAsView%22,%22updateTSL%22,%22editTSL%22,%22onDeleteAnswer%22]&enableDataPanelV2=false&dataSourceMode=hide&useLastSelectedSources=false&isSearchEmbed=true#/embed/answer`,
+                `http://${thoughtSpotHost}/?hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}&authType=None&blockNonEmbedFullAppAccess=true&hideAction=[%22${Action.ReportError}%22,%22editACopy%22,%22saveAsView%22,%22updateTSL%22,%22editTSL%22,%22onDeleteAnswer%22]&overrideConsoleLogs=true&clientLogLevel=ERROR&enableDataPanelV2=false&dataSourceMode=hide&useLastSelectedSources=false&isSearchEmbed=true#/embed/answer`,
             );
         });
 
@@ -199,35 +199,6 @@ describe('React Components', () => {
             ).toBe(true);
             expect(containerSibling.querySelector('div')).toBe(null);
         });
-
-        it('Should have the correct container element', async () => {
-            const { container } = render(
-                <LiveboardEmbed liveboardId="abcd" className="def" />,
-            );
-
-            await waitFor(() => getIFrameEl(container));
-            expect(container.querySelector('div')).not.toBe(null);
-            expect(
-                container.querySelector('div').classList.contains('def'),
-            ).toBe(true);
-
-            const { container: containerSibling } = render(
-                <LiveboardEmbed
-                    liveboardId="abcd"
-                    className="def"
-                    insertAsSibling={true}
-                />,
-            );
-            await waitFor(() => getIFrameEl(containerSibling));
-            expect(containerSibling.querySelector('span')).not.toBe(null);
-            expect(containerSibling.querySelector('span').style.position).toBe(
-                'absolute',
-            );
-            expect(
-                getIFrameEl(containerSibling).classList.contains('def'),
-            ).toBe(true);
-            expect(containerSibling.querySelector('div')).toBe(null);
-        });
     });
 
     describe('SearchBarEmbed', () => {
@@ -251,7 +222,7 @@ describe('React Components', () => {
                 ),
             ).toBe(true);
             expect(getIFrameSrc(container)).toBe(
-                `http://${thoughtSpotHost}/?hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}&authType=None&blockNonEmbedFullAppAccess=true&hideAction=[%22${Action.ReportError}%22]&dataSources=[%22test%22]&searchTokenString=%5Brevenue%5D&executeSearch=true&useLastSelectedSources=false&isSearchEmbed=true#/embed/search-bar-embed`,
+                `http://${thoughtSpotHost}/?hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}&authType=None&blockNonEmbedFullAppAccess=true&hideAction=[%22${Action.ReportError}%22]&overrideConsoleLogs=true&clientLogLevel=ERROR&dataSources=[%22test%22]&searchTokenString=%5Brevenue%5D&executeSearch=true&useLastSelectedSources=false&isSearchEmbed=true#/embed/search-bar-embed`,
             );
         });
     });