From 0f24862ff8eb548b0c727ae05390babe49df760e Mon Sep 17 00:00:00 2001
From: DevVersion <paulgschwendtner@me.com>
Date: Sun, 13 Mar 2016 10:29:21 +0100
Subject: [PATCH] fix(chips): fix md-max-chips for autocomplete watcher

The chips didn't check for the maxmium, when using an autocomplete.
That's why the chip always got appended, when reached the chips max.

Fixes #7549. Closes #7550
---
 src/components/chips/chips.spec.js         | 50 ++++++++++++++++++++++
 src/components/chips/js/chipsController.js | 12 ++++--
 2 files changed, 58 insertions(+), 4 deletions(-)

diff --git a/src/components/chips/chips.spec.js b/src/components/chips/chips.spec.js
index a8b49e344ad..8efd637f486 100755
--- a/src/components/chips/chips.spec.js
+++ b/src/components/chips/chips.spec.js
@@ -556,6 +556,56 @@ describe('<md-chips>', function() {
           expect(ctrl.chipBuffer).toBe('Test 2');
           expect(scope.items.length).not.toBe(2);
         });
+
+        it('should not append the chip when maximum is reached and using an autocomplete', function() {
+          var template =
+            '<md-chips ng-model="items" md-max-chips="1">' +
+              '<md-autocomplete ' +
+                'md-selected-item="selectedItem" ' +
+                'md-search-text="searchText" ' +
+                'md-items="item in querySearch(searchText)" ' +
+                'md-item-text="item">' +
+             '<span md-highlight-text="searchText">{{itemtype}}</span>' +
+            '</md-autocomplete>' +
+          '</md-chips>';
+
+          setupScopeForAutocomplete();
+          var element = buildChips(template);
+          var ctrl = element.controller('mdChips');
+
+          // Flush the autocompletes init timeout.
+          $timeout.flush();
+
+          var autocompleteCtrl = element.find('md-autocomplete').controller('mdAutocomplete');
+
+          element.scope().$apply(function() {
+            autocompleteCtrl.scope.searchText = 'K';
+          });
+
+          element.scope().$apply(function() {
+            autocompleteCtrl.select(0);
+          });
+
+          $timeout.flush();
+
+          expect(scope.items.length).toBe(1);
+          expect(scope.items[0]).toBe('Kiwi');
+          expect(element.find('input').val()).toBe('');
+
+          element.scope().$apply(function() {
+            autocompleteCtrl.scope.searchText = 'O';
+          });
+
+          element.scope().$apply(function() {
+            autocompleteCtrl.select(0);
+          });
+
+          $timeout.flush();
+
+          expect(scope.items.length).toBe(1);
+          expect(element.find('input').val()).toBe('Orange');
+        });
+
       });
 
       describe('focus functionality', function() {
diff --git a/src/components/chips/js/chipsController.js b/src/components/chips/js/chipsController.js
index 81fb5062b76..d19558e38bd 100755
--- a/src/components/chips/js/chipsController.js
+++ b/src/components/chips/js/chipsController.js
@@ -139,7 +139,7 @@ MdChipsCtrl.prototype.inputKeydown = function(event) {
     event.preventDefault();
 
     // Only append the chip and reset the chip buffer if the max chips limit isn't reached.
-    if (this.items.length >= this.maxChips) return;
+    if (this.hasMaxChipsReached()) return;
 
     this.appendChip(chipBuffer);
     this.resetChipBuffer();
@@ -358,7 +358,7 @@ MdChipsCtrl.prototype.resetChipBuffer = function() {
   }
 };
 
-MdChipsCtrl.prototype.hasMaxChips = function() {
+MdChipsCtrl.prototype.hasMaxChipsReached = function() {
   if (angular.isString(this.maxChips)) this.maxChips = parseInt(this.maxChips, 10) || 0;
 
   return this.maxChips > 0 && this.items.length >= this.maxChips;
@@ -368,7 +368,7 @@ MdChipsCtrl.prototype.hasMaxChips = function() {
  * Updates the validity properties for the ngModel.
  */
 MdChipsCtrl.prototype.validateModel = function() {
-  this.ngModelCtrl.$setValidity('md-max-chips', !this.hasMaxChips());
+  this.ngModelCtrl.$setValidity('md-max-chips', !this.hasMaxChipsReached());
 };
 
 /**
@@ -504,10 +504,14 @@ MdChipsCtrl.prototype.configureUserInput = function(inputElement) {
 };
 
 MdChipsCtrl.prototype.configureAutocomplete = function(ctrl) {
-  if ( ctrl ){
+  if ( ctrl ) {
     this.hasAutocomplete = true;
+
     ctrl.registerSelectedItemWatcher(angular.bind(this, function (item) {
       if (item) {
+        // Only append the chip and reset the chip buffer if the max chips limit isn't reached.
+        if (this.hasMaxChipsReached()) return;
+
         this.appendChip(item);
         this.resetChipBuffer();
       }