@corvina/corvina-app-connect
Version:
This library enables an application embedded as an iframe in Corvina to retrieve some information such as JWT, organization id, ...
243 lines • 11.7 kB
JavaScript
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
import { CorvinaConnect, CorvinaConnectEventType } from './CorvinaConnect';
import { CorvinaHost } from './CorvinaHost';
import { MessageType } from './common';
describe('CorvinaHost', () => {
let corvinaHost;
const iframeUrl = 'http://iframe';
const jwtApp = new Map();
jwtApp.set(iframeUrl, {
jwt: 'test-jwt',
iframeOrigin: iframeUrl,
});
const username = 'test-user';
const organizationId = 'test-org-id';
const organizationResourceId = 'test-org-resource-id';
const corvinaDomain = 'localhost';
const corvinaHostUrl = "http://" + corvinaDomain;
const defaultStandardTime = new Date();
const brandName = 'TestBrand';
const patchWindowObjects = ({ mainWindow, iframeWindow }) => {
const jsdomPostMessage = iframeWindow.postMessage;
iframeWindow.postMessage = (message, options) => {
if (options && options.targetOrigin) {
jsdomPostMessage.call(iframeWindow, Object.assign({}, message), '*');
}
else {
jsdomPostMessage.call(iframeWindow, message);
}
};
const postMessageFromIframeHandler = {
get: function (target, prop, receiver) {
if (prop === 'postMessage') {
return (...args) => {
target.dispatchEvent(new MessageEvent('message', {
data: Object.assign({}, args[0]),
source: iframeWindow,
origin: iframeUrl,
}), args[1]);
};
}
return Reflect.get(target, prop, receiver);
},
};
return {
mainWindowFromIFrame: new Proxy(mainWindow, postMessageFromIframeHandler),
iframeWindow,
};
};
beforeEach(() => __awaiter(void 0, void 0, void 0, function* () {
corvinaHost = yield CorvinaHost.create({
jwtApp,
username,
organizationId,
organizationResourceId,
corvinaHost: corvinaHostUrl,
corvinaDomain,
defaultStandardTime,
brandName,
});
}));
afterEach(() => {
corvinaHost.dispose();
});
it('should initialize CorvinaHost and handle CORVINA_CONNECT_INIT message', () => {
const iframe = document.createElement('iframe');
iframe.id = 'corvina-app-connect-test';
document.body.appendChild(iframe);
const message = {
type: MessageType.CORVINA_CONNECT_INIT,
payload: {},
};
const event = new MessageEvent('message', {
data: message,
origin: corvinaHostUrl,
source: iframe.contentWindow,
});
patchWindowObjects({ mainWindow: window, iframeWindow: iframe.contentWindow });
const postMessageMocked = jest.spyOn(iframe.contentWindow, 'postMessage');
window.dispatchEvent(event);
expect(postMessageMocked).toHaveBeenCalledTimes(1);
document.body.removeChild(iframe);
});
it('should handle IFRAME_HREF_CHANGED message', () => {
const iframe = document.createElement('iframe');
iframe.id = 'corvina-app-connect-test';
document.body.appendChild(iframe);
const newHref = 'http://localhost/new-path';
const message = {
type: MessageType.IFRAME_HREF_CHANGED,
payload: {
href: newHref,
},
};
const event = new MessageEvent('message', {
data: message,
origin: corvinaHostUrl,
source: iframe.contentWindow,
});
window.dispatchEvent(event);
expect(corvinaHost['_appHref']).toBe(newHref);
document.body.removeChild(iframe);
});
it('host synchronization', () => __awaiter(void 0, void 0, void 0, function* () {
const iframe = document.createElement('iframe');
iframe.src = iframeUrl + '/#/new-path-1';
iframe.id = 'corvina-app-connect-test';
document.body.appendChild(iframe);
const { iframeWindow, mainWindowFromIFrame } = patchWindowObjects({ mainWindow: window, iframeWindow: iframe.contentWindow });
const connect = yield CorvinaConnect.create({
corvinaHost: 'http://localhost',
currentWindow: iframeWindow,
corvinaHostWindow: mainWindowFromIFrame
});
corvinaHost.enableNavigationSync();
connect.enableNavigationSync();
connect.on(CorvinaConnectEventType.IFRAME_HREF_CHANGED, ({ href, type }) => {
iframeWindow.history.pushState({}, '', href);
});
iframeWindow.history.pushState({}, '', iframeUrl + '/#/new-path-2');
yield new Promise(resolve => setTimeout(resolve, 100));
console.log('window location: ', window.location.href);
expect(window.location.href).toContain('appHref');
expect(window.location.href).toContain('new-path-2');
window.history.pushState({}, '', 'http://localhost/?appHref=http%3A%2F%2Fiframe%2F%23%2Fnew-path-3');
yield new Promise(resolve => setTimeout(resolve, 100));
console.log('iframe location: ', iframeWindow.location.href);
expect(iframeWindow.location.href).toContain('new-path-3');
expect(iframeWindow.history.length).toBe(3);
expect(window.history.length).toBe(3);
iframeWindow.history.replaceState({}, '', iframeUrl + '/#/new-path-4');
yield new Promise(resolve => setTimeout(resolve, 100));
expect(window.location.href).toContain('new-path-4');
expect(iframeWindow.history.length).toBe(3);
expect(window.history.length).toBe(3);
connect.dispose();
corvinaHost.dispose();
document.body.removeChild(iframe);
}), 30000);
it('send JWT_CHANGED message to target iframes only', () => __awaiter(void 0, void 0, void 0, function* () {
const iframe1 = document.createElement('iframe');
const url1 = 'http://iframe1';
iframe1.src = url1;
iframe1.id = 'corvina-app-connect-test-1';
document.body.appendChild(iframe1);
const iframe2 = document.createElement('iframe');
const url2 = 'http://iframe2';
iframe2.src = url2;
iframe2.id = 'corvina-app-connect-test-2';
document.body.appendChild(iframe2);
const { iframeWindow: iframeWindow1, mainWindowFromIFrame: mainWindowFromIFrame1 } = patchWindowObjects({ mainWindow: window, iframeWindow: iframe1.contentWindow });
const { iframeWindow: iframeWindow2, mainWindowFromIFrame: mainWindowFromIFrame2 } = patchWindowObjects({ mainWindow: window, iframeWindow: iframe2.contentWindow });
const connect1 = yield CorvinaConnect.create({
corvinaHost: 'http://localhost',
currentWindow: iframeWindow1,
corvinaHostWindow: mainWindowFromIFrame1
});
const connect2 = yield CorvinaConnect.create({
corvinaHost: 'http://localhost',
currentWindow: iframeWindow2,
corvinaHostWindow: mainWindowFromIFrame2
});
const postMessageMocked1 = jest.spyOn(iframe1.contentWindow, 'postMessage');
const postMessageMocked2 = jest.spyOn(iframe2.contentWindow, 'postMessage');
corvinaHost.setJwtApp({
jwt: 'jwt1',
iframeOrigin: url1,
});
corvinaHost.setJwtApp({
jwt: 'jwt2',
iframeOrigin: url2,
});
expect(postMessageMocked1).toHaveBeenCalledTimes(1);
expect(postMessageMocked1).toHaveBeenCalledWith({ payload: { jwt: "jwt1" }, type: "JWT_CHANGED" }, { targetOrigin: "http://iframe1/" });
expect(postMessageMocked2).toHaveBeenCalledTimes(1);
expect(postMessageMocked2).toHaveBeenCalledWith({ payload: { jwt: "jwt2" }, type: "JWT_CHANGED" }, { targetOrigin: "http://iframe2/" });
const iframe3 = document.createElement('iframe');
iframe3.src = url1;
iframe3.id = 'corvina-app-connect-test-3';
document.body.appendChild(iframe3);
const { iframeWindow: iframeWindow3, mainWindowFromIFrame: mainWindowFromIFrame3 } = patchWindowObjects({ mainWindow: window, iframeWindow: iframe3.contentWindow });
const connect3 = yield CorvinaConnect.create({
corvinaHost: 'http://localhost',
currentWindow: iframeWindow3,
corvinaHostWindow: mainWindowFromIFrame3
});
const postMessageMocked3 = jest.spyOn(iframe3.contentWindow, 'postMessage');
corvinaHost.setJwtApp({
jwt: 'jwt1',
iframeOrigin: url1,
});
expect(postMessageMocked3).toHaveBeenCalledTimes(1);
expect(postMessageMocked3).toHaveBeenCalledWith({ payload: { jwt: "jwt1" }, type: "JWT_CHANGED" }, { targetOrigin: "http://iframe1/" });
expect(postMessageMocked1).toHaveBeenCalledTimes(2);
expect(postMessageMocked1).toHaveBeenCalledWith({ payload: { jwt: "jwt1" }, type: "JWT_CHANGED" }, { targetOrigin: "http://iframe1/" });
expect(postMessageMocked2).toHaveBeenCalledTimes(1);
connect1.dispose();
connect2.dispose();
CorvinaConnect.dispose();
document.body.removeChild(iframe1);
document.body.removeChild(iframe2);
}));
it('user preferences', () => __awaiter(void 0, void 0, void 0, function* () {
const iframe = document.createElement('iframe');
iframe.src = 'http://iframe1';
iframe.id = 'corvina-app-user-pref-test';
document.body.appendChild(iframe);
const { iframeWindow, mainWindowFromIFrame } = patchWindowObjects({ mainWindow: window, iframeWindow: iframe.contentWindow });
const connect = yield CorvinaConnect.create({
corvinaHost: 'http://localhost',
currentWindow: iframeWindow,
corvinaHostWindow: mainWindowFromIFrame
});
const kvMap = new Map();
corvinaHost.onUserPreferenceGetRequest((message) => __awaiter(void 0, void 0, void 0, function* () {
const { key } = message.data.payload;
return {
key,
value: kvMap.get(key),
};
}));
corvinaHost.onUserPreferenceSetRequest((message) => __awaiter(void 0, void 0, void 0, function* () {
const { key, value } = message.data.payload;
kvMap.set(key, value);
}));
let preferenceValue = yield connect.getUserPreference("prova", 0);
expect(preferenceValue).toBeUndefined();
yield connect.setUserPreference("prova", "value");
preferenceValue = yield connect.getUserPreference("prova", 0);
expect(preferenceValue).toEqual("value");
CorvinaConnect.dispose();
corvinaHost.dispose();
document.body.removeChild(iframe);
}), 10000);
});
//# sourceMappingURL=CorvinaHost.test.js.map