fix ''Invalid calling object' error appears in IE11 when active eleme…

…nt is changed' (close #768). Bump version (#772)

* fix ''Invalid calling object' error appears in IE11 when active element is changed' (close #768)

* update test

* move comment to domUtils.getActiveElement, change calls 'document.activeElement' to 'domUtils.getActiveElement(document)'

package.json

@@ -1,7 +1,7 @@
 {
   "name": "testcafe-hammerhead",
   "description": "A powerful web-proxy used as a core for the TestCafe testing framework (https://github.com/DevExpress/testcafe).",
-  "version": "9.3.3",
+  "version": "9.3.4",
   "homepage": "https://github.com/DevExpress/testcafe-hammerhead",
   "bugs": {
     "url": "https://github.com/DevExpress/testcafe-hammerhead/issues"

src/client/sandbox/event/focus-blur.js

@@ -181,7 +181,11 @@ export default class FocusBlurSandbox extends SandboxBase {
         this.activeWindowTracker.attach(window);
         this.topWindow = domUtils.isCrossDomainWindows(window, window.top) ? window : window.top;
 
-        this.listeners.addInternalEventListener(window, ['focus', 'blur'], () => this._onChangeActiveElement(this.document.activeElement));
+        this.listeners.addInternalEventListener(window, ['focus', 'blur'], () => {
+            var activeElement = domUtils.getActiveElement(this.document);
+
+            this._onChangeActiveElement(activeElement);
+        });
     }
 
     _callFocusCallback (callback, el) {
@@ -239,7 +243,7 @@ export default class FocusBlurSandbox extends SandboxBase {
 
                 // NOTE: If we call focus for an unfocusable element (like 'div' or 'image') in iframe, we should
                 // specify document.active for this iframe manually, so we call focus without handlers.
-                if (isElementInIframe && iframeElement && this.topWindow.document.activeElement !== iframeElement)
+                if (isElementInIframe && iframeElement && domUtils.getActiveElement(this.topWindow.document) !== iframeElement)
                     this._raiseEvent(iframeElement, 'focus', () => this._callFocusCallback(callback, el), true, isAsync);
                 else
                     this._callFocusCallback(callback, el);

src/client/utils/dom.js

@@ -80,9 +80,10 @@ function hasClassFallback (el, className) {
 }
 
 export function getActiveElement (currentDocument) {
+    // NOTE: Sometimes document.activeElement returns an empty object or null (IE11).
+    // https://github.com/DevExpress/testcafe-hammerhead/issues/768
     var doc = currentDocument || document;
 
-
     return isDomElement(doc.activeElement) ? doc.activeElement : doc.body;
 }
 

test/client/fixtures/sandbox/event/focus-blur-change-test.js

@@ -1042,3 +1042,42 @@ asyncTest('focus() must not raise the event if the element is in an invisible if
 
     document.body.appendChild(iframe);
 });
+
+asyncTest('should correctly handle the case when document.activeElement is null or an empty object (GH-768)', function () {
+    expect(1);
+
+    var iframe       = document.createElement('iframe');
+    var errorHandler = function () {
+        ok(false, 'error is reproduced');
+    };
+
+    window.addEventListener('error', errorHandler);
+
+    iframe.id = 'test_unique_id_02pog0ra5';
+    window.QUnitGlobals.waitForIframe(iframe)
+        .then(function () {
+            var iframeDocument = iframe.contentDocument;
+            var iframeWindow   = iframe.contentWindow;
+            var div            = iframeDocument.createElement('div');
+            var innerDiv       = iframeDocument.createElement('div');
+
+            iframeWindow.addEventListener('focus', function () {
+                iframe.parentNode.removeChild(iframe);
+                window.removeEventListener('error', errorHandler);
+                ok(true, 'focus handler is called');
+
+                start();
+            }, true);
+
+            div.id = 'div';
+            innerDiv.id = 'innerDiv';
+            innerDiv.tabIndex = 0;
+            div.appendChild(innerDiv);
+            iframeDocument.body.appendChild(div);
+
+            innerDiv.focus();
+            div.innerHTML = '<span>Replaced</span>';
+        });
+
+    document.body.appendChild(iframe);
+});