From 2935d3fd8580680bb8d72d01273ae43c1ac4f206 Mon Sep 17 00:00:00 2001 From: TimothyFothergill <67912934+TimothyFothergill@users.noreply.github.com> Date: Tue, 10 Dec 2024 15:35:46 +0000 Subject: [PATCH 1/6] PLATUI-3359 ensure timeout dialog tests resolve gracefully --- lib/browser-tests/puppeteer-helpers.js | 23 +++-- .../timeout-dialog.browser.test.js | 89 ++++++++++--------- 2 files changed, 64 insertions(+), 48 deletions(-) diff --git a/lib/browser-tests/puppeteer-helpers.js b/lib/browser-tests/puppeteer-helpers.js index f8c83db3..f845d596 100644 --- a/lib/browser-tests/puppeteer-helpers.js +++ b/lib/browser-tests/puppeteer-helpers.js @@ -41,6 +41,7 @@ export function withHmrcStylesAndScripts(body) { + ${preloadGovukFonts} @@ -49,6 +50,7 @@ export function withHmrcStylesAndScripts(body) { ${body} + `; @@ -56,12 +58,19 @@ export function withHmrcStylesAndScripts(body) { export async function render(page, body, options) { await page.setRequestInterception(true); - page.once('request', (req) => { - req.respond({ contentType: 'text/html', body }); - page.setRequestInterception(false); - }); - await page.goto('http://localhost:3000/', options); // if ever flaky, waitUntil networkidle0 (js loaded) - await page.evaluateHandle('document.fonts.ready'); - await page.bringToFront(); + const interceptPageRender = (req) => { + if (req.url() === 'http://localhost:3000/') { + return req.respond({ contentType: 'text/html', body }); + } + return Promise.resolve().then(() => req.continue()).catch(() => {}); + }; + page.on('request', interceptPageRender); + try { + await page.goto('http://localhost:3000/', options); // if ever flaky, waitUntil networkidle0 (js loaded) + await page.bringToFront(); + } finally { + page.off('request', interceptPageRender); + await page.setRequestInterception(false); + } return page; } diff --git a/src/components/timeout-dialog/timeout-dialog.browser.test.js b/src/components/timeout-dialog/timeout-dialog.browser.test.js index a07a64ed..96788f44 100644 --- a/src/components/timeout-dialog/timeout-dialog.browser.test.js +++ b/src/components/timeout-dialog/timeout-dialog.browser.test.js @@ -77,7 +77,7 @@ describe('/components/timeout-dialog', () => { `); await clockTickSeconds(page, 900); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/timeout-reached'); + expect(page.url()).toMatch('/timeout-reached'); }); it('should not sign you out when the countdown runs out if you chose to stay signed in', async () => { @@ -91,7 +91,7 @@ describe('/components/timeout-dialog', () => { await expect(page).toClick('button', { text: 'Stay signed in' }); await clockTickSeconds(page, 1); await delay(500); - await expect(page.url()).not.toMatch('/timeout-reached'); + expect(page.url()).not.toMatch('/timeout-reached'); await expect(page).not.toShowTimeoutDialog(); }); @@ -122,7 +122,7 @@ describe('/components/timeout-dialog', () => { await expect(page).toClick('button', { text: 'Stay signed in' }); await clockTickSeconds(page, 900); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/timeout-reached'); + expect(page.url()).toMatch('/timeout-reached'); }); it('should let you extend your session repeatedly', async () => { @@ -141,7 +141,7 @@ describe('/components/timeout-dialog', () => { await expect(page.url()).not.toMatch('/timeout-reached'); await clockTickSeconds(page, 900); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/timeout-reached'); + expect(page.url()).toMatch('/timeout-reached'); }); it('should let you sign out early', async () => { @@ -154,7 +154,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 800); await expect(page).toClick('a', { text: 'Sign out' }); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/timeout-reached'); + expect(page.url()).toMatch('/timeout-reached'); }); it('should let you specify a separate timeout url', async () => { @@ -178,7 +178,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 800); await expect(page).toClick('a', { text: 'Sign out' }); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/signed-out-early'); + expect(page.url()).toMatch('/signed-out-early'); }); // TODO at the moment it doesn't, should we change test or implementation? @@ -193,19 +193,22 @@ describe('/components/timeout-dialog', () => { `); await clockTickSeconds(page, 899); await page.setRequestInterception(true); - await page.once('request', (req) => { - setTimeout(() => req.respond({ - contentType: 'text/plain', - body: 'simulate slow response to signing out', - }), 2000); - page.setRequestInterception(false); - }); - await page.evaluate(() => { - document.getElementById('hmrc-timeout-sign-out-link').click(); - window.clock.tick(1000); // to reach timeout while sign out page is still loading - }); - await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/signed-out-early'); + try { + page.once('request', (req) => { + setTimeout(() => req.respond({ + contentType: 'text/plain', + body: 'simulate slow response to signing out', + }), 2000); + }); + await page.evaluate(() => { + document.getElementById('hmrc-timeout-sign-out-link').click(); + window.clock.tick(1000); // to reach timeout while sign out page is still loading + }); + await page.waitForNavigation({ timeout: 500 }); + expect(page.url()).toMatch('/signed-out-early'); + } finally { + await page.setRequestInterception(false); + } }); function takeTextContentEachSecondForAMinute(page, selector) { @@ -255,7 +258,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 1); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/timeout-reached'); + expect(page.url()).toMatch('/timeout-reached'); }); function twentyTimes(value) { return Array.from({ length: 20 }, () => value); } @@ -292,7 +295,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 1); await page.waitForNavigation({ timeout: 500 }); - await expect(page.url()).toMatch('/timeout-reached'); + expect(page.url()).toMatch('/timeout-reached'); }); }); @@ -306,28 +309,31 @@ describe('/components/timeout-dialog', () => { let completeSlowTimeoutRequest; const slowTimeout = new Promise((resolve) => { completeSlowTimeoutRequest = resolve; }); await page.setRequestInterception(true); - page.once('request', (req) => { - slowTimeout.then(() => { - req.respond({ - contentType: 'text/plain', - body: 'timeout page reached', + try { + page.once('request', (req) => { + slowTimeout.then(() => { + req.respond({ + contentType: 'text/plain', + body: 'timeout page reached', + }); }); - page.setRequestInterception(false); }); - }); - const [visibleMessage, audibleMessage] = await page.evaluate(() => { - window.clock.tick(10000); // bring up warning - window.clock.tick(30000); // overrun timeout by 20s, the redirect will hang until resolved - return [ - document.querySelector('.hmrc-timeout-dialog__message').textContent, - document.querySelector('#hmrc-timeout-message').textContent, - ]; - }); - expect(visibleMessage).toBe('For your security, we will sign you out in 0 seconds.'); - expect(audibleMessage).toBe('For your security, we will sign you out in 20 seconds.'); - completeSlowTimeoutRequest(); - await page.waitForNavigation({ timeout: 500 }); - await expect(page).toMatchTextContent('timeout page reached'); + const [visibleMessage, audibleMessage] = await page.evaluate(() => { + window.clock.tick(10000); // bring up warning + window.clock.tick(30000); // overrun timeout by 20s, the redirect will hang until resolved + return [ + document.querySelector('.hmrc-timeout-dialog__message').textContent, + document.querySelector('#hmrc-timeout-message').textContent, + ]; + }); + expect(visibleMessage).toBe('For your security, we will sign you out in 0 seconds.'); + expect(audibleMessage).toBe('For your security, we will sign you out in 20 seconds.'); + completeSlowTimeoutRequest(); + await page.waitForNavigation({ timeout: 500 }); + await expect(page).toMatchTextContent('timeout page reached'); + } finally { + await page.setRequestInterception(false); + } }); it('should display the time remaining as a whole number of seconds', async () => { @@ -404,5 +410,6 @@ describe('/components/timeout-dialog', () => { await expect(background).toShowTimeoutDialog(); expect(await visualCountdownFrom(background)) .toBe('For your security, we will sign you out in 10 seconds.'); + await session.close(); }); }); From e618de3772e2058de30b02ba5545beb8d65feb0b Mon Sep 17 00:00:00 2001 From: TimothyFothergill <67912934+TimothyFothergill@users.noreply.github.com> Date: Wed, 11 Dec 2024 13:40:21 +0000 Subject: [PATCH 2/6] PLATUI-3359 trigger tests --- .../timeout-dialog.browser.test.js | 28 +++++++++---------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/src/components/timeout-dialog/timeout-dialog.browser.test.js b/src/components/timeout-dialog/timeout-dialog.browser.test.js index 96788f44..eab74fdf 100644 --- a/src/components/timeout-dialog/timeout-dialog.browser.test.js +++ b/src/components/timeout-dialog/timeout-dialog.browser.test.js @@ -261,7 +261,7 @@ describe('/components/timeout-dialog', () => { expect(page.url()).toMatch('/timeout-reached'); }); - function twentyTimes(value) { return Array.from({ length: 20 }, () => value); } + // function twentyTimes(value) { return Array.from({ length: 20 }, () => value); } it('should update the audible time remaining every 20 seconds', async () => { await renderTimeoutDialog(page, ` @@ -274,24 +274,24 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 59); - const audibleMessageWithMoreThanAMinuteRemaining = await audibleCountdownFrom(page); + await audibleCountdownFrom(page); - const allAudibleMessagesDuringLastMinute = await takeTextContentEachSecondForAMinute(page, '#hmrc-timeout-message'); + await takeTextContentEachSecondForAMinute(page, '#hmrc-timeout-message'); - expect(audibleMessageWithMoreThanAMinuteRemaining) - .toBe('For your security, we will sign you out in 2 minutes.'); + // expect(audibleMessageWithMoreThanAMinuteRemaining) + // .toBe('For your security, we will sign you out in 2 minutes.'); - expect(allAudibleMessagesDuringLastMinute.slice(0, 20)).toStrictEqual( - twentyTimes('For your security, we will sign you out in 1 minute.'), - ); + // expect(allAudibleMessagesDuringLastMinute.slice(0, 20)).toStrictEqual( + // twentyTimes('For your security, we will sign you out in 1 minute.'), + // ); - expect(allAudibleMessagesDuringLastMinute.slice(20, 40)).toStrictEqual( - twentyTimes('For your security, we will sign you out in 40 seconds.'), - ); + // expect(allAudibleMessagesDuringLastMinute.slice(20, 40)).toStrictEqual( + // twentyTimes('For your security, we will sign you out in 40 seconds.'), + // ); - expect(allAudibleMessagesDuringLastMinute.slice(40, 60)).toStrictEqual( - twentyTimes('For your security, we will sign you out in 20 seconds.'), - ); + // expect(allAudibleMessagesDuringLastMinute.slice(40, 60)).toStrictEqual( + // twentyTimes('For your security, we will sign you out in 20 seconds.'), + // ); await clockTickSeconds(page, 1); await page.waitForNavigation({ timeout: 500 }); From 4c9e5b517a539ec5fe27c656d559a1b12b12396b Mon Sep 17 00:00:00 2001 From: TimothyFothergill <67912934+TimothyFothergill@users.noreply.github.com> Date: Wed, 11 Dec 2024 14:37:25 +0000 Subject: [PATCH 3/6] PLATUI-3359 drop overlapping checks --- .../timeout-dialog.browser.test.js | 28 +++++++++---------- 1 file changed, 14 insertions(+), 14 deletions(-) diff --git a/src/components/timeout-dialog/timeout-dialog.browser.test.js b/src/components/timeout-dialog/timeout-dialog.browser.test.js index eab74fdf..bae9a43a 100644 --- a/src/components/timeout-dialog/timeout-dialog.browser.test.js +++ b/src/components/timeout-dialog/timeout-dialog.browser.test.js @@ -261,7 +261,7 @@ describe('/components/timeout-dialog', () => { expect(page.url()).toMatch('/timeout-reached'); }); - // function twentyTimes(value) { return Array.from({ length: 20 }, () => value); } + function twentyTimes(value) { return Array.from({ length: 19 }, () => value); } it('should update the audible time remaining every 20 seconds', async () => { await renderTimeoutDialog(page, ` @@ -274,24 +274,24 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 59); - await audibleCountdownFrom(page); + const audibleMessageWithMoreThanAMinuteRemaining = await audibleCountdownFrom(page); - await takeTextContentEachSecondForAMinute(page, '#hmrc-timeout-message'); + const allAudibleMessagesDuringLastMinute = await takeTextContentEachSecondForAMinute(page, '#hmrc-timeout-message'); - // expect(audibleMessageWithMoreThanAMinuteRemaining) - // .toBe('For your security, we will sign you out in 2 minutes.'); + expect(audibleMessageWithMoreThanAMinuteRemaining) + .toBe('For your security, we will sign you out in 2 minutes.'); - // expect(allAudibleMessagesDuringLastMinute.slice(0, 20)).toStrictEqual( - // twentyTimes('For your security, we will sign you out in 1 minute.'), - // ); + expect(allAudibleMessagesDuringLastMinute.slice(0, 19)).toStrictEqual( + twentyTimes('For your security, we will sign you out in 1 minute.'), + ); - // expect(allAudibleMessagesDuringLastMinute.slice(20, 40)).toStrictEqual( - // twentyTimes('For your security, we will sign you out in 40 seconds.'), - // ); + expect(allAudibleMessagesDuringLastMinute.slice(20, 39)).toStrictEqual( + twentyTimes('For your security, we will sign you out in 40 seconds.'), + ); - // expect(allAudibleMessagesDuringLastMinute.slice(40, 60)).toStrictEqual( - // twentyTimes('For your security, we will sign you out in 20 seconds.'), - // ); + expect(allAudibleMessagesDuringLastMinute.slice(40, 59)).toStrictEqual( + twentyTimes('For your security, we will sign you out in 20 seconds.'), + ); await clockTickSeconds(page, 1); await page.waitForNavigation({ timeout: 500 }); From 0dab61063138b6c677736e3c6c4fddd3ea01ffd6 Mon Sep 17 00:00:00 2001 From: TimothyFothergill <67912934+TimothyFothergill@users.noreply.github.com> Date: Wed, 11 Dec 2024 14:53:46 +0000 Subject: [PATCH 4/6] PLATUI-3359 refactor method to drop one second --- .../timeout-dialog/timeout-dialog.browser.test.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/timeout-dialog/timeout-dialog.browser.test.js b/src/components/timeout-dialog/timeout-dialog.browser.test.js index bae9a43a..71815224 100644 --- a/src/components/timeout-dialog/timeout-dialog.browser.test.js +++ b/src/components/timeout-dialog/timeout-dialog.browser.test.js @@ -261,7 +261,7 @@ describe('/components/timeout-dialog', () => { expect(page.url()).toMatch('/timeout-reached'); }); - function twentyTimes(value) { return Array.from({ length: 19 }, () => value); } + function nineteenTimes(value) { return Array.from({ length: 19 }, () => value); } it('should update the audible time remaining every 20 seconds', async () => { await renderTimeoutDialog(page, ` @@ -282,15 +282,15 @@ describe('/components/timeout-dialog', () => { .toBe('For your security, we will sign you out in 2 minutes.'); expect(allAudibleMessagesDuringLastMinute.slice(0, 19)).toStrictEqual( - twentyTimes('For your security, we will sign you out in 1 minute.'), + nineteenTimes('For your security, we will sign you out in 1 minute.'), ); expect(allAudibleMessagesDuringLastMinute.slice(20, 39)).toStrictEqual( - twentyTimes('For your security, we will sign you out in 40 seconds.'), + nineteenTimes('For your security, we will sign you out in 40 seconds.'), ); expect(allAudibleMessagesDuringLastMinute.slice(40, 59)).toStrictEqual( - twentyTimes('For your security, we will sign you out in 20 seconds.'), + nineteenTimes('For your security, we will sign you out in 20 seconds.'), ); await clockTickSeconds(page, 1); From 55c3b109bf7651974a1613446acca3644d258465 Mon Sep 17 00:00:00 2001 From: TimothyFothergill <67912934+TimothyFothergill@users.noreply.github.com> Date: Thu, 12 Dec 2024 08:01:12 +0000 Subject: [PATCH 5/6] PLATUI-3359 remove unused code --- lib/browser-tests/puppeteer-helpers.js | 23 ++--- .../timeout-dialog.browser.test.js | 89 +++++++++---------- 2 files changed, 48 insertions(+), 64 deletions(-) diff --git a/lib/browser-tests/puppeteer-helpers.js b/lib/browser-tests/puppeteer-helpers.js index f845d596..f8c83db3 100644 --- a/lib/browser-tests/puppeteer-helpers.js +++ b/lib/browser-tests/puppeteer-helpers.js @@ -41,7 +41,6 @@ export function withHmrcStylesAndScripts(body) { - ${preloadGovukFonts} @@ -50,7 +49,6 @@ export function withHmrcStylesAndScripts(body) { ${body} - `; @@ -58,19 +56,12 @@ export function withHmrcStylesAndScripts(body) { export async function render(page, body, options) { await page.setRequestInterception(true); - const interceptPageRender = (req) => { - if (req.url() === 'http://localhost:3000/') { - return req.respond({ contentType: 'text/html', body }); - } - return Promise.resolve().then(() => req.continue()).catch(() => {}); - }; - page.on('request', interceptPageRender); - try { - await page.goto('http://localhost:3000/', options); // if ever flaky, waitUntil networkidle0 (js loaded) - await page.bringToFront(); - } finally { - page.off('request', interceptPageRender); - await page.setRequestInterception(false); - } + page.once('request', (req) => { + req.respond({ contentType: 'text/html', body }); + page.setRequestInterception(false); + }); + await page.goto('http://localhost:3000/', options); // if ever flaky, waitUntil networkidle0 (js loaded) + await page.evaluateHandle('document.fonts.ready'); + await page.bringToFront(); return page; } diff --git a/src/components/timeout-dialog/timeout-dialog.browser.test.js b/src/components/timeout-dialog/timeout-dialog.browser.test.js index 71815224..c894806d 100644 --- a/src/components/timeout-dialog/timeout-dialog.browser.test.js +++ b/src/components/timeout-dialog/timeout-dialog.browser.test.js @@ -77,7 +77,7 @@ describe('/components/timeout-dialog', () => { `); await clockTickSeconds(page, 900); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/timeout-reached'); + await expect(page.url()).toMatch('/timeout-reached'); }); it('should not sign you out when the countdown runs out if you chose to stay signed in', async () => { @@ -91,7 +91,7 @@ describe('/components/timeout-dialog', () => { await expect(page).toClick('button', { text: 'Stay signed in' }); await clockTickSeconds(page, 1); await delay(500); - expect(page.url()).not.toMatch('/timeout-reached'); + await expect(page.url()).not.toMatch('/timeout-reached'); await expect(page).not.toShowTimeoutDialog(); }); @@ -122,7 +122,7 @@ describe('/components/timeout-dialog', () => { await expect(page).toClick('button', { text: 'Stay signed in' }); await clockTickSeconds(page, 900); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/timeout-reached'); + await expect(page.url()).toMatch('/timeout-reached'); }); it('should let you extend your session repeatedly', async () => { @@ -141,7 +141,7 @@ describe('/components/timeout-dialog', () => { await expect(page.url()).not.toMatch('/timeout-reached'); await clockTickSeconds(page, 900); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/timeout-reached'); + await expect(page.url()).toMatch('/timeout-reached'); }); it('should let you sign out early', async () => { @@ -154,7 +154,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 800); await expect(page).toClick('a', { text: 'Sign out' }); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/timeout-reached'); + await expect(page.url()).toMatch('/timeout-reached'); }); it('should let you specify a separate timeout url', async () => { @@ -178,7 +178,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 800); await expect(page).toClick('a', { text: 'Sign out' }); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/signed-out-early'); + await expect(page.url()).toMatch('/signed-out-early'); }); // TODO at the moment it doesn't, should we change test or implementation? @@ -193,22 +193,19 @@ describe('/components/timeout-dialog', () => { `); await clockTickSeconds(page, 899); await page.setRequestInterception(true); - try { - page.once('request', (req) => { - setTimeout(() => req.respond({ - contentType: 'text/plain', - body: 'simulate slow response to signing out', - }), 2000); - }); - await page.evaluate(() => { - document.getElementById('hmrc-timeout-sign-out-link').click(); - window.clock.tick(1000); // to reach timeout while sign out page is still loading - }); - await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/signed-out-early'); - } finally { - await page.setRequestInterception(false); - } + await page.once('request', (req) => { + setTimeout(() => req.respond({ + contentType: 'text/plain', + body: 'simulate slow response to signing out', + }), 2000); + page.setRequestInterception(false); + }); + await page.evaluate(() => { + document.getElementById('hmrc-timeout-sign-out-link').click(); + window.clock.tick(1000); // to reach timeout while sign out page is still loading + }); + await page.waitForNavigation({ timeout: 500 }); + await expect(page.url()).toMatch('/signed-out-early'); }); function takeTextContentEachSecondForAMinute(page, selector) { @@ -258,7 +255,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 1); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/timeout-reached'); + await expect(page.url()).toMatch('/timeout-reached'); }); function nineteenTimes(value) { return Array.from({ length: 19 }, () => value); } @@ -295,7 +292,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 1); await page.waitForNavigation({ timeout: 500 }); - expect(page.url()).toMatch('/timeout-reached'); + await expect(page.url()).toMatch('/timeout-reached'); }); }); @@ -309,31 +306,28 @@ describe('/components/timeout-dialog', () => { let completeSlowTimeoutRequest; const slowTimeout = new Promise((resolve) => { completeSlowTimeoutRequest = resolve; }); await page.setRequestInterception(true); - try { - page.once('request', (req) => { - slowTimeout.then(() => { - req.respond({ - contentType: 'text/plain', - body: 'timeout page reached', - }); + page.once('request', (req) => { + slowTimeout.then(() => { + req.respond({ + contentType: 'text/plain', + body: 'timeout page reached', }); + page.setRequestInterception(false); }); - const [visibleMessage, audibleMessage] = await page.evaluate(() => { - window.clock.tick(10000); // bring up warning - window.clock.tick(30000); // overrun timeout by 20s, the redirect will hang until resolved - return [ - document.querySelector('.hmrc-timeout-dialog__message').textContent, - document.querySelector('#hmrc-timeout-message').textContent, - ]; - }); - expect(visibleMessage).toBe('For your security, we will sign you out in 0 seconds.'); - expect(audibleMessage).toBe('For your security, we will sign you out in 20 seconds.'); - completeSlowTimeoutRequest(); - await page.waitForNavigation({ timeout: 500 }); - await expect(page).toMatchTextContent('timeout page reached'); - } finally { - await page.setRequestInterception(false); - } + }); + const [visibleMessage, audibleMessage] = await page.evaluate(() => { + window.clock.tick(10000); // bring up warning + window.clock.tick(30000); // overrun timeout by 20s, the redirect will hang until resolved + return [ + document.querySelector('.hmrc-timeout-dialog__message').textContent, + document.querySelector('#hmrc-timeout-message').textContent, + ]; + }); + expect(visibleMessage).toBe('For your security, we will sign you out in 0 seconds.'); + expect(audibleMessage).toBe('For your security, we will sign you out in 20 seconds.'); + completeSlowTimeoutRequest(); + await page.waitForNavigation({ timeout: 500 }); + await expect(page).toMatchTextContent('timeout page reached'); }); it('should display the time remaining as a whole number of seconds', async () => { @@ -410,6 +404,5 @@ describe('/components/timeout-dialog', () => { await expect(background).toShowTimeoutDialog(); expect(await visualCountdownFrom(background)) .toBe('For your security, we will sign you out in 10 seconds.'); - await session.close(); }); }); From a1e119342f003afcda192d48b7172bf62d0e8fe1 Mon Sep 17 00:00:00 2001 From: TimothyFothergill <67912934+TimothyFothergill@users.noreply.github.com> Date: Thu, 12 Dec 2024 14:37:08 +0000 Subject: [PATCH 6/6] PLATUI-3359 roll in timeout changes and bump version --- CHANGELOG.md | 6 +++++ lib/browser-tests/jest-setup.js | 2 +- package-lock.json | 4 ++-- package.json | 2 +- .../timeout-dialog.browser.test.js | 22 +++++++++---------- .../timeout-multiple-tabs.browser.test.js | 6 ++--- 6 files changed, 24 insertions(+), 18 deletions(-) diff --git a/CHANGELOG.md b/CHANGELOG.md index 0a19764b..e66904ea 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -7,6 +7,12 @@ and this project adheres to [Semantic Versioning](http://semver.org/). ## [Unreleased] +## [6.43.0] - 2024-12-12 + +### Changed + +- Changes to `timeout-dialog` tests to reduce discrepancies between hardware when timing out actions + ## [6.42.0] - 2024-11-28 ### Changed diff --git a/lib/browser-tests/jest-setup.js b/lib/browser-tests/jest-setup.js index 5b56f760..78e86a71 100644 --- a/lib/browser-tests/jest-setup.js +++ b/lib/browser-tests/jest-setup.js @@ -5,7 +5,7 @@ beforeEach(async () => { expect.extend({ async toShowTimeoutDialog(page) { try { - await page.waitForSelector('#hmrc-timeout-dialog', { timeout: 500 }); + await page.waitForSelector('#hmrc-timeout-dialog', { timeout: 1000 }); return { message: () => 'expected page not to show timeout dialog', pass: true, diff --git a/package-lock.json b/package-lock.json index 2f818981..60ea81ac 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "hmrc-frontend", - "version": "6.42.0", + "version": "6.43.0", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "hmrc-frontend", - "version": "6.42.0", + "version": "6.43.0", "license": "Apache-2.0", "dependencies": { "accessible-autocomplete": "^3.0.1", diff --git a/package.json b/package.json index 744d35db..fafcf028 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "hmrc-frontend", - "version": "6.42.0", + "version": "6.43.0", "description": "Design patterns for HMRC frontends", "scripts": { "start": "gulp dev", diff --git a/src/components/timeout-dialog/timeout-dialog.browser.test.js b/src/components/timeout-dialog/timeout-dialog.browser.test.js index c894806d..ff2be596 100644 --- a/src/components/timeout-dialog/timeout-dialog.browser.test.js +++ b/src/components/timeout-dialog/timeout-dialog.browser.test.js @@ -62,7 +62,7 @@ describe('/components/timeout-dialog', () => { req.url().endsWith('?keepalive') && req.method() === 'GET' && req.resourceType() === 'xhr' - ), { timeout: 500 }); + ), { timeout: 1000 }); await expect(page).toClick('button', { text: 'Stay signed in' }); await expect(keepAliveRequest).resolves.toBeDefined(); await expect(page).not.toShowTimeoutDialog(); @@ -76,7 +76,7 @@ describe('/components/timeout-dialog', () => { data-sign-out-url="/timeout-reached" `); await clockTickSeconds(page, 900); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); }); @@ -121,7 +121,7 @@ describe('/components/timeout-dialog', () => { await clockTickSeconds(page, 800); await expect(page).toClick('button', { text: 'Stay signed in' }); await clockTickSeconds(page, 900); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); }); @@ -140,7 +140,7 @@ describe('/components/timeout-dialog', () => { await delay(500); await expect(page.url()).not.toMatch('/timeout-reached'); await clockTickSeconds(page, 900); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); }); @@ -153,7 +153,7 @@ describe('/components/timeout-dialog', () => { `); await clockTickSeconds(page, 800); await expect(page).toClick('a', { text: 'Sign out' }); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); }); @@ -166,7 +166,7 @@ describe('/components/timeout-dialog', () => { data-sign-out-url="/signed-out-early" `); await clockTickSeconds(page, 900); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); await renderTimeoutDialog(page, ` data-timeout="900" @@ -177,7 +177,7 @@ describe('/components/timeout-dialog', () => { `); await clockTickSeconds(page, 800); await expect(page).toClick('a', { text: 'Sign out' }); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/signed-out-early'); }); @@ -204,7 +204,7 @@ describe('/components/timeout-dialog', () => { document.getElementById('hmrc-timeout-sign-out-link').click(); window.clock.tick(1000); // to reach timeout while sign out page is still loading }); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/signed-out-early'); }); @@ -254,7 +254,7 @@ describe('/components/timeout-dialog', () => { ]); await clockTickSeconds(page, 1); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); }); @@ -291,7 +291,7 @@ describe('/components/timeout-dialog', () => { ); await clockTickSeconds(page, 1); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page.url()).toMatch('/timeout-reached'); }); }); @@ -326,7 +326,7 @@ describe('/components/timeout-dialog', () => { expect(visibleMessage).toBe('For your security, we will sign you out in 0 seconds.'); expect(audibleMessage).toBe('For your security, we will sign you out in 20 seconds.'); completeSlowTimeoutRequest(); - await page.waitForNavigation({ timeout: 500 }); + await page.waitForNavigation({ timeout: 1000 }); await expect(page).toMatchTextContent('timeout page reached'); }); diff --git a/src/components/timeout-dialog/timeout-multiple-tabs.browser.test.js b/src/components/timeout-dialog/timeout-multiple-tabs.browser.test.js index 8779f877..9fac6377 100644 --- a/src/components/timeout-dialog/timeout-multiple-tabs.browser.test.js +++ b/src/components/timeout-dialog/timeout-multiple-tabs.browser.test.js @@ -17,7 +17,7 @@ describe('multiple tabs open with synchronise tabs feature switch enabled', () = await expect(foregroundPage).toClick('button', { text: 'Stay signed in' }); - await expect(backgroundPage).not.toMatchTextContent('about to be signed out'); + await expect(backgroundPage).not.toMatchTextContent('about to be signed out', { timeout: 5000 }); await session.close(); }); @@ -32,7 +32,7 @@ describe('multiple tabs open with synchronise tabs feature switch enabled', () = const foregroundPage = await session.newPage(); await foregroundPage.goto(examplePreview('page-heading/default')); - await expect(backgroundPage).not.toMatchTextContent('about to be signed out'); + await expect(backgroundPage).not.toMatchTextContent('about to be signed out', { timeout: 5000 }); await session.close(); }); @@ -47,7 +47,7 @@ describe('multiple tabs open with synchronise tabs feature switch enabled', () = const foregroundPage = await session.newPage(); await foregroundPage.goto(examplePreview('timeout-dialog/synchronise-tabs')); - await expect(backgroundPageWithUnsyncedWarnings).toMatchTextContent('about to be signed out'); + await expect(backgroundPageWithUnsyncedWarnings).toMatchTextContent('about to be signed out', { timeout: 5000 }); await session.close(); });