Fix the okta-post-message reponse handling for IE10/11 (#105)

* Fix the okta-post-message response handling for IE10/11
okta · Apr 5, 2018 · 59aa4ff · 59aa4ff
1 parent c4906a2
commit 59aa4ff
Show file tree

Hide file tree

Showing 4 changed files with 105 additions and 1 deletion.
diff --git a/lib/oauthUtil.js b/lib/oauthUtil.js
@@ -43,7 +43,17 @@ function loadPopup(src, options) {
   var title = options.popupTitle || 'External Identity Provider User Authentication';
   var appearance = 'toolbar=no, scrollbars=yes, resizable=yes, ' +
     'top=100, left=500, width=600, height=600';
-  return window.open(src, title, appearance);
+
+  if (util.isIE11OrLess()) {
+    // IE<=11 doesn't fully support postMessage at time of writting.
+    // the following simple solution happened to solve the issue
+    // without adding another proxy layer which makes flow more complecated.
+    var winEl = window.open('/', title, appearance);
+    winEl.location.href = src;
+    return winEl;
+  } else {
+    return window.open(src, title, appearance);
+  }
 }
 
 function getWellKnown(sdk, issuer) {

diff --git a/lib/util.js b/lib/util.js
@@ -240,3 +240,7 @@ util.removeTrailingSlash = function(path) {
   }
   return path;
 };
+
+util.isIE11OrLess = function() {
+  return !!document.documentMode && document.documentMode <= 11;
+};
diff --git a/test/spec/oauthUtil.js b/test/spec/oauthUtil.js
@@ -1,6 +1,7 @@
 define(function(require) {
   var OktaAuth = require('OktaAuth');
   var oauthUtil = require('../../lib/oauthUtil');
+  var libUtil = require('../../lib/util');
   var oauthUtilHelpers = require('../util/oauthUtil');
   var util = require('../util/util');
   var wellKnown = require('../xhr/well-known');
@@ -493,4 +494,65 @@ define(function(require) {
       });
     });
   });
+
+  describe('loadPopup', function() {
+    it('popups window with full src url directly when none-IE', function () {
+      var mockElem = {};
+      spyOn(libUtil, 'isIE11OrLess').and.returnValue(false);
+      spyOn(window, 'open').and.returnValue(mockElem);
+
+      var winEl = oauthUtil.loadPopup('/path/to/foo', {
+        popupTitle: 'Hello Okta'
+      });
+
+      expect(winEl).toBe(mockElem);
+      expect(window.open.calls.count()).toBe(1);
+      expect(window.open).toHaveBeenCalledWith(
+        '/path/to/foo',
+        'Hello Okta',
+        'toolbar=no, scrollbars=yes, resizable=yes, top=100, left=500, width=600, height=600'
+      );
+    });
+
+    it('popups window with full src url directly and default title', function () {
+      var mockElem = {};
+      spyOn(libUtil, 'isIE11OrLess').and.returnValue(false);
+      spyOn(window, 'open').and.returnValue(mockElem);
+
+      var winEl = oauthUtil.loadPopup('/path/to/foo', {});
+
+      expect(winEl).toBe(mockElem);
+      expect(window.open.calls.count()).toBe(1);
+      expect(window.open).toHaveBeenCalledWith(
+        '/path/to/foo',
+        'External Identity Provider User Authentication',
+        'toolbar=no, scrollbars=yes, resizable=yes, top=100, left=500, width=600, height=600'
+      );
+    });
+
+    it('popups window with full src url directly when IE mode', function () {
+      var mockElem = {
+        location: {
+
+        }
+      };
+      spyOn(libUtil, 'isIE11OrLess').and.returnValue(true);
+      spyOn(window, 'open').and.returnValue(mockElem);
+
+      var winEl = oauthUtil.loadPopup('/path/to/foo', {
+        popupTitle: 'Hello Okta'
+      });
+
+      expect(winEl).toBe(mockElem);
+      expect(window.open.calls.count()).toBe(1);
+      expect(window.open).toHaveBeenCalledWith(
+        '/',
+        'Hello Okta',
+        'toolbar=no, scrollbars=yes, resizable=yes, top=100, left=500, width=600, height=600'
+      );
+      expect(winEl.location.href).toBe('/path/to/foo');
+    });
+
+  });
+
 });
diff --git a/test/spec/util.js b/test/spec/util.js
@@ -62,5 +62,33 @@ define(function(require) {
         }));
       });
     });
+
+    describe('isIE11OrLess', function() {
+      it('returns false when document doesnot have documentMode', function() {
+        expect(document.documentMode).toBeUndefined();
+        expect(util.isIE11OrLess()).toBe(false);
+      });
+
+      it('returns true documentMode is 11', function() {
+        document.documentMode = 11;
+        expect(util.isIE11OrLess()).toBe(true);
+      });
+
+      it('returns true documentMode is 10', function() {
+        document.documentMode = 10;
+        expect(util.isIE11OrLess()).toBe(true);
+      });
+
+      it('returns true documentMode is 9', function() {
+        document.documentMode = 9;
+        expect(util.isIE11OrLess()).toBe(true);
+      });
+
+      it('returns true documentMode is 8', function() {
+        document.documentMode = 8;
+        expect(util.isIE11OrLess()).toBe(true);
+      });
+    });
+
   });
 });