diff --git a/src/components/input/input.js b/src/components/input/input.js index f904a847ab..66e64b81a7 100644 --- a/src/components/input/input.js +++ b/src/components/input/input.js @@ -776,7 +776,7 @@ function placeholderDirective($compile) { * * */ -function mdSelectOnFocusDirective($timeout) { +function mdSelectOnFocusDirective($document, $timeout) { return { restrict: 'A', @@ -802,9 +802,14 @@ function mdSelectOnFocusDirective($timeout) { preventMouseUp = true; $timeout(function() { + // Use HTMLInputElement#select to fix firefox select issues. // The debounce is here for Edge's sake, otherwise the selection doesn't work. - element[0].select(); + // Since focus may already have been lost on the input (and because `select()` + // will re-focus), make sure the element is still active before applying. + if($document[0].activeElement === element[0]) { + element[0].select(); + } // This should be reset from inside the `focus`, because the event might // have originated from something different than a click, e.g. a keyboard event. diff --git a/src/components/input/input.spec.js b/src/components/input/input.spec.js index a561604813..7a72ee1799 100644 --- a/src/components/input/input.spec.js +++ b/src/components/input/input.spec.js @@ -659,6 +659,23 @@ describe('md-input-container directive', function() { } })); + it('should not refocus the input after focus is lost', inject(function($document, $timeout) { + var wrapper = $compile('
')($rootScope), + input1 = angular.element(wrapper[0].childNodes[0]), + input2 = angular.element(wrapper[0].childNodes[1]); + $document[0].body.appendChild(wrapper[0]); + + input1.focus(); + input1.triggerHandler('focus'); + input2.focus(); + input2.triggerHandler('focus'); + + $timeout.flush(); + expect(input2).toBeFocused(); + + wrapper.remove(); + })); + describe('Textarea auto-sizing', function() { var ngElement, element, ngTextarea, textarea, scope, parentElement;