@thoughtspot/visual-embed-sdk 1.51.0 → 1.51.1

package/lib/src/embed/liveboard.spec.js

@@ -7,6 +7,8 @@ import * as processTriggerInstance from '../utils/processTrigger';
 import * as auth from '../auth';
 import * as previewService from '../utils/graphql/preview-service';
 import * as SessionInfoService from '../utils/sessionInfoService';
+import { logger } from '../utils/logger';
+import { DEFAULT_LAZY_LOADING_MARGIN } from '../config';
 const defaultViewConfig = {
     frameParams: {
         width: 1280,
@@ -106,6 +108,22 @@ describe('Liveboard/viz embed tests', () => {
             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}`);
         });
     });
+    test('should hide and disable the Spotter button on the Liveboard header', async () => {
+        expect(Action.SpotterOnLiveboard).toBe('spotterOnLiveboard');
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            hiddenActions: [Action.SpotterOnLiveboard],
+            disabledActions: [Action.SpotterOnLiveboard],
+            ...defaultViewConfig,
+            liveboardId,
+        });
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlToHaveParamsWithValues(getIFrameSrc(), {
+                hideAction: JSON.stringify([Action.ReportError, Action.SpotterOnLiveboard]),
+                disableAction: JSON.stringify([Action.SpotterOnLiveboard]),
+            });
+        });
+    });
     test('should set visible actions', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             visibleActions: [Action.DownloadAsCsv, Action.DownloadAsPdf, Action.DownloadAsXlsx],
@@ -141,6 +159,17 @@ describe('Liveboard/viz embed tests', () => {
             expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enable2ColumnLayout=true${prefixParams}#/embed/viz/${liveboardId}`);
         });
     });
+    test('should set isLiveboardAlwaysOn12ColLayout to true in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            isLiveboardAlwaysOn12ColLayout: true,
+            ...defaultViewConfig,
+            liveboardId,
+        });
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isLiveboardAlwaysOn12ColLayout=true${prefixParams}#/embed/viz/${liveboardId}`);
+        });
+    });
     test('should set isLiveboardStylingAndGroupingEnabled to true in url (deprecated, use isLiveboardMasterpiecesEnabled)', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             isLiveboardStylingAndGroupingEnabled: true,
@@ -152,6 +181,28 @@ describe('Liveboard/viz embed tests', () => {
             expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&isLiveboardStylingAndGroupingEnabled=true${prefixParams}#/embed/viz/${liveboardId}`);
         });
     });
+    test('should set liveboardGutter in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            liveboardGutter: 8,
+        });
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&liveboardGutter=8${prefixParams}#/embed/viz/${liveboardId}`);
+        });
+    });
+    test('should set liveboardGutter to 0 in url', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            liveboardGutter: 0,
+        });
+        liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}&liveboardGutter=0${prefixParams}#/embed/viz/${liveboardId}`);
+        });
+    });
     test('should set isThisPeriodInDateFiltersEnabled to true in url', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -969,6 +1020,37 @@ describe('Liveboard/viz embed tests', () => {
             expect(onSpy).toHaveBeenCalledWith(HostEvent.Navigate, 'embed/viz/lb1/viz1');
         }, 1002);
     });
+    test('navigateToLiveboard should call preRender when preRenderConfig.preRenderId is set', () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            preRenderConfig: {
+                preRenderId: 'config-pre-render-id',
+            },
+        });
+        const preRenderSpy = jest
+            .spyOn(liveboardEmbed, 'preRender')
+            .mockResolvedValue(liveboardEmbed);
+        liveboardEmbed.navigateToLiveboard('lb1');
+        expect(preRenderSpy).toHaveBeenCalledTimes(1);
+        expect(preRenderSpy).toHaveBeenCalledWith(true);
+    });
+    test('navigateToLiveboard should prefer preRenderConfig.preRenderId over top-level preRenderId', () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            preRenderId: 'top-level-id',
+            preRenderConfig: {
+                preRenderId: 'config-level-id',
+            },
+        });
+        const preRenderSpy = jest
+            .spyOn(liveboardEmbed, 'preRender')
+            .mockResolvedValue(liveboardEmbed);
+        liveboardEmbed.navigateToLiveboard('lb1');
+        expect(preRenderSpy).toHaveBeenCalledTimes(1);
+        expect(preRenderSpy).toHaveBeenCalledWith(true);
+    });
     test('should set runtime parametere values in url params', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -1019,6 +1101,43 @@ describe('Liveboard/viz embed tests', () => {
             expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}&enableStarterPrompts=true#/embed/viz/${liveboardId}`);
         });
     });
+    test('should set openSpotterOnLiveboardByDefault parameter in url params', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            spotterChatConfig: { openSpotterOnLiveboardByDefault: true },
+        });
+        await liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlToHaveParamsWithValues(getIFrameSrc(), {
+                openSpotterOnLiveboardByDefault: 'true',
+            });
+        });
+    });
+    test('should set openSpotterOnLiveboardByDefault to false when explicitly disabled', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            spotterChatConfig: { openSpotterOnLiveboardByDefault: false },
+        });
+        await liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expectUrlToHaveParamsWithValues(getIFrameSrc(), {
+                openSpotterOnLiveboardByDefault: 'false',
+            });
+        });
+    });
+    test('should not set openSpotterOnLiveboardByDefault when it is not configured', async () => {
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            spotterChatConfig: { enableStarterPrompts: true },
+        });
+        await liveboardEmbed.render();
+        await executeAfterWait(() => {
+            expect(getIFrameSrc()).not.toContain('openSpotterOnLiveboardByDefault');
+        });
+    });
     test('should set spotterFileUploadFileTypes parameter in url params', async () => {
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
             ...defaultViewConfig,
@@ -1136,6 +1255,34 @@ describe('Liveboard/viz embed tests', () => {
             });
         });
     });
+    test('should include starterPrompts in APP_INIT embedParams', async () => {
+        const starterPrompts = {
+            enable: true,
+            quick: {
+                label: 'Quick',
+                questions: [
+                    { label: 'Q1', prompt: 'P1' },
+                    { label: 'Q2', prompt: 'P2' },
+                ],
+            },
+            research: { label: 'Research' },
+        };
+        const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+            ...defaultViewConfig,
+            liveboardId,
+            spotterChatConfig: { starterPrompts },
+        });
+        mockMessageChannel();
+        await liveboardEmbed.render();
+        const mockPort = { postMessage: jest.fn() };
+        await executeAfterWait(() => {
+            postMessageToParent(getIFrameEl().contentWindow, { type: EmbedEvent.APP_INIT, data: {} }, mockPort);
+        });
+        await executeAfterWait(() => {
+            expect(mockPort.postMessage.mock.calls[0][0].data.embedParams.starterPrompts)
+                .toEqual(starterPrompts);
+        });
+    });
     test('should pass brandHeadline through spotterVizConfig in APP_INIT', async () => {
         const spotterViz = { brandName: 'MyBrand', brandHeadline: "Hi, there! I'm" };
         const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
@@ -1458,6 +1605,188 @@ describe('Liveboard/viz embed tests', () => {
                 expect(iframeSrc).toContain('isFullHeightPinboard=true');
             }, 100);
         });
+        test('should default lazy loading flags to true when fullHeight is enabled', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+            });
+            expect(liveboardEmbed.viewConfig.lazyLoadingForFullHeight).toBe(true);
+            expect(liveboardEmbed.viewConfig.enableScrollableContainerLazyLoading).toBe(true);
+            expect(liveboardEmbed.viewConfig.lazyLoadingMargin).toBe('500px 0px');
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                const iframeSrc = getIFrameSrc();
+                expect(iframeSrc).toContain('isLazyLoadingForEmbedEnabled=true');
+                expect(iframeSrc).toContain('isFullHeightPinboard=true');
+                expect(iframeSrc).toContain('rootMarginForLazyLoad=500px%200px');
+            }, 100);
+        });
+        test('should not default lazy loading flags when fullHeight is not enabled', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+            });
+            expect(liveboardEmbed.viewConfig.lazyLoadingForFullHeight).toBeUndefined();
+            expect(liveboardEmbed.viewConfig.enableScrollableContainerLazyLoading).toBeUndefined();
+            expect(liveboardEmbed.viewConfig.lazyLoadingMargin).toBeUndefined();
+        });
+        test('should not write the defaults back onto the caller view config', async () => {
+            const callerViewConfig = {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+            };
+            new LiveboardEmbed(getRootEl(), callerViewConfig);
+            expect(callerViewConfig.lazyLoadingForFullHeight).toBeUndefined();
+            expect(callerViewConfig.enableScrollableContainerLazyLoading).toBeUndefined();
+            expect(callerViewConfig.lazyLoadingMargin).toBeUndefined();
+        });
+        test('should not default lazy loading flags when fullHeight is explicitly false', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: false,
+            });
+            expect(liveboardEmbed.viewConfig.lazyLoadingForFullHeight).toBeUndefined();
+            expect(liveboardEmbed.viewConfig.enableScrollableContainerLazyLoading).toBeUndefined();
+            expect(liveboardEmbed.viewConfig.lazyLoadingMargin).toBeUndefined();
+        });
+        test('should default lazyLoadingMargin when lazyLoadingForFullHeight is set explicitly', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+                lazyLoadingForFullHeight: true,
+            });
+            expect(liveboardEmbed.viewConfig.lazyLoadingMargin).toBe(DEFAULT_LAZY_LOADING_MARGIN);
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                expect(getIFrameSrc()).toContain('rootMarginForLazyLoad=500px%200px');
+            }, 100);
+        });
+        test('should let an explicit lazyLoadingMargin win over the default', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+                lazyLoadingMargin: '250px',
+            });
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                const iframeSrc = getIFrameSrc();
+                expect(iframeSrc).toContain('rootMarginForLazyLoad=250px');
+                expect(iframeSrc).not.toContain('rootMarginForLazyLoad=500px%200px');
+            }, 100);
+        });
+        test('should drop an invalid lazyLoadingMargin and log an error', async () => {
+            const loggerErrorSpy = jest.spyOn(logger, 'error').mockImplementation(() => undefined);
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+                lazyLoadingMargin: 'not-a-margin',
+            });
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                const iframeSrc = getIFrameSrc();
+                expect(iframeSrc).toContain('isLazyLoadingForEmbedEnabled=true');
+                expect(iframeSrc).not.toContain('rootMarginForLazyLoad');
+                expect(loggerErrorSpy).toHaveBeenCalledWith('Please provide a valid lazyLoadingMargin value (e.g., "10px")');
+            }, 100);
+        });
+        test('should track scrollable ancestors by default when only fullHeight is set', async () => {
+            const scrollContainer = getRootEl();
+            scrollContainer.style.overflow = 'auto';
+            const scrollContainerSpy = jest.spyOn(scrollContainer, 'addEventListener');
+            const resizeObserveSpy = jest.fn();
+            const resizeDisconnectSpy = jest.fn();
+            const originalResizeObserver = window.ResizeObserver;
+            window.ResizeObserver = jest.fn().mockImplementation(() => ({
+                observe: resizeObserveSpy,
+                disconnect: resizeDisconnectSpy,
+            }));
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+            });
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                expect(scrollContainerSpy).toHaveBeenCalledWith('scroll', expect.any(Function));
+                expect(resizeObserveSpy).toHaveBeenCalledWith(scrollContainer);
+            }, 100);
+            liveboardEmbed.destroy();
+            expect(resizeDisconnectSpy).toHaveBeenCalled();
+            scrollContainer.style.overflow = '';
+            window.ResizeObserver = originalResizeObserver;
+        });
+        test('should skip ancestor tracking when enableScrollableContainerLazyLoading is false', async () => {
+            const scrollContainer = getRootEl();
+            scrollContainer.style.overflow = 'auto';
+            const scrollContainerSpy = jest.spyOn(scrollContainer, 'addEventListener');
+            const windowSpy = jest.spyOn(window, 'addEventListener');
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+                enableScrollableContainerLazyLoading: false,
+            });
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                expect(windowSpy).toHaveBeenCalledWith('scroll', expect.anything(), true);
+                expect(scrollContainerSpy).not.toHaveBeenCalledWith('scroll', expect.any(Function));
+            }, 100);
+            liveboardEmbed.destroy();
+            scrollContainer.style.overflow = '';
+        });
+        test('should wire the window scroll listener to the coordinates sender by default', async () => {
+            const addEventListenerSpy = jest.spyOn(window, 'addEventListener');
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+            });
+            const mockTrigger = jest
+                .spyOn(liveboardEmbed, 'trigger')
+                .mockImplementation(() => Promise.resolve(undefined));
+            await liveboardEmbed.render();
+            await executeAfterWait(() => {
+                const scrollCall = addEventListenerSpy.mock.calls.find(([eventName, , capture]) => eventName === 'scroll' && capture === true);
+                expect(scrollCall).toBeDefined();
+                // Call the handler the way a real scroll event would.
+                scrollCall[1]();
+                expect(mockTrigger).toHaveBeenCalledWith(HostEvent.VisibleEmbedCoordinates, expect.objectContaining({ top: expect.any(Number) }));
+            }, 100);
+            liveboardEmbed.destroy();
+            addEventListenerSpy.mockRestore();
+        });
+        test('should remove listeners on destroy when the flags come from defaults', async () => {
+            const removeEventListenerSpy = jest.spyOn(window, 'removeEventListener');
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+            });
+            await liveboardEmbed.render();
+            liveboardEmbed.destroy();
+            expect(removeEventListenerSpy).toHaveBeenCalledWith('resize', expect.anything());
+            expect(removeEventListenerSpy).toHaveBeenCalledWith('scroll', expect.anything(), true);
+            removeEventListenerSpy.mockRestore();
+        });
+        test('should keep an explicit false for the lazy loading flags', async () => {
+            const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
+                ...defaultViewConfig,
+                liveboardId,
+                fullHeight: true,
+                lazyLoadingForFullHeight: false,
+                enableScrollableContainerLazyLoading: false,
+                lazyLoadingMargin: '0px',
+            });
+            expect(liveboardEmbed.viewConfig.lazyLoadingForFullHeight).toBe(false);
+            expect(liveboardEmbed.viewConfig.enableScrollableContainerLazyLoading).toBe(false);
+            expect(liveboardEmbed.viewConfig.lazyLoadingMargin).toBe('0px');
+        });
         test('should not set lazyLoadingForEmbed when lazyLoadingForFullHeight is enabled but fullHeight is false', async () => {
             const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
                 ...defaultViewConfig,
@@ -1522,7 +1851,7 @@ describe('Liveboard/viz embed tests', () => {
                 width: 650,
             });
         });
-        test('should send correct visible data when RequestVisibleEmbedCoordinates is triggered', async () => {
+        test('should send visible data when fullHeight is enabled and lazyLoadingForFullHeight is omitted', async () => {
             const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
                 ...defaultViewConfig,
                 liveboardId,
@@ -1533,7 +1862,7 @@ describe('Liveboard/viz embed tests', () => {
             await liveboardEmbed.render();
             // Trigger the lazy load data calculation
             liveboardEmbed.sendFullHeightLazyLoadData();
-            expect(mockTrigger).not.toHaveBeenCalledWith(HostEvent.VisibleEmbedCoordinates, {
+            expect(mockTrigger).toHaveBeenCalledWith(HostEvent.VisibleEmbedCoordinates, {
                 top: 0,
                 height: 500,
                 left: 0,
@@ -1864,5 +2193,23 @@ describe('LiveboardEmbed updatedSpotterExperience tests', () => {
             expectUrlMatchesWithParams(getIFrameSrc(), `http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}&updatedSpotterExperience=false#/embed/viz/${liveboardId}`);
         });
     });
+    describe('trigger typing contracts (compile-time)', () => {
+        it('infers typed response for no-payload calls through the LiveboardEmbed override', () => {
+            const embed = new LiveboardEmbed(getRootEl(), {
+                liveboardId: 'test-liveboard-id',
+            });
+            const getTabs = () => embed.trigger(HostEvent.GetTabs);
+            const tabsIsTyped = false;
+            const tabsHasContractFields = true;
+            const probeUnknownField = (r) => 
+            // @ts-expect-error — field not on the GetTabs contract (was silent when `any`)
+            r.tabCount;
+            void probeUnknownField;
+            const reload = () => embed.trigger(HostEvent.Reload);
+            const reloadStaysAny = true;
+            expect([tabsIsTyped, tabsHasContractFields, reloadStaysAny])
+                .toEqual([false, true, true]);
+        });
+    });
 });
 //# sourceMappingURL=liveboard.spec.js.map