@thoughtspot/visual-embed-sdk 1.6.0-alpha.2 → 1.6.0-alpha.3
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/src/embed/app.d.ts +9 -2
- package/dist/src/embed/liveboard.d.ts +19 -19
- package/dist/src/embed/liveboard.spec.d.ts +1 -0
- package/dist/src/embed/ts-embed.d.ts +2 -11
- package/dist/src/types.d.ts +18 -23
- package/dist/tsembed.es.js +48 -58
- package/dist/tsembed.js +47 -57
- package/lib/package.json +1 -1
- package/lib/src/embed/app.d.ts +9 -2
- package/lib/src/embed/app.js +18 -1
- package/lib/src/embed/app.js.map +1 -1
- package/lib/src/embed/app.spec.js +31 -0
- package/lib/src/embed/app.spec.js.map +1 -1
- package/lib/src/embed/events.spec.js +55 -2
- package/lib/src/embed/events.spec.js.map +1 -1
- package/lib/src/embed/liveboard.d.ts +19 -19
- package/lib/src/embed/liveboard.js +12 -13
- package/lib/src/embed/liveboard.js.map +1 -1
- package/lib/src/embed/liveboard.spec.d.ts +1 -0
- package/lib/src/embed/liveboard.spec.js +159 -0
- package/lib/src/embed/liveboard.spec.js.map +1 -0
- package/lib/src/embed/ts-embed.d.ts +2 -11
- package/lib/src/embed/ts-embed.js +2 -22
- package/lib/src/embed/ts-embed.js.map +1 -1
- package/lib/src/embed/ts-embed.spec.js +63 -6
- package/lib/src/embed/ts-embed.spec.js.map +1 -1
- package/lib/src/types.d.ts +18 -23
- package/lib/src/types.js +15 -21
- package/lib/src/types.js.map +1 -1
- package/lib/src/visual-embed-sdk.d.ts +41 -48
- package/package.json +1 -1
- package/src/embed/app.spec.ts +40 -0
- package/src/embed/app.ts +21 -2
- package/src/embed/events.spec.ts +60 -1
- package/src/embed/liveboard.spec.ts +199 -0
- package/src/embed/liveboard.ts +21 -24
- package/src/embed/ts-embed.spec.ts +78 -5
- package/src/embed/ts-embed.ts +3 -24
- package/src/types.ts +18 -23
package/src/embed/events.spec.ts
CHANGED
|
@@ -4,6 +4,7 @@ import {
|
|
|
4
4
|
EmbedEvent,
|
|
5
5
|
SearchEmbed,
|
|
6
6
|
PinboardEmbed,
|
|
7
|
+
LiveboardEmbed,
|
|
7
8
|
HostEvent,
|
|
8
9
|
} from '../index';
|
|
9
10
|
import {
|
|
@@ -120,7 +121,13 @@ describe('test communication between host app and ThoughtSpot', () => {
|
|
|
120
121
|
...defaultViewConfig,
|
|
121
122
|
pinboardId: 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0',
|
|
122
123
|
} as LiveboardViewConfig);
|
|
124
|
+
const spyThree = jest.fn();
|
|
125
|
+
const embedThree = new LiveboardEmbed(getRootEl2(), {
|
|
126
|
+
...defaultViewConfig,
|
|
127
|
+
liveboardId: 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0',
|
|
128
|
+
} as LiveboardViewConfig);
|
|
123
129
|
embedTwo.on(EmbedEvent.CustomAction, spyTwo).render();
|
|
130
|
+
embedThree.on(EmbedEvent.CustomAction, spyThree).render();
|
|
124
131
|
|
|
125
132
|
await executeAfterWait(() => {
|
|
126
133
|
const iframeOne = getIFrameEl();
|
|
@@ -133,10 +140,29 @@ describe('test communication between host app and ThoughtSpot', () => {
|
|
|
133
140
|
await executeAfterWait(() => {
|
|
134
141
|
expect(spyOne).toHaveBeenCalled();
|
|
135
142
|
expect(spyTwo).not.toHaveBeenCalled();
|
|
143
|
+
expect(spyThree).not.toHaveBeenCalled();
|
|
136
144
|
}, EVENT_WAIT_TIME);
|
|
137
145
|
});
|
|
138
146
|
|
|
139
147
|
test('send getIframeCenter Event without eventPort', async () => {
|
|
148
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
149
|
+
...defaultViewConfig,
|
|
150
|
+
fullHeight: true,
|
|
151
|
+
pinboardId: 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0',
|
|
152
|
+
} as LiveboardViewConfig);
|
|
153
|
+
liveboardEmbed.render();
|
|
154
|
+
const spy1 = jest.spyOn(global.console, 'log');
|
|
155
|
+
|
|
156
|
+
await executeAfterWait(() => {
|
|
157
|
+
const iframe = getIFrameEl();
|
|
158
|
+
postMessageToParent(iframe.contentWindow, {
|
|
159
|
+
type: EmbedEvent.EmbedIframeCenter,
|
|
160
|
+
data: PAYLOAD,
|
|
161
|
+
});
|
|
162
|
+
});
|
|
163
|
+
expect(spy1).toHaveBeenCalledWith('Event Port is not defined');
|
|
164
|
+
});
|
|
165
|
+
test('send getIframeCenter Event without eventPort - pinboard', async () => {
|
|
140
166
|
const pinboardEmbed = new PinboardEmbed(getRootEl(), {
|
|
141
167
|
...defaultViewConfig,
|
|
142
168
|
fullHeight: true,
|
|
@@ -155,7 +181,7 @@ describe('test communication between host app and ThoughtSpot', () => {
|
|
|
155
181
|
expect(spy1).toHaveBeenCalledWith('Event Port is not defined');
|
|
156
182
|
});
|
|
157
183
|
|
|
158
|
-
test('send getIframeCenter Event with eventPort', async () => {
|
|
184
|
+
test('send getIframeCenter Event with eventPort - pinboard', async () => {
|
|
159
185
|
const pinboardEmbed = new PinboardEmbed(getRootEl(), {
|
|
160
186
|
...defaultViewConfig,
|
|
161
187
|
fullHeight: true,
|
|
@@ -188,4 +214,37 @@ describe('test communication between host app and ThoughtSpot', () => {
|
|
|
188
214
|
};
|
|
189
215
|
expect(mockPort.postMessage).toHaveBeenCalledWith(heightObj);
|
|
190
216
|
});
|
|
217
|
+
test('send getIframeCenter Event with eventPort', async () => {
|
|
218
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
219
|
+
...defaultViewConfig,
|
|
220
|
+
fullHeight: true,
|
|
221
|
+
pinboardId: 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0',
|
|
222
|
+
} as LiveboardViewConfig);
|
|
223
|
+
liveboardEmbed.render();
|
|
224
|
+
const mockPort: any = {
|
|
225
|
+
postMessage: jest.fn(),
|
|
226
|
+
};
|
|
227
|
+
await executeAfterWait(() => {
|
|
228
|
+
const iframe = getIFrameEl();
|
|
229
|
+
postMessageToParent(
|
|
230
|
+
iframe.contentWindow,
|
|
231
|
+
{
|
|
232
|
+
type: EmbedEvent.EmbedIframeCenter,
|
|
233
|
+
data: PAYLOAD,
|
|
234
|
+
},
|
|
235
|
+
mockPort,
|
|
236
|
+
);
|
|
237
|
+
});
|
|
238
|
+
const heightObj = {
|
|
239
|
+
data: {
|
|
240
|
+
iframeCenter: 0,
|
|
241
|
+
iframeHeight: 0,
|
|
242
|
+
iframeScrolled: 0,
|
|
243
|
+
iframeVisibleViewPort: 0,
|
|
244
|
+
viewPortHeight: 768,
|
|
245
|
+
},
|
|
246
|
+
type: EmbedEvent.EmbedIframeCenter,
|
|
247
|
+
};
|
|
248
|
+
expect(mockPort.postMessage).toHaveBeenCalledWith(heightObj);
|
|
249
|
+
});
|
|
191
250
|
});
|
|
@@ -0,0 +1,199 @@
|
|
|
1
|
+
import { LiveboardEmbed, LiveboardViewConfig } from './liveboard';
|
|
2
|
+
import { init } from '../index';
|
|
3
|
+
import { Action, AuthType, EmbedEvent, RuntimeFilterOp } from '../types';
|
|
4
|
+
import {
|
|
5
|
+
executeAfterWait,
|
|
6
|
+
getDocumentBody,
|
|
7
|
+
getIFrameSrc,
|
|
8
|
+
getRootEl,
|
|
9
|
+
} from '../test/test-utils';
|
|
10
|
+
import { version } from '../../package.json';
|
|
11
|
+
|
|
12
|
+
const defaultViewConfig = {
|
|
13
|
+
frameParams: {
|
|
14
|
+
width: 1280,
|
|
15
|
+
height: 720,
|
|
16
|
+
},
|
|
17
|
+
};
|
|
18
|
+
const liveboardId = 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0';
|
|
19
|
+
const vizId = '6e73f724-660e-11eb-ae93-0242ac130002';
|
|
20
|
+
const thoughtSpotHost = 'tshost';
|
|
21
|
+
const defaultParams = `&hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}`;
|
|
22
|
+
const prefixParams = '&isLiveboardEmbed=true';
|
|
23
|
+
|
|
24
|
+
beforeAll(() => {
|
|
25
|
+
init({
|
|
26
|
+
thoughtSpotHost,
|
|
27
|
+
authType: AuthType.None,
|
|
28
|
+
});
|
|
29
|
+
});
|
|
30
|
+
|
|
31
|
+
describe('Liveboard/viz embed tests', () => {
|
|
32
|
+
beforeEach(() => {
|
|
33
|
+
document.body.innerHTML = getDocumentBody();
|
|
34
|
+
});
|
|
35
|
+
|
|
36
|
+
test('should render liveboard', async () => {
|
|
37
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
38
|
+
...defaultViewConfig,
|
|
39
|
+
liveboardId,
|
|
40
|
+
} as LiveboardViewConfig);
|
|
41
|
+
liveboardEmbed.render();
|
|
42
|
+
await executeAfterWait(() => {
|
|
43
|
+
expect(getIFrameSrc()).toBe(
|
|
44
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}#/embed/viz/${liveboardId}`,
|
|
45
|
+
);
|
|
46
|
+
});
|
|
47
|
+
});
|
|
48
|
+
|
|
49
|
+
test('should set disabled actions', async () => {
|
|
50
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
51
|
+
disabledActions: [
|
|
52
|
+
Action.DownloadAsCsv,
|
|
53
|
+
Action.DownloadAsPdf,
|
|
54
|
+
Action.DownloadAsXlsx,
|
|
55
|
+
],
|
|
56
|
+
disabledActionReason: 'Action denied',
|
|
57
|
+
...defaultViewConfig,
|
|
58
|
+
liveboardId,
|
|
59
|
+
} as LiveboardViewConfig);
|
|
60
|
+
liveboardEmbed.render();
|
|
61
|
+
await executeAfterWait(() => {
|
|
62
|
+
expect(getIFrameSrc()).toBe(
|
|
63
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}&disableAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]&disableHint=Action%20denied${prefixParams}#/embed/viz/${liveboardId}`,
|
|
64
|
+
);
|
|
65
|
+
});
|
|
66
|
+
});
|
|
67
|
+
|
|
68
|
+
test('should set hidden actions', async () => {
|
|
69
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
70
|
+
hiddenActions: [
|
|
71
|
+
Action.DownloadAsCsv,
|
|
72
|
+
Action.DownloadAsPdf,
|
|
73
|
+
Action.DownloadAsXlsx,
|
|
74
|
+
],
|
|
75
|
+
...defaultViewConfig,
|
|
76
|
+
liveboardId,
|
|
77
|
+
} as LiveboardViewConfig);
|
|
78
|
+
liveboardEmbed.render();
|
|
79
|
+
await executeAfterWait(() => {
|
|
80
|
+
expect(getIFrameSrc()).toBe(
|
|
81
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}&hideAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]${prefixParams}#/embed/viz/${liveboardId}`,
|
|
82
|
+
);
|
|
83
|
+
});
|
|
84
|
+
});
|
|
85
|
+
|
|
86
|
+
test('should set visible actions', async () => {
|
|
87
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
88
|
+
visibleActions: [
|
|
89
|
+
Action.DownloadAsCsv,
|
|
90
|
+
Action.DownloadAsPdf,
|
|
91
|
+
Action.DownloadAsXlsx,
|
|
92
|
+
],
|
|
93
|
+
...defaultViewConfig,
|
|
94
|
+
liveboardId,
|
|
95
|
+
} as LiveboardViewConfig);
|
|
96
|
+
liveboardEmbed.render();
|
|
97
|
+
await executeAfterWait(() => {
|
|
98
|
+
expect(getIFrameSrc()).toBe(
|
|
99
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}&visibleAction=[%22${Action.DownloadAsCsv}%22,%22${Action.DownloadAsPdf}%22,%22${Action.DownloadAsXlsx}%22]${prefixParams}#/embed/viz/${liveboardId}`,
|
|
100
|
+
);
|
|
101
|
+
});
|
|
102
|
+
});
|
|
103
|
+
|
|
104
|
+
test('should set visible actions as empty array', async () => {
|
|
105
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
106
|
+
visibleActions: [],
|
|
107
|
+
...defaultViewConfig,
|
|
108
|
+
liveboardId,
|
|
109
|
+
} as LiveboardViewConfig);
|
|
110
|
+
liveboardEmbed.render();
|
|
111
|
+
await executeAfterWait(() => {
|
|
112
|
+
expect(getIFrameSrc()).toBe(
|
|
113
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}&visibleAction=[]${prefixParams}#/embed/viz/${liveboardId}`,
|
|
114
|
+
);
|
|
115
|
+
});
|
|
116
|
+
});
|
|
117
|
+
|
|
118
|
+
test('should enable viz transformations true', async () => {
|
|
119
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
120
|
+
enableVizTransformations: true,
|
|
121
|
+
...defaultViewConfig,
|
|
122
|
+
liveboardId,
|
|
123
|
+
} as LiveboardViewConfig);
|
|
124
|
+
liveboardEmbed.render();
|
|
125
|
+
await executeAfterWait(() => {
|
|
126
|
+
expect(getIFrameSrc()).toBe(
|
|
127
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableVizTransform=true${prefixParams}#/embed/viz/${liveboardId}`,
|
|
128
|
+
);
|
|
129
|
+
});
|
|
130
|
+
});
|
|
131
|
+
|
|
132
|
+
test('should disable viz transformations when enableVizTransformations false', async () => {
|
|
133
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
134
|
+
enableVizTransformations: false,
|
|
135
|
+
...defaultViewConfig,
|
|
136
|
+
liveboardId,
|
|
137
|
+
} as LiveboardViewConfig);
|
|
138
|
+
liveboardEmbed.render();
|
|
139
|
+
await executeAfterWait(() => {
|
|
140
|
+
expect(getIFrameSrc()).toBe(
|
|
141
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}&enableVizTransform=false${prefixParams}#/embed/viz/${liveboardId}`,
|
|
142
|
+
);
|
|
143
|
+
});
|
|
144
|
+
});
|
|
145
|
+
|
|
146
|
+
test('should render viz', async () => {
|
|
147
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
148
|
+
...defaultViewConfig,
|
|
149
|
+
liveboardId,
|
|
150
|
+
vizId,
|
|
151
|
+
} as LiveboardViewConfig);
|
|
152
|
+
liveboardEmbed.render();
|
|
153
|
+
await executeAfterWait(() => {
|
|
154
|
+
expect(getIFrameSrc()).toBe(
|
|
155
|
+
`http://${thoughtSpotHost}/?embedApp=true${defaultParams}${prefixParams}#/embed/viz/${liveboardId}/${vizId}`,
|
|
156
|
+
);
|
|
157
|
+
});
|
|
158
|
+
});
|
|
159
|
+
|
|
160
|
+
test('should apply runtime filters', async () => {
|
|
161
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
162
|
+
...defaultViewConfig,
|
|
163
|
+
liveboardId,
|
|
164
|
+
vizId,
|
|
165
|
+
runtimeFilters: [
|
|
166
|
+
{
|
|
167
|
+
columnName: 'sales',
|
|
168
|
+
operator: RuntimeFilterOp.EQ,
|
|
169
|
+
values: [1000],
|
|
170
|
+
},
|
|
171
|
+
],
|
|
172
|
+
} as LiveboardViewConfig);
|
|
173
|
+
liveboardEmbed.render();
|
|
174
|
+
await executeAfterWait(() => {
|
|
175
|
+
expect(getIFrameSrc()).toBe(
|
|
176
|
+
`http://${thoughtSpotHost}/?embedApp=true&col1=sales&op1=EQ&val1=1000${defaultParams}${prefixParams}#/embed/viz/${liveboardId}/${vizId}`,
|
|
177
|
+
);
|
|
178
|
+
});
|
|
179
|
+
});
|
|
180
|
+
|
|
181
|
+
test('should register event handler to adjust iframe height', async () => {
|
|
182
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
183
|
+
...defaultViewConfig,
|
|
184
|
+
fullHeight: true,
|
|
185
|
+
liveboardId,
|
|
186
|
+
vizId,
|
|
187
|
+
} as LiveboardViewConfig);
|
|
188
|
+
|
|
189
|
+
const onSpy = jest.spyOn(liveboardEmbed, 'on');
|
|
190
|
+
liveboardEmbed.render();
|
|
191
|
+
|
|
192
|
+
executeAfterWait(() => {
|
|
193
|
+
expect(onSpy).toHaveBeenCalledWith(
|
|
194
|
+
EmbedEvent.EmbedHeight,
|
|
195
|
+
expect.anything(),
|
|
196
|
+
);
|
|
197
|
+
});
|
|
198
|
+
});
|
|
199
|
+
});
|
package/src/embed/liveboard.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
/**
|
|
2
2
|
* Copyright (c) 2021
|
|
3
3
|
*
|
|
4
|
-
* Embed a ThoughtSpot
|
|
4
|
+
* Embed a ThoughtSpot Liveboard or visualization
|
|
5
5
|
* https://developers.thoughtspot.com/docs/?pageid=embed-pinboard
|
|
6
6
|
* https://developers.thoughtspot.com/docs/?pageid=embed-a-viz
|
|
7
7
|
*
|
|
@@ -22,21 +22,21 @@ import { getFilterQuery, getQueryParamString } from '../utils';
|
|
|
22
22
|
import { V1Embed, ViewConfig } from './ts-embed';
|
|
23
23
|
|
|
24
24
|
/**
|
|
25
|
-
* The configuration for the embedded
|
|
25
|
+
* The configuration for the embedded Liveboard or visualization page view.
|
|
26
26
|
* @Category Liveboards and Charts
|
|
27
27
|
*/
|
|
28
28
|
export interface LiveboardViewConfig extends ViewConfig {
|
|
29
29
|
/**
|
|
30
30
|
* If set to true, the embedded object container dynamically resizes
|
|
31
|
-
* according to the height of the
|
|
31
|
+
* according to the height of the Liveboard.
|
|
32
32
|
*/
|
|
33
33
|
fullHeight?: boolean;
|
|
34
34
|
/**
|
|
35
|
-
* This is the minimum height(in pixels) for a full height
|
|
36
|
-
* Setting this height helps resolves issues with empty
|
|
37
|
-
* other screens navigable from a
|
|
35
|
+
* This is the minimum height(in pixels) for a full height Liveboard.
|
|
36
|
+
* Setting this height helps resolves issues with empty Liveboards and
|
|
37
|
+
* other screens navigable from a Liveboard.
|
|
38
|
+
* *_since 1.5.0_
|
|
38
39
|
* @default 500
|
|
39
|
-
* * _since 1.5.0_
|
|
40
40
|
*/
|
|
41
41
|
defaultHeight?: number;
|
|
42
42
|
/**
|
|
@@ -44,7 +44,7 @@ export interface LiveboardViewConfig extends ViewConfig {
|
|
|
44
44
|
*/
|
|
45
45
|
enableVizTransformations?: boolean;
|
|
46
46
|
/**
|
|
47
|
-
* The
|
|
47
|
+
* The Liveboard to display in the embedded view.
|
|
48
48
|
* Use either of liveboardId or pinboardId to reference the Liveboard to embed.
|
|
49
49
|
*/
|
|
50
50
|
liveboardId?: string;
|
|
@@ -54,12 +54,12 @@ export interface LiveboardViewConfig extends ViewConfig {
|
|
|
54
54
|
*/
|
|
55
55
|
pinboardId?: string;
|
|
56
56
|
/**
|
|
57
|
-
* The visualization within the
|
|
57
|
+
* The visualization within the Liveboard to display.
|
|
58
58
|
*/
|
|
59
59
|
vizId?: string;
|
|
60
60
|
/**
|
|
61
61
|
* If set to true, all filter chips from a
|
|
62
|
-
*
|
|
62
|
+
* Liveboard page will be read-only (no X buttons)
|
|
63
63
|
*/
|
|
64
64
|
preventLiveboardFilterRemoval?: boolean;
|
|
65
65
|
/**
|
|
@@ -70,7 +70,7 @@ export interface LiveboardViewConfig extends ViewConfig {
|
|
|
70
70
|
}
|
|
71
71
|
|
|
72
72
|
/**
|
|
73
|
-
* Embed a ThoughtSpot
|
|
73
|
+
* Embed a ThoughtSpot Liveboard or visualization
|
|
74
74
|
* @Category Liveboards and Charts
|
|
75
75
|
*/
|
|
76
76
|
export class LiveboardEmbed extends V1Embed {
|
|
@@ -85,7 +85,7 @@ export class LiveboardEmbed extends V1Embed {
|
|
|
85
85
|
|
|
86
86
|
/**
|
|
87
87
|
* Construct a map of params to be passed on to the
|
|
88
|
-
* embedded
|
|
88
|
+
* embedded Liveboard or visualization.
|
|
89
89
|
*/
|
|
90
90
|
private getEmbedParams() {
|
|
91
91
|
const params = this.getBaseQueryParams();
|
|
@@ -120,12 +120,12 @@ export class LiveboardEmbed extends V1Embed {
|
|
|
120
120
|
}
|
|
121
121
|
|
|
122
122
|
/**
|
|
123
|
-
* Construct the URL of the embedded ThoughtSpot
|
|
123
|
+
* Construct the URL of the embedded ThoughtSpot Liveboard or visualization
|
|
124
124
|
* to be loaded within the iframe.
|
|
125
|
-
* @param liveboardId The GUID of the
|
|
126
|
-
* @param vizId The optional GUID of a visualization within the
|
|
125
|
+
* @param liveboardId The GUID of the Liveboard.
|
|
126
|
+
* @param vizId The optional GUID of a visualization within the Liveboard.
|
|
127
127
|
* @param runtimeFilters A list of runtime filters to be applied to
|
|
128
|
-
* the
|
|
128
|
+
* the Liveboard or visualization on load.
|
|
129
129
|
*/
|
|
130
130
|
private getIFrameSrc(
|
|
131
131
|
liveboardId: string,
|
|
@@ -164,18 +164,15 @@ export class LiveboardEmbed extends V1Embed {
|
|
|
164
164
|
responder({ type: EmbedEvent.EmbedIframeCenter, data: obj });
|
|
165
165
|
};
|
|
166
166
|
|
|
167
|
-
private
|
|
168
|
-
if (
|
|
169
|
-
data.data.canvasState !== 'EMBED' &&
|
|
170
|
-
data.data.canvasState !== 'pinboard'
|
|
171
|
-
) {
|
|
167
|
+
private setIframeHeightForNonEmbedLiveboard = (data: MessagePayload) => {
|
|
168
|
+
if (!data.data.currentPath.startsWith('/embed/viz/')) {
|
|
172
169
|
this.setIFrameHeight(this.defaultHeight);
|
|
173
170
|
}
|
|
174
171
|
};
|
|
175
172
|
|
|
176
173
|
/**
|
|
177
|
-
* Render an embedded ThoughtSpot
|
|
178
|
-
* @param renderOptions An object specifying the
|
|
174
|
+
* Render an embedded ThoughtSpot Liveboard or visualization
|
|
175
|
+
* @param renderOptions An object specifying the Liveboard ID,
|
|
179
176
|
* visualization ID and the runtime filters.
|
|
180
177
|
*/
|
|
181
178
|
public render(): LiveboardEmbed {
|
|
@@ -190,7 +187,7 @@ export class LiveboardEmbed extends V1Embed {
|
|
|
190
187
|
if (this.viewConfig.fullHeight === true) {
|
|
191
188
|
this.on(
|
|
192
189
|
EmbedEvent.RouteChange,
|
|
193
|
-
this.
|
|
190
|
+
this.setIframeHeightForNonEmbedLiveboard,
|
|
194
191
|
);
|
|
195
192
|
this.on(EmbedEvent.EmbedHeight, this.updateIFrameHeight);
|
|
196
193
|
this.on(EmbedEvent.EmbedIframeCenter, this.embedIframeCenter);
|
|
@@ -7,6 +7,7 @@ import {
|
|
|
7
7
|
PinboardEmbed,
|
|
8
8
|
LiveboardViewConfig,
|
|
9
9
|
AppEmbed,
|
|
10
|
+
LiveboardEmbed,
|
|
10
11
|
} from '../index';
|
|
11
12
|
import { Action } from '../types';
|
|
12
13
|
import { getDocumentBody, getIFrameSrc, getRootEl } from '../test/test-utils';
|
|
@@ -24,6 +25,7 @@ const defaultViewConfig = {
|
|
|
24
25
|
},
|
|
25
26
|
};
|
|
26
27
|
const pinboardId = 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0';
|
|
28
|
+
const liveboardId = 'eca215d4-0d2c-4a55-90e3-d81ef6848ae0';
|
|
27
29
|
const thoughtSpotHost = 'tshost';
|
|
28
30
|
const defaultParamsForPinboardEmbed = `hostAppUrl=local-host&viewPortHeight=768&viewPortWidth=1024&sdkVersion=${version}`;
|
|
29
31
|
|
|
@@ -119,7 +121,7 @@ describe('Unit test case for ts embed', () => {
|
|
|
119
121
|
});
|
|
120
122
|
|
|
121
123
|
describe('when visible actions are set', () => {
|
|
122
|
-
test('should throw error when there are both visible and hidden actions', async () => {
|
|
124
|
+
test('should throw error when there are both visible and hidden actions - pinboard', async () => {
|
|
123
125
|
spyOn(console, 'log');
|
|
124
126
|
const pinboardEmbed = new PinboardEmbed(getRootEl(), {
|
|
125
127
|
hiddenActions: [Action.DownloadAsCsv],
|
|
@@ -133,7 +135,7 @@ describe('Unit test case for ts embed', () => {
|
|
|
133
135
|
'You cannot have both hidden actions and visible actions',
|
|
134
136
|
);
|
|
135
137
|
});
|
|
136
|
-
test('should not throw error when there are only visible or hidden actions', async () => {
|
|
138
|
+
test('should not throw error when there are only visible or hidden actions - pinboard', async () => {
|
|
137
139
|
const pinboardEmbed = new PinboardEmbed(getRootEl(), {
|
|
138
140
|
hiddenActions: [Action.DownloadAsCsv],
|
|
139
141
|
...defaultViewConfig,
|
|
@@ -142,6 +144,55 @@ describe('Unit test case for ts embed', () => {
|
|
|
142
144
|
pinboardEmbed.render();
|
|
143
145
|
expect(pinboardEmbed['isError']).toBe(false);
|
|
144
146
|
});
|
|
147
|
+
|
|
148
|
+
async function testActionsForLiveboards(
|
|
149
|
+
hiddenActions: Array<Action>,
|
|
150
|
+
visibleActions: Array<Action>,
|
|
151
|
+
) {
|
|
152
|
+
spyOn(console, 'log');
|
|
153
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
154
|
+
hiddenActions,
|
|
155
|
+
visibleActions,
|
|
156
|
+
...defaultViewConfig,
|
|
157
|
+
liveboardId,
|
|
158
|
+
} as LiveboardViewConfig);
|
|
159
|
+
await liveboardEmbed.render();
|
|
160
|
+
expect(liveboardEmbed['isError']).toBe(true);
|
|
161
|
+
expect(console.log).toHaveBeenCalledWith(
|
|
162
|
+
'You cannot have both hidden actions and visible actions',
|
|
163
|
+
);
|
|
164
|
+
}
|
|
165
|
+
test('should throw error when there are both visible and hidden action arrays', async () => {
|
|
166
|
+
await testActionsForLiveboards(
|
|
167
|
+
[Action.DownloadAsCsv],
|
|
168
|
+
[Action.DownloadAsCsv],
|
|
169
|
+
);
|
|
170
|
+
});
|
|
171
|
+
test('should throw error when there are both visible and hidden actions arrays as empty', async () => {
|
|
172
|
+
await testActionsForLiveboards([], []);
|
|
173
|
+
});
|
|
174
|
+
test('should throw error when there are both visible and hidden actions - one of them is an empty array', async () => {
|
|
175
|
+
await testActionsForLiveboards([], [Action.DownloadAsCsv]);
|
|
176
|
+
});
|
|
177
|
+
|
|
178
|
+
test('should not throw error when there are only visible or hidden actions', async () => {
|
|
179
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
180
|
+
hiddenActions: [Action.DownloadAsCsv],
|
|
181
|
+
...defaultViewConfig,
|
|
182
|
+
liveboardId,
|
|
183
|
+
} as LiveboardViewConfig);
|
|
184
|
+
liveboardEmbed.render();
|
|
185
|
+
expect(liveboardEmbed['isError']).toBe(false);
|
|
186
|
+
});
|
|
187
|
+
test('should not throw error when there are only visible or hidden actions', async () => {
|
|
188
|
+
const liveboardEmbed = new LiveboardEmbed(getRootEl(), {
|
|
189
|
+
visibleActions: [Action.DownloadAsCsv],
|
|
190
|
+
...defaultViewConfig,
|
|
191
|
+
liveboardId,
|
|
192
|
+
} as LiveboardViewConfig);
|
|
193
|
+
liveboardEmbed.render();
|
|
194
|
+
expect(liveboardEmbed['isError']).toBe(false);
|
|
195
|
+
});
|
|
145
196
|
});
|
|
146
197
|
|
|
147
198
|
describe('when thoughtSpotHost is empty', () => {
|
|
@@ -180,7 +231,7 @@ describe('Unit test case for ts embed', () => {
|
|
|
180
231
|
});
|
|
181
232
|
|
|
182
233
|
describe('Naviage to Page API', () => {
|
|
183
|
-
const path = '
|
|
234
|
+
const path = 'viz/e0836cad-4fdf-42d4-bd97-567a6b2a6058';
|
|
184
235
|
beforeEach(() => {
|
|
185
236
|
jest.spyOn(config, 'getThoughtSpotHost').mockImplementation(
|
|
186
237
|
() => 'http://tshost',
|
|
@@ -189,10 +240,10 @@ describe('Unit test case for ts embed', () => {
|
|
|
189
240
|
|
|
190
241
|
test('when app is PinboardEmbed after navigateToPage function call, new path should be set to iframe', async () => {
|
|
191
242
|
const pinboardEmbed = new PinboardEmbed(getRootEl(), {
|
|
192
|
-
pinboardId: '
|
|
243
|
+
pinboardId: 'e0836cad-4fdf-42d4-bd97-567a6b2a6058',
|
|
193
244
|
});
|
|
194
245
|
await pinboardEmbed.render();
|
|
195
|
-
pinboardEmbed.navigateToPage(path);
|
|
246
|
+
// pinboardEmbed.navigateToPage(path);
|
|
196
247
|
expect(getIFrameSrc()).toBe(
|
|
197
248
|
`http://${thoughtSpotHost}/?embedApp=true&${defaultParamsForPinboardEmbed}&isLiveboardEmbed=true#/embed/${path}`,
|
|
198
249
|
);
|
|
@@ -227,4 +278,26 @@ describe('Unit test case for ts embed', () => {
|
|
|
227
278
|
);
|
|
228
279
|
});
|
|
229
280
|
});
|
|
281
|
+
describe('Naviage to Page API - Pinboard', () => {
|
|
282
|
+
const path = 'pinboard/e0836cad-4fdf-42d4-bd97-567a6b2a6058';
|
|
283
|
+
beforeEach(() => {
|
|
284
|
+
jest.spyOn(config, 'getThoughtSpotHost').mockImplementation(
|
|
285
|
+
() => 'http://tshost',
|
|
286
|
+
);
|
|
287
|
+
});
|
|
288
|
+
|
|
289
|
+
test('when app is AppEmbed after navigateToPage function call, new path should be set to iframe', async () => {
|
|
290
|
+
const appEmbed = new AppEmbed(getRootEl(), {
|
|
291
|
+
frameParams: {
|
|
292
|
+
width: '100%',
|
|
293
|
+
height: '100%',
|
|
294
|
+
},
|
|
295
|
+
});
|
|
296
|
+
await appEmbed.render();
|
|
297
|
+
appEmbed.navigateToPage(path);
|
|
298
|
+
expect(getIFrameSrc()).toBe(
|
|
299
|
+
`http://${thoughtSpotHost}/?embedApp=true&primaryNavHidden=true&profileAndHelpInNavBarHidden=false&${defaultParamsForPinboardEmbed}#/${path}`,
|
|
300
|
+
);
|
|
301
|
+
});
|
|
302
|
+
});
|
|
230
303
|
});
|
package/src/embed/ts-embed.ts
CHANGED
|
@@ -105,7 +105,7 @@ export interface ViewConfig {
|
|
|
105
105
|
visibleActions?: Action[];
|
|
106
106
|
/**
|
|
107
107
|
* The list of runtime filters to apply to a search answer,
|
|
108
|
-
* visualization, or
|
|
108
|
+
* visualization, or Liveboard.
|
|
109
109
|
*/
|
|
110
110
|
runtimeFilters?: RuntimeFilter[];
|
|
111
111
|
}
|
|
@@ -327,7 +327,7 @@ export class TsEmbed {
|
|
|
327
327
|
visibleActions,
|
|
328
328
|
} = this.viewConfig;
|
|
329
329
|
|
|
330
|
-
if (visibleActions
|
|
330
|
+
if (Array.isArray(visibleActions) && Array.isArray(hiddenActions)) {
|
|
331
331
|
this.handleError(
|
|
332
332
|
'You cannot have both hidden actions and visible actions',
|
|
333
333
|
);
|
|
@@ -351,7 +351,7 @@ export class TsEmbed {
|
|
|
351
351
|
|
|
352
352
|
/**
|
|
353
353
|
* Constructs the base URL string to load v1 of the ThoughtSpot app.
|
|
354
|
-
* This is used for embedding
|
|
354
|
+
* This is used for embedding Liveboards, visualizations, and full application.
|
|
355
355
|
* @param queryString The query string to append to the URL.
|
|
356
356
|
* @param isAppEmbed A Boolean parameter to specify if you are embedding
|
|
357
357
|
* the full application.
|
|
@@ -587,27 +587,6 @@ export class TsEmbed {
|
|
|
587
587
|
return this;
|
|
588
588
|
}
|
|
589
589
|
|
|
590
|
-
/**
|
|
591
|
-
* Navigates users to the specified application page.
|
|
592
|
-
* Use this method to navigate users from the embedded
|
|
593
|
-
* ThoughtSpot context to a specific page in your app.
|
|
594
|
-
* @param path The page path string.
|
|
595
|
-
* For example, to navigate users to a liveboard page,
|
|
596
|
-
* define the method as navigateToPage('liveboard/<liveboardId>').
|
|
597
|
-
*/
|
|
598
|
-
public navigateToPage(path: string): void {
|
|
599
|
-
const iframeSrc = this.iFrame?.src;
|
|
600
|
-
if (iframeSrc) {
|
|
601
|
-
const embedPath = '#/embed';
|
|
602
|
-
const currentPath = iframeSrc.includes(embedPath) ? embedPath : '#';
|
|
603
|
-
this.iFrame.src = `${
|
|
604
|
-
iframeSrc.split(currentPath)[0]
|
|
605
|
-
}${currentPath}/${path.replace(/^\/?#?\//, '')}`;
|
|
606
|
-
} else {
|
|
607
|
-
console.log('Please call render before invoking this method');
|
|
608
|
-
}
|
|
609
|
-
}
|
|
610
|
-
|
|
611
590
|
/**
|
|
612
591
|
* Triggers an event on specific Port registered against
|
|
613
592
|
* for the EmbedEvent
|