FR: SAML Sign In - Interstitial page to send users directly to IdP login screen

chrome/browser/resources/chromeos/login/screen_gaia_signin.js

Index: chrome/browser/resources/chromeos/login/screen_gaia_signin.js
diff --git a/chrome/browser/resources/chromeos/login/screen_gaia_signin.js b/chrome/browser/resources/chromeos/login/screen_gaia_signin.js
index 05abdf5fd1e912e8064a1794d9ccd77143431a34..321bfd1eac0fb2f4d8a65ef277464c7af6985087 100644
--- a/chrome/browser/resources/chromeos/login/screen_gaia_signin.js
+++ b/chrome/browser/resources/chromeos/login/screen_gaia_signin.js
@@ -27,6 +27,16 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
   // online.
   /** @const */ var IDLE_TIME_CHECK_FREQUENCY = 5 * 1000;
 
+  /**
+   * The modes this screen can be in.
+   * @enum {integer}
+   */
+  var ScreenMode = {
+    DEFAULT: 0,           // Default GAIA login flow.
+    OFFLINE: 1,           // GAIA offline login.
+    SAML_INTERSTITIAL: 2  // Interstitial page before SAML redirection.
+  };
+
   return {
     EXTERNAL_API: [
       'loadAuthExtension',
@@ -44,11 +54,11 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
     gaiaAuthParams_: null,
 
     /**
-     * Whether offline version of Gaia page is used.
-     * @type {boolean}
+     * Current mode of this screen.
+     * @type {integer}
      * @private
      */
-    isOffline_: false,
+    screenMode_: ScreenMode.DEFAULT,
 
     /**
      * Email of the user, which is logging in using offline mode.
@@ -77,7 +87,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * @type {boolean}
      * @private
      */
-    showViewProcessed_: undefined,
+    showViewProcessed_: false,
 
     /**
      * Whether we've processed 'authCompleted' message.
@@ -98,7 +108,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * @type {boolean}
      */
     get closable() {
-      return !!$('pod-row').pods.length || this.isOffline;
+      return !!$('pod-row').pods.length || this.isOffline();
     },
 
     /**
@@ -126,12 +136,14 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
         !this.isSAML();
 
       this.navigation_.refreshVisible =
-        !this.closable && this.isAtTheBeginning();
+        !this.closable && this.isAtTheBeginning() &&
+        this.screenMode_ != ScreenMode.SAML_INTERSTITIAL;
 
       this.navigation_.closeVisible =
         !this.navigation_.refreshVisible &&
         !isWhitelistError &&
-        !this.authCompleted;
+        !this.authCompleted &&
+        this.screenMode_ != ScreenMode.SAML_INTERSTITIAL;
 
       $('login-header-bar').updateUI_();
     },
@@ -174,7 +186,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
         var frameFilter = function(callback) {
           return function(e) {
             var isEventOffline = frame === $('offline-gaia');
-            if (isEventOffline === that.isOffline)
+            if (isEventOffline === that.isOffline())
               callback.call(that, e);
           };
         };
@@ -228,6 +240,39 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
       $('gaia-whitelist-error').addEventListener('linkclick', function() {
         chrome.send('launchHelpApp', [HELP_CANT_ACCESS_ACCOUNT]);
       });
+
+      // Register handlers for the saml interstitial page events.
+      $('saml-interstitial').addEventListener('samlPageNextClicked',
+                                              function() {
+        if (this.screenMode_ != ScreenMode.SAML_INTERSTITIAL)

[xiyuan, 2016/03/28 20:58:40]

nit: seem unnecessary since the event could only be dispatched when screenMode
is ScreenMode.SAML_INTERSTITIAL.

[afakhry, 2016/03/28 23:15:32]

I was just being paranoid! :)
Done.

+          return;
+
+        this.screenMode = ScreenMode.DEFAULT;
+        this.loadGaiaAuthHost_(true /* doSamlRedirect */);
+      }.bind(this));
+      $('saml-interstitial').addEventListener('samlPageChangeAccountClicked',
+                                              function() {
+        if (this.screenMode_ != ScreenMode.SAML_INTERSTITIAL)

[xiyuan, 2016/03/28 20:58:40]

nit: ditto

[afakhry, 2016/03/28 23:15:32]

Done.

+          return;
+
+        this.screenMode = ScreenMode.DEFAULT;
+        this.loadGaiaAuthHost_(false /* doSamlRedirect */);
+      }.bind(this));
+    },
+
+    /**
+     * Loads the authenticator and updates the UI to reflect the loading state.
+     * @param {boolean} doSamlRedirect If the authenticator should do
+     * authentication by automatic redirection to the SAML-based enrollment

[xiyuan, 2016/03/28 20:58:40]

nit: wrong indent

[afakhry, 2016/03/28 23:15:32]

Done.

[xiyuan, 2016/03/29 02:10:49]

What you did in new patch is fine but I meant to indent 4 spaces on 2nd line, :)


i.e.

  * @param {boolean} doSamlRedirect If the authenticator should do
  *     authentication by automatic redirection to the SAML-based

[afakhry, 2016/03/29 03:12:02]

Done.

+     * enterprise domain IdP.
+     */
+    loadGaiaAuthHost_: function(doSamlRedirect) {
+      this.loading = true;
+      this.startLoadingTimer_();
+
+      this.gaiaAuthParams_.doSamlRedirect = doSamlRedirect;
+      this.gaiaAuthHost_.load(cr.login.GaiaAuthHost.AuthMode.DEFAULT,
+                              this.gaiaAuthParams_);
     },
 
     /**
@@ -242,19 +287,36 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * Returns true if offline version of Gaia is used.
      * @type {boolean}
      */
-    get isOffline() {
-      return this.isOffline_;
-    },
+    isOffline: function() {
+      return this.screenMode_ == ScreenMode.OFFLINE;
+    },
+
+    /**
+     * Sets the current screen mode and updates the visible elements
+     * accordingly.
+     * @param {integer} value The screen mode.
+     */
+    set screenMode(value) {
+      this.screenMode_ = value;
+      switch (this.screenMode_) {
+        case ScreenMode.DEFAULT:
+          $('signin-frame').hidden = false;
+          $('offline-gaia').hidden = true;
+          $('saml-interstitial').hidden = true;
+          break;
+        case ScreenMode.OFFLINE:
+          $('signin-frame').hidden = true;
+          $('offline-gaia').hidden = false;
+          $('saml-interstitial').hidden = true;
+          break;
+        case ScreenMode.SAML_INTERSTITIAL:
+          $('signin-frame').hidden = true;
+          $('offline-gaia').hidden = true;
+          $('saml-interstitial').hidden = false;
+          break;
+      }
 

[xiyuan, 2016/03/28 20:58:40]

Should we call this.updateControlsState() since |screenMode_| is relevant to
control states?

[afakhry, 2016/03/28 23:15:32]

Done.

-    /**
-     * Sets whether offline version of Gaia is used.
-     * @param {boolean} value Whether offline version of Gaia is used.
-     */
-    set isOffline(value) {
-      this.isOffline_ = !!value;
-      $('signin-frame').hidden = this.isOffline_;
-      $('offline-gaia').hidden = !this.isOffline_;
-      chrome.send('updateOfflineLogin', [value]);
+      chrome.send('updateOfflineLogin', [this.isOffline()]);
     },
 
     /**
@@ -287,8 +349,10 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
       if (shouldMonitor) {
         // If we're not using the offline login page or we're already
         // monitoring, then we don't need to do anything.
-        if (!self.isOffline || self.tryToGoToOnlineLoginPageCallbackId_ !== -1)
+        if (!self.isOffline() ||
+            self.tryToGoToOnlineLoginPageCallbackId_ !== -1) {
           return;
+        }
 
         self.mostRecentUserActivity_ = Date.now();
         ACTIVITY_EVENTS.forEach(function(event) {
@@ -298,7 +362,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
         self.tryToGoToOnlineLoginPageCallbackId_ = setInterval(function() {
           // If we're not in the offline page or the signin page, then we want
           // to terminate monitoring.
-          if (!self.isOffline ||
+          if (!self.isOffline() ||
               Oobe.getInstance().currentScreen.id != 'gaia-signin') {
             self.monitorOfflineIdle(false);
             return;
@@ -333,9 +397,10 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      */
     showLoadingUI_: function(show) {
       $('gaia-loading').hidden = !show;
-      this.getSigninFrame_().hidden = show;
+      if (this.screenMode_ != ScreenMode.DEFAULT)
+        this.getSigninFrame_().hidden = show;
+      this.getSigninFrame_().classList.toggle('show', !show);
       this.classList.toggle('loading', show);
-      $('signin-frame').classList.remove('show');
       this.updateControlsState();
     },
 
@@ -422,6 +487,8 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      *                      page.
      */
     onBeforeShow: function(data) {
+      this.screenMode = ScreenMode.DEFAULT;
+      this.loading = true;
       chrome.send('loginUIStateChanged', ['gaia-signin', true]);
       $('progress-dots').hidden = true;
       $('login-header-bar').signinUIState = SIGNIN_UI_STATE.GAIA_SIGNIN;
@@ -431,8 +498,6 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
         chrome.send('loginVisible', ['gaia-loading']);
       });
 
-      this.classList.toggle('loading', this.loading);
-
       // Button header is always visible when sign in is presented.
       // Header is hidden once GAIA reports on successful sign in.
       Oobe.getInstance().headerHidden = false;
@@ -442,7 +507,14 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
     },
 
     getSigninFrame_: function() {
-      return this.isOffline ? $('offline-gaia') : $('signin-frame');
+      switch (this.screenMode_) {
+        case ScreenMode.DEFAULT:
+          return $('signin-frame');
+        case ScreenMode.OFFLINE:
+          return $('offline-gaia');
+        case ScreenMode.SAML_INTERSTITIAL:
+          return $('saml-interstitial');
+      }
     },
 
     focusSigninFrame: function() {
@@ -469,14 +541,11 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * @private
      */
     loadAuthExtension: function(data) {
-      this.isOffline = data.useOffline;
+      this.screenMode = data.screenMode;
       this.email = '';
       this.authCompleted_ = false;
       this.lastBackMessageValue_ = false;
-
-      // Reset SAML
-      this.classList.toggle('full-width', false);
-      this.samlPasswordConfirmAttempt_ = 0;
+      $('saml-interstitial').domain = data.enterpriseDomain;

[xiyuan, 2016/03/28 20:58:40]

nit: Move this into "case ScreenMode.SAML_INTERSTITIAL:" switch case?

[afakhry, 2016/03/28 23:15:32]

Done.

 
       this.updateAuthExtension_(data);
 
@@ -487,10 +556,9 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
           params[name] = data[name];
       }
 
-      if (data.enterpriseInfoMessage)
-        params.enterpriseInfoMessage = data.enterpriseInfoMessage;
-
       params.isNewGaiaFlow = true;
+      params.doSamlRedirect =
+        (this.screenMode_ == ScreenMode.SAML_INTERSTITIAL);

[xiyuan, 2016/03/28 20:58:40]

nit: wrong indent?

[afakhry, 2016/03/28 23:15:32]

Done.

 
       // Screen size could have been changed because of 'full-width' classes.
       if (Oobe.getInstance().currentScreen === this)
@@ -499,14 +567,20 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
       if (data.forceReload ||
           JSON.stringify(this.gaiaAuthParams_) != JSON.stringify(params)) {
         this.gaiaAuthParams_ = params;
-        this.loading = true;
-        this.startLoadingTimer_();
 
-        if (this.isOffline) {
-          this.loadOffline(params);
-        } else {
-          this.gaiaAuthHost_.load(cr.login.GaiaAuthHost.AuthMode.DEFAULT,
-                                  params);
+        switch (this.screenMode_) {
+          case ScreenMode.DEFAULT:
+            this.loadGaiaAuthHost_(false /* doSamlRedirect */);
+            break;
+
+          case ScreenMode.OFFLINE:
+            this.loadOffline(params);
+            break;
+
+          case ScreenMode.SAML_INTERSTITIAL:
+            if (this.loading)
+              this.loading = false;
+            break;
         }
       }
       this.updateControlsState();
@@ -524,7 +598,9 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
 
       this.updateControlsState();
 
+      // Reset SAML
       this.classList.toggle('full-width', false);
+      this.samlPasswordConfirmAttempt_ = 0;
       if (Oobe.getInstance().currentScreen === this)
         Oobe.getInstance().updateScreenSize(this);
     },
@@ -552,6 +628,9 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
     onAuthFlowChange_: function() {
       var isSAML = this.isSAML();
 
+      if (isSAML && this.loading)

[xiyuan, 2016/03/28 20:58:40]

Think we should fix this in authenticator.js. That is, if 'ready' is not
dispatched when Authenticator.prototype.onAuthPageLoaded_ is called, dispatch it
there.

[afakhry, 2016/03/28 23:15:32]

Done.

+        this.onAuthReady_();
+
       this.classList.toggle('full-width', isSAML);
       $('saml-notice-container').hidden = !isSAML;
 
@@ -567,7 +646,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * @private
      */
     onAuthReady_: function() {
-      showViewProcessed_ = false;
+      this.showViewProcessed_ = false;
       this.startLoadAnimationGuardTimer_();
       this.clearLoadingTimer_();
       this.loading = false;
@@ -608,12 +687,12 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * @private
      */
     onShowView_: function(e) {
-      if (showViewProcessed_)
+      if (this.showViewProcessed_)
         return;
 
-      showViewProcessed_ = true;
+      this.showViewProcessed_ = true;
       this.clearLoadAnimationGuardTimer_();
-      $('signin-frame').classList.add('show');
+      this.getSigninFrame_().classList.toggle('show', true);
       this.onLoginUIVisible_();
     },
 
@@ -804,7 +883,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
     reset: function(takeFocus, forceOnline) {
       // Reload and show the sign-in UI if needed.
       if (takeFocus) {
-        if (!forceOnline && this.isOffline) {
+        if (!forceOnline && this.isOffline()) {
           // Show 'Cancel' button to allow user to return to the main screen
           // (e.g. this makes sense when connection is back).
           Oobe.getInstance().headerHidden = false;
@@ -820,7 +899,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * Reloads extension frame.
      */
     doReload: function() {
-      if (this.isOffline)
+      if (this.isOffline())
         return;
       this.gaiaAuthHost_.reload();
       this.loading = true;
@@ -836,7 +915,7 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * @param {HTMLElement} content Content to show in bubble.
      */
     showErrorBubble: function(loginAttempts, error) {
-      if (this.isOffline) {
+      if (this.isOffline()) {
         $('add-user-button').hidden = true;
         // Reload offline version of the sign-in extension, which will show
         // error itself.
@@ -890,9 +969,10 @@ login.createScreen('GaiaSigninScreen', 'gaia-signin', function() {
      * should switch to the password screen with error.
      */
     loadOffline: function(params) {
+      this.loading = true;
+      this.startLoadingTimer_();
       var offlineLogin = $('offline-gaia');
-      if ('enterpriseInfoMessage' in params)
-        offlineLogin.enterpriseInfo = params['enterpriseInfoMessage'];
+      offlineLogin.showEnterpriseMessage = !!('enterpriseDomain' in params);
       if ('emailDomain' in params)
         offlineLogin.emailDomain = '@' + params['emailDomain'];
       offlineLogin.setEmail(params.email);