2023-05-24 16:05:45 +03:00
|
|
|
import {E2E_PORT} from '../../playwright.config';
|
2023-06-01 11:18:11 +03:00
|
|
|
import {Page} from '@playwright/test';
|
2023-05-24 16:05:45 +03:00
|
|
|
|
2023-06-01 11:18:11 +03:00
|
|
|
const MOCKED_SITE_URL = 'https://localhost:1234';
|
2023-05-30 12:57:56 +03:00
|
|
|
|
|
|
|
|
type LastApiRequest = {
|
2023-07-27 17:36:01 +03:00
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
2023-05-30 12:57:56 +03:00
|
|
|
body: null | any
|
|
|
|
|
};
|
|
|
|
|
|
2023-06-14 16:50:04 +03:00
|
|
|
export async function initialize({page, path, apiStatus, embeddedOnUrl, ...options}: {page: Page, embeddedOnUrl?: string, path?: string; title?: string, description?: string, icon?: string, backgroundColor?: string, buttonColor?: string, site?: string, 'label-1'?: string, 'label-2'?: string, apiStatus?: number}) {
|
|
|
|
|
const sitePath = `${embeddedOnUrl ?? MOCKED_SITE_URL}${path ?? ''}`;
|
2023-06-01 11:18:11 +03:00
|
|
|
await page.route(sitePath, async (route) => {
|
|
|
|
|
await route.fulfill({
|
|
|
|
|
status: 200,
|
2023-06-22 14:55:05 +03:00
|
|
|
body: '<html><head><meta charset="UTF-8" /></head><body></body></html>'
|
2023-06-01 11:18:11 +03:00
|
|
|
});
|
|
|
|
|
});
|
2023-05-24 16:05:45 +03:00
|
|
|
|
2023-06-01 11:18:11 +03:00
|
|
|
const url = `http://localhost:${E2E_PORT}/signup-form.min.js`;
|
2023-05-24 16:05:45 +03:00
|
|
|
await page.setViewportSize({width: 1000, height: 1000});
|
2023-06-01 11:18:11 +03:00
|
|
|
|
|
|
|
|
await page.goto(sitePath);
|
2023-06-09 15:10:26 +03:00
|
|
|
const lastApiRequest = await mockApi({page, status: apiStatus});
|
2023-05-30 12:57:56 +03:00
|
|
|
|
|
|
|
|
if (!options.site) {
|
|
|
|
|
options.site = MOCKED_SITE_URL;
|
|
|
|
|
}
|
2023-05-24 16:05:45 +03:00
|
|
|
|
|
|
|
|
await page.evaluate((data) => {
|
|
|
|
|
const scriptTag = document.createElement('script');
|
|
|
|
|
scriptTag.src = data.url;
|
|
|
|
|
|
|
|
|
|
for (const option of Object.keys(data.options)) {
|
|
|
|
|
scriptTag.dataset[option] = data.options[option];
|
|
|
|
|
}
|
|
|
|
|
document.body.appendChild(scriptTag);
|
|
|
|
|
}, {url, options});
|
2023-05-30 14:41:38 +03:00
|
|
|
|
2023-05-24 16:05:45 +03:00
|
|
|
await page.waitForSelector('iframe');
|
2023-05-30 12:57:56 +03:00
|
|
|
|
|
|
|
|
return {
|
|
|
|
|
frame: page.frameLocator('iframe'),
|
|
|
|
|
lastApiRequest
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
|
2023-07-27 17:36:01 +03:00
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
2023-06-09 15:10:26 +03:00
|
|
|
export async function mockApi({page, status = 200}: {page: any, status?: number}) {
|
2023-05-30 12:57:56 +03:00
|
|
|
const lastApiRequest: LastApiRequest = {
|
|
|
|
|
body: null
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
await page.route(`${MOCKED_SITE_URL}/members/api/send-magic-link/`, async (route) => {
|
|
|
|
|
const requestBody = JSON.parse(route.request().postData());
|
|
|
|
|
lastApiRequest.body = requestBody;
|
|
|
|
|
|
|
|
|
|
await route.fulfill({
|
2023-06-09 15:10:26 +03:00
|
|
|
status,
|
2023-05-30 12:57:56 +03:00
|
|
|
body: 'ok'
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
2023-06-01 11:18:11 +03:00
|
|
|
await page.route(`${MOCKED_SITE_URL}/invalid/members/api/send-magic-link/`, async (route) => {
|
|
|
|
|
await route.abort('addressunreachable');
|
|
|
|
|
});
|
|
|
|
|
|
2023-05-30 12:57:56 +03:00
|
|
|
return lastApiRequest;
|
2023-05-24 16:05:45 +03:00
|
|
|
}
|
