From b4ae3fb9c42f2efa2ab5b509dfa8fff72e978fed Mon Sep 17 00:00:00 2001 From: Ravi <7014230+arelra@users.noreply.github.com> Date: Thu, 25 Jan 2024 15:58:35 +0000 Subject: [PATCH 1/3] Remove Ophan request abort --- dotcom-rendering/playwright/lib/load-page.ts | 10 ++-------- 1 file changed, 2 insertions(+), 8 deletions(-) diff --git a/dotcom-rendering/playwright/lib/load-page.ts b/dotcom-rendering/playwright/lib/load-page.ts index 6c7ece367b3..11f76ab33ff 100644 --- a/dotcom-rendering/playwright/lib/load-page.ts +++ b/dotcom-rendering/playwright/lib/load-page.ts @@ -9,8 +9,6 @@ const BASE_URL = `http://localhost:${PORT}`; * - default the base url and port * - default the geo region to GB * - prevent the support banner from showing - * - abort all ophan requests - * - use default waitUntil: 'domcontentloaded' rather than 'load' to speed up tests */ const loadPage = async ( page: Page, @@ -32,12 +30,8 @@ const loadPage = async ( ); } }, region); - // Abort all ophan requests as they hang and stop the page from firing the 'load' event - await page.route(/ophan.theguardian.com/, async (route) => { - await route.abort(); - }); - // Use default waitUntil: 'domcontentloaded' rather than 'load' to speed up tests - // If this causes any issues use 'load' instead + // The default waitUntil: 'load' ensures all requests have completed + // For specific cases that do not rely on JS use 'domcontentloaded' to speed up tests await page.goto(`${BASE_URL}${path}`, { waitUntil }); }; From 02e6927dc169655c7310c964a1bf5beee888fe08 Mon Sep 17 00:00:00 2001 From: Ravi <7014230+arelra@users.noreply.github.com> Date: Thu, 25 Jan 2024 22:11:23 +0000 Subject: [PATCH 2/3] loadPage waits for load event --- dotcom-rendering/playwright/lib/load-page.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/dotcom-rendering/playwright/lib/load-page.ts b/dotcom-rendering/playwright/lib/load-page.ts index 11f76ab33ff..6268ebe6a0f 100644 --- a/dotcom-rendering/playwright/lib/load-page.ts +++ b/dotcom-rendering/playwright/lib/load-page.ts @@ -13,7 +13,7 @@ const BASE_URL = `http://localhost:${PORT}`; const loadPage = async ( page: Page, path: string, - waitUntil: 'load' | 'domcontentloaded' = 'domcontentloaded', + waitUntil: 'load' | 'domcontentloaded' = 'load', region = 'GB', preventSupportBanner = true, ): Promise => { From a91b61dc5957e6d783364470233e544c24c1f5ce Mon Sep 17 00:00:00 2001 From: Ravi <7014230+arelra@users.noreply.github.com> Date: Thu, 25 Jan 2024 22:32:55 +0000 Subject: [PATCH 3/3] Ophan e2e test --- .../tests/parallel-4/ophan.e2e.spec.ts | 128 ++++++++++++++++++ 1 file changed, 128 insertions(+) create mode 100644 dotcom-rendering/playwright/tests/parallel-4/ophan.e2e.spec.ts diff --git a/dotcom-rendering/playwright/tests/parallel-4/ophan.e2e.spec.ts b/dotcom-rendering/playwright/tests/parallel-4/ophan.e2e.spec.ts new file mode 100644 index 00000000000..87e7b4561a6 --- /dev/null +++ b/dotcom-rendering/playwright/tests/parallel-4/ophan.e2e.spec.ts @@ -0,0 +1,128 @@ +import { isUndefined } from '@guardian/libs'; +import type { Page } from '@playwright/test'; +import { test } from '@playwright/test'; +import { cmpAcceptAll, cmpRejectAll, disableCMP } from '../../lib/cmp'; +import { loadPage } from '../../lib/load-page'; + +const articleUrl = + 'https://www.theguardian.com/politics/2019/oct/29/tories-restore-party-whip-to-10-mps-who-sought-to-block-no-deal-brexit'; + +const frontUrl = 'https://www.theguardian.com/uk'; + +const interceptOphanRequest = ({ + page, + path, + searchParamMatcher, +}: { + page: Page; + path: string; + searchParamMatcher: (searchParams: URLSearchParams) => boolean; +}) => { + return page.waitForRequest((request) => { + const matchUrl = request + .url() + .startsWith(`https://ophan.theguardian.com/${path}`); + const searchParams = new URLSearchParams(request.url()); + return matchUrl && searchParamMatcher(searchParams); + }); +}; + +test.describe('Ophan requests', () => { + test('should make a view request on an article when consent is rejected', async ({ + page, + }) => { + const ophanRequestPromise = interceptOphanRequest({ + page, + path: 'img/1', + searchParamMatcher: (searchParams: URLSearchParams) => { + const platform = searchParams.get('platform'); + const url = searchParams.get('url'); + const viewId = searchParams.get('viewId'); + return ( + platform === 'next-gen' && + url === page.url() && + !isUndefined(viewId) + ); + }, + }); + await loadPage(page, `/Article/${articleUrl}`); + await cmpRejectAll(page); + await ophanRequestPromise; + }); + + test('should make a view request on an article when consent is accepted', async ({ + page, + }) => { + const ophanRequestPromise = interceptOphanRequest({ + page, + path: 'img/1', + searchParamMatcher: (searchParams: URLSearchParams) => { + const platform = searchParams.get('platform'); + const url = searchParams.get('url'); + const viewId = searchParams.get('viewId'); + return ( + platform === 'next-gen' && + url === page.url() && + !isUndefined(viewId) + ); + }, + }); + await loadPage(page, `/Article/${articleUrl}`); + await cmpAcceptAll(page); + await ophanRequestPromise; + }); + + test('should make event requests on an article', async ({ + context, + page, + }) => { + await disableCMP(context); + const ophanExperienceRequestPromise = interceptOphanRequest({ + page, + path: 'img/2', + searchParamMatcher: (searchParams: URLSearchParams) => { + const experiences = searchParams.get('experiences'); + return experiences === 'dotcom-rendering'; + }, + }); + await loadPage(page, `/Article/${articleUrl}`); + await ophanExperienceRequestPromise; + }); + + test('should make a view request on a front', async ({ context, page }) => { + await disableCMP(context); + const ophanRequestPromise = interceptOphanRequest({ + page, + path: 'img/1', + searchParamMatcher: (searchParams: URLSearchParams) => { + const platform = searchParams.get('platform'); + const url = searchParams.get('url'); + const viewId = searchParams.get('viewId'); + return ( + platform === 'next-gen' && + url === page.url() && + !isUndefined(viewId) + ); + }, + }); + await loadPage(page, `/Front/${frontUrl}`); + await ophanRequestPromise; + }); + + test('should make an event request on a front', async ({ + context, + page, + }) => { + await disableCMP(context); + const ophanExperienceRequestPromise = interceptOphanRequest({ + page, + path: 'img/2', + searchParamMatcher: (searchParams: URLSearchParams) => { + const experiences = searchParams.get('experiences'); + return experiences === 'dotcom-rendering'; + }, + }); + await loadPage(page, `/Front/${frontUrl}`); + await ophanExperienceRequestPromise; + }); +});