diff --git a/app/assets/javascripts/timeoutPopup.js b/app/assets/javascripts/timeoutPopup.js index be64d7d22..f8b5b4cee 100644 --- a/app/assets/javascripts/timeoutPopup.js +++ b/app/assets/javascripts/timeoutPopup.js @@ -1,25 +1,23 @@ (function(global) { "use strict"; + const sessionTimer = document.getElementById("sessionTimer"); - setTimeout(function() { - var timeTillSessionEnd = new Date().getTime() + (5 * 60 * 1000); - var x = setInterval(function() { - var now = new Date().getTime(); - var difference = timeTillSessionEnd - now; - var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60)); - var seconds = Math.floor((difference % (1000 * 60)) / 1000); - document.getElementById("timeLeft").innerHTML = + minutes + "m " + seconds + "s"; - showTimer(); - document.getElementById("logOutTimer").addEventListener("click", logoutUser); - document.getElementById("extendSessionTimer").addEventListener("click", extendSession); - if (difference < 0) { - clearInterval(x); - closeTimer(); - logoutUser(); - } - }, 1000); - }, 25 * 60 * 1000); + function checkTimer(timeTillSessionEnd) { + var now = new Date().getTime(); + var difference = timeTillSessionEnd - now; + var minutes = Math.floor((difference % (1000 * 60 * 60)) / (1000 * 60)); + var seconds = Math.floor((difference % (1000 * 60)) / 1000); + document.getElementById("timeLeft").innerHTML = + minutes + "m " + seconds + "s"; + showTimer(); + document.getElementById("logOutTimer").addEventListener("click", logoutUser); + document.getElementById("extendSessionTimer").addEventListener("click", extendSession); + if (difference < 0) { + clearInterval(x); + closeTimer(); + logoutUser(); + } + } function logoutUser() { window.location.href = '/sign-out'; @@ -36,9 +34,17 @@ function closeTimer() { sessionTimer.close(); } - })(window); - - - + global.GOVUK.Modules.TimeoutPopup = function() { + setTimeout(function() { + var timeTillSessionEnd = new Date().getTime() + (5 * 60 * 1000); + var x = setInterval(checkTimer, 1000, timeTillSessionEnd); + }, 25 * 60 * 1000); + }; + global.GOVUK.Modules.TimeoutPopup.checkTimer = checkTimer; + global.GOVUK.Modules.TimeoutPopup.logoutUser = logoutUser; + global.GOVUK.Modules.TimeoutPopup.extendSession = extendSession; + global.GOVUK.Modules.TimeoutPopup.showTimer = showTimer; + global.GOVUK.Modules.TimeoutPopup.closeTimer = closeTimer; +})(window); diff --git a/tests/javascripts/timeoutPopup.test.js b/tests/javascripts/timeoutPopup.test.js index 74373de5a..46d88b7d2 100644 --- a/tests/javascripts/timeoutPopup.test.js +++ b/tests/javascripts/timeoutPopup.test.js @@ -1,18 +1,97 @@ -const sessionTimerWrapper = require('../../app/assets/javascripts/timeoutPopup.js'); +beforeAll(() => { + jest.useFakeTimers(); + jest.spyOn(global, 'setTimeout'); + + document.body.innerHTML = ` + +
+
+

+ Your session will end soon. + Please choose to extend your session or sign out. Your session will expire in 5 minutes or less. +

+
+

You have been inactive for too long. + Your session will expire in . +

+
+ +
+
+
+ ` + + const sessionTimerModule = require('../../app/assets/javascripts/timeoutPopup.js'); + window.GOVUK.modules.start(); +}); + +afterAll(() => { + jest.useRealTimers(); + document.body.innerHTML = ''; +}); -describe('Test popup process', () => { - beforeEach(() => { - jest.useFakeTimers(); - }); - - afterEach(() => { - jest.useRealTimers(); - }); - - it('Test timers work', () => { +describe('When an authenticated user', () => { + test('does whatever', () => { jest.runAllTimers(); }); -}); +}); + +describe('The session timer ', () => { + test('logoutUser method logs the user out', () => { + const logoutUserMethod = window.GOVUK.Modules.TimeoutPopup.logoutUser; + + expect(window.location.href).toEqual(expect.not.stringContaining('/sign-out')); + + logoutUserMethod(); + + expect(window.location.href).toEqual(expect.stringContaining('/sign-out')); + }); + + test('extendSession method reloads the page', () => { + const windowReload = jest.spyOn(window.location, 'reload'); + const extendSessionMethod = window.GOVUK.Modules.TimeoutPopup.extendSession; + + extendSessionMethod(); + + expect(windowReload).toHaveBeenCalled(); + }); + + test('showTimer method shows the session timer modal', () => { + const sessionTimer = document.getElementById("sessionTimer"); + sessionTimer.showModal = jest.fn(); + + const showTimerMock = jest.spyOn(sessionTimer, 'showModal'); + + window.GOVUK.Modules.TimeoutPopup.showTimer(); + + expect(showTimerMock).toHaveBeenCalled(); + }); + + test('closeTimer method closes the session timer modal', () => { + const sessionTimer = document.getElementById("sessionTimer"); + sessionTimer.close = jest.fn(); + + const closeTimerMock = jest.spyOn(sessionTimer, 'close'); + + window.GOVUK.Modules.TimeoutPopup.closeTimer(); + + expect(closeTimerMock).toHaveBeenCalled(); + }); +});