fix(modal): Autofocus corrects the second time that the modal is open

element with autofocus attribute when the modal is reopened

Fixes angular-ui#2802

misc/test-lib/helpers.js

@@ -13,6 +13,13 @@ beforeEach(function() {
       var element = angular.element(this.actual);
       return element.hasClass('ng-hide') ||
         element.css('display') == 'none';
+    },
+    toHaveFocus: function () {
+      this.message = function () {
+        return 'Expected \'' + angular.mock.dump(this.actual) + '\' to have focus';
+      };
+
+      return document.activeElement === this.actual[0];
     }
   });
 });

src/modal/modal.js

@@ -119,6 +119,7 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.transition'])
           // trigger CSS transitions
           scope.animate = true;
 
+          var inputsWithAutofocus = element[0].querySelectorAll('[autofocus]');
           /**
            * Auto-focusing of a freshly-opened modal element causes any child elements
            * with the autofocus attribute to lose focus. This is an issue on touch
@@ -127,7 +128,9 @@ angular.module('ui.bootstrap.modal', ['ui.bootstrap.transition'])
            * the onscreen keyboard. Fixed by updated the focusing logic to only autofocus
            * the modal element if the modal does not contain an autofocus element.
            */
-          if (!element[0].querySelectorAll('[autofocus]').length) {
+          if (inputsWithAutofocus.length) {
+            inputsWithAutofocus[0].focus();
+          } else {
             element[0].focus();
           }
 

src/modal/test/modal.spec.js

@@ -240,6 +240,22 @@ describe('$modal', function () {
       expect(modal.opened).toBeRejectedWith(false);
     });
 
+    it('should focus on the element that has autofocus attribute when the modal is open/reopen', function () {
+      function openAndCloseModalWithAutofocusElement() {
+        var modal = open({template: '<div><input type="text" id="auto-focus-element" autofocus></div>'});
+
+        waitForBackdropAnimation();
+
+        expect(angular.element('#auto-focus-element')).toHaveFocus();
+
+        close(modal, 'closed ok');
+
+        expect(modal.result).toBeResolvedWith('closed ok');
+      }
+
+      openAndCloseModalWithAutofocusElement();
+      openAndCloseModalWithAutofocusElement();
+    });
   });
 
   describe('default options can be changed in a provider', function () {