7538 - Validate cookie when restoring the app from the bfcache (#7575)

Ticket: #7538

This commit: 
- When the app is restored from the bfcache, the session is validated once more to make sure the user doesn't get stuck in an impossible state.

admin/src/js/services/db.js

@@ -22,6 +22,7 @@ angular.module('inboxServices').factory('DB',
     const isOnlineOnly = Session.isOnlineOnly();
 
     const getUsername = remote => {
+      Session.checkCurrentSession();
       const username = Session.userCtx().name;
       if (!remote) {
         return username;

admin/src/js/services/session.js

@@ -112,7 +112,7 @@ const _ = require('lodash/core');
 
         navigateToLogin: navigateToLogin,
 
-        init: checkCurrentSession,
+        checkCurrentSession: checkCurrentSession,
 
         /**
          * Returns true if the logged in user has the db or national admin role.

admin/tests/unit/services/db.js

@@ -37,7 +37,8 @@ describe('DB service', () => {
       });
       $provide.value('Session', {
         userCtx: userCtx,
-        isOnlineOnly: isOnlineOnly
+        isOnlineOnly: isOnlineOnly,
+        checkCurrentSession: sinon.stub(),
       } );
       $provide.value('Location', Location);
     });

admin/tests/unit/services/session.js

@@ -69,7 +69,7 @@ describe('Session service', function() {
     $httpBackend
       .expect('DELETE', '/_session')
       .respond(200);
-    service.init();
+    service.checkCurrentSession();
     $httpBackend.flush();
     chai.expect(location.href).to.equal('/DB_NAME/login?redirect=CURRENT_URL');
     chai.expect(ipCookieRemove.args[0][0]).to.equal('userCtx');
@@ -82,7 +82,7 @@ describe('Session service', function() {
     $httpBackend
       .expect('GET', '/_session')
       .respond(401);
-    service.init();
+    service.checkCurrentSession();
     $httpBackend.flush();
     chai.expect(ipCookieRemove.args[0][0]).to.equal('userCtx');
     done();
@@ -93,7 +93,7 @@ describe('Session service', function() {
     $httpBackend
       .expect('GET', '/_session')
       .respond(0);
-    service.init();
+    service.checkCurrentSession();
     $httpBackend.flush();
     chai.expect(ipCookieRemove.callCount).to.equal(0);
     done();
@@ -110,7 +110,7 @@ describe('Session service', function() {
     $httpBackend
       .expect('DELETE', '/_session')
       .respond(200);
-    service.init();
+    service.checkCurrentSession();
     $httpBackend.flush();
     chai.expect(location.href).to.equal(`/DB_NAME/login?redirect=CURRENT_URL&username=${expected.name}`);
     chai.expect(ipCookieRemove.args[0][0]).to.equal('userCtx');
@@ -122,7 +122,7 @@ describe('Session service', function() {
     $httpBackend
       .expect('GET', '/_session')
       .respond(200, { userCtx: { name: 'bryan' } });
-    service.init();
+    service.checkCurrentSession();
     $httpBackend.flush();
     chai.expect(ipCookieRemove.callCount).to.equal(0);
     done();

admin/tests/unit/services/telemetry.js

@@ -54,6 +54,7 @@ describe('Telemetry service', () => {
         userCtx: () => {
           return { name: 'greg' };
         },
+        checkCurrentSession: sinon.stub(),
       });
     });
     inject(_Telemetry_ => {

admin/tests/utils.js

@@ -63,7 +63,10 @@ window.KarmaUtils = {
       $provide.value('ContactViewModelGenerator', () => {});
       $provide.value('ReportViewModelGenerator', () => {});
       $provide.value('LiveList', mockLiveList);
-      $provide.value('Session', { userCtx: sinon.stub().returns({}) });
+      $provide.value('Session', {
+        userCtx: sinon.stub().returns({}),
+        checkCurrentSession: sinon.stub(),
+      });
     });
   }
 };

api/src/public/login/script.js

@@ -213,3 +213,9 @@ document.addEventListener('DOMContentLoaded', function() {
     }
   }
 });
+
+window.addEventListener('pageshow', (event) => {
+  if (event.persisted) {
+    checkSession();
+  }
+});

tests/e2e/navigation/bfcache.wdio-spec.js

@@ -0,0 +1,52 @@
+const commonPage = require('../../page-objects/common/common.wdio.page');
+const loginPage = require('../../page-objects/login/login.wdio.page');
+const usersAdminPage = require('../../page-objects/admin/user.wdio.page');
+const auth = require('../../auth')();
+
+describe('bfcache', async () => {
+  beforeEach(async () => {
+    await loginPage.login({
+      username: auth.username,
+      password: auth.password,
+      createUser: true,
+    });
+  });
+
+  afterEach(async () => {
+    await browser.deleteCookies();
+    await browser.url('/');
+  });
+
+  describe('login page', () => {
+    it('should redirect to the app page when session is valid', async () => {
+      await commonPage.goToBase();
+      expect(await browser.getUrl()).to.contain('/messages');
+      await browser.back();
+      await browser.waitUntil(async () => (await browser.getUrl()).includes('/messages'));
+    });
+  });
+
+  describe('webapp', () => {
+    it('should redirect to login page when session is expired', async () => {
+      await commonPage.goToPeople();
+      await browser.deleteCookies('AuthSession');
+      await commonPage.goToMessages();
+      const redirectToLoginBtn = await $('#session-expired .btn.submit.btn-primary');
+      await redirectToLoginBtn.click();
+      expect(await browser.getUrl()).to.contain('/login?redirect=');
+      await browser.back();
+      await browser.waitUntil(async () => (await browser.getUrl()).includes('/login?redirect='));
+    });
+  });
+
+  describe('admin app', () => {
+    it('should redirect to login page when session is expired', async () => {
+      await usersAdminPage.goToAdminUser();
+      await browser.deleteCookies('AuthSession');
+      await usersAdminPage.goToAdminUpgrade();
+      expect(await browser.getUrl()).to.contain('/login?redirect=');
+      await browser.back();
+      await browser.waitUntil(async () => (await browser.getUrl()).includes('/login?redirect='));
+    });
+  });
+});

tests/page-objects/admin/user.wdio.page.js

@@ -26,6 +26,10 @@ const goToAdminUser = async () => {
   await browser.url('/admin/#/users');
 };
 
+const goToAdminUpgrade = async () => {
+  await browser.url('/admin/#/upgrade');
+};
+
 const openAddUserDialog = async () => {
   await (await addUserButton()).waitForDisplayed();
   await (await addUserButton()).click();
@@ -40,7 +44,7 @@ const closeUserDialog = async () => {
   await (await addUserDialog()).waitForDisplayed({ reverse: true });
 };
 
-const inputAddUserFields = async (username, fullname, role, place, associatedContact, password, 
+const inputAddUserFields = async (username, fullname, role, place, associatedContact, password,
   confirmPassword = password) => {
   await (await userName()).addValue(username);
   await (await userFullName()).addValue(fullname);
@@ -53,7 +57,7 @@ const inputAddUserFields = async (username, fullname, role, place, associatedCon
   if (!_.isEmpty(associatedContact)) {
     await selectContact(associatedContact);
   }
-  
+
   await (await userPassword()).addValue(password);
   await (await userConfirmPassword()).addValue(confirmPassword);
 };
@@ -117,6 +121,7 @@ const getContactErrorText = async () => {
 
 module.exports = {
   goToAdminUser,
+  goToAdminUpgrade,
   openAddUserDialog,
   closeUserDialog,
   inputAddUserFields,

tests/wdio.conf.js

@@ -40,7 +40,7 @@ const baseConfig = {
   // will be called from there.
   //
   specs: [
-    './tests/e2e/**/*.wdio-spec.js'
+    './tests/e2e/**/*.wdio-spec.js',
   ],
   // Patterns to exclude.
   exclude: [

webapp/src/ts/app.component.ts

@@ -675,6 +675,13 @@ export class AppComponent implements OnInit {
     this.changesService.killWatchers();
   }
 
+  @HostListener('window:pageshow', ['$event'])
+  private pageshow(event) {
+    if (event.persisted) {
+      this.sessionService.check();
+    }
+  }
+
   private async initAnalyticsModules() {
     try {
       const modules = await this.analyticsModulesService.get();

webapp/src/ts/services/session.service.ts

@@ -55,7 +55,12 @@ export class SessionService {
    */
   userCtx () {
     if (!this.userCtxCookieValue) {
-      this.userCtxCookieValue = JSON.parse(this.cookieService.get(COOKIE_NAME));
+      try {
+        this.userCtxCookieValue = JSON.parse(this.cookieService.get(COOKIE_NAME));
+      } catch(error) {
+        console.error('Cookie parsing error', error);
+        this.userCtxCookieValue = null;
+      }
     }
 
     return this.userCtxCookieValue;
@@ -68,11 +73,18 @@ export class SessionService {
       .catch(this.logout);
   }
 
+  public check() {
+    if (!this.cookieService.check(COOKIE_NAME)) {
+      this.navigateToLogin();
+    }
+  }
+
   init () {
     const userCtx = this.userCtx();
     if (!userCtx || !userCtx.name) {
       return this.logout();
     }
+
     return this.http
       .get<{ userCtx: { name:string; roles:string[] } }>('/_session', { responseType: 'json' })
       .toPromise()