fix(select): focus should behave as same as normal inputs

Fixes angular#6122 Closes angular#6132
devversion · Dec 9, 2015 · 32c17e7 · 32c17e7
1 parent 190d304
commit 32c17e7
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 9 deletions.
diff --git a/src/components/select/select.js b/src/components/select/select.js
@@ -187,12 +187,6 @@ function SelectDirective($mdSelect, $mdUtil, $mdTheming, $mdAria, $compile, $par
     return function postLink(scope, element, attr, ctrls) {
       var isDisabled, ariaLabelBase;
 
-      // Remove event ngModel's blur listener for touched and untouched
-      // we will do it ourself.
-      $mdUtil.nextTick(function() {
-        element.off('blur');
-      });
-
       var containerCtrl = ctrls[0];
       var mdSelectCtrl = ctrls[1];
       var ngModelCtrl = ctrls[2];
@@ -283,7 +277,8 @@ function SelectDirective($mdSelect, $mdUtil, $mdTheming, $mdAria, $compile, $par
               containerCtrl.setFocused(true);
             }
           })
-          .on('blur', function(ev) {
+          .on('blur', function() {
+            if (selectScope.isOpen) return;
             containerCtrl && containerCtrl.setFocused(false);
             inputCheckValue();
           });
@@ -466,6 +461,7 @@ function SelectDirective($mdSelect, $mdUtil, $mdTheming, $mdAria, $compile, $par
           loadingAsync: attr.mdOnOpen ? scope.$eval(attr.mdOnOpen) || true : false
         }).finally(function() {
           selectScope.isOpen = false;
+          element.focus();
           element.attr('aria-expanded', 'false');
           ngModelCtrl.$setTouched();
         });
@@ -1200,7 +1196,7 @@ function SelectProvider($$interimElementProvider) {
             }
             newOption = optionsArray[index];
             if (newOption.hasAttribute('disabled')) newOption = undefined;
-          } while (!newOption && index < optionsArray.length - 1 && index > 0)
+          } while (!newOption && index < optionsArray.length - 1 && index > 0);
           newOption && newOption.focus();
           opts.focusedNode = newOption;
         }

diff --git a/src/components/select/select.spec.js b/src/components/select/select.spec.js
@@ -150,6 +150,23 @@ describe('<md-select>', function() {
     //expect($document[0].activeElement).toBe(select[0]);
   }));
 
+  it('should remove the input-container focus state', inject(function($rootScope) {
+    $rootScope.val = 0;
+    var element = setupSelect('ng-model="val"', [1, 2, 3]);
+    var select = element.find('md-select');
+    var controller = element.controller('mdInputContainer');
+    controller.setHasValue(true);
+
+    select.triggerHandler('focus');
+
+    expect(element.hasClass('md-input-focused')).toBe(true);
+
+    select.triggerHandler('blur');
+
+    expect(element.hasClass('md-input-focused')).toBe(false);
+
+  }));
+
   describe('input container', function() {
     it('should set has-value class on container for non-ng-model input', inject(function($rootScope, $document) {
       var el = setupSelect('ng-model="$root.model"', [1, 2, 3]);
@@ -879,7 +896,6 @@ describe('<md-select>', function() {
     try {
       el.triggerHandler('click');
       waitForSelectOpen();
-      el.triggerHandler('blur');
     } catch (e) { }
   }