From ebd5db1cfec14610ea09ac5a1b37d983b073c4c2 Mon Sep 17 00:00:00 2001
From: Michael Prentice <splaktar@gmail.com>
Date: Tue, 29 May 2018 20:04:21 -0400
Subject: [PATCH] fix(chips): unwanted re-focus of last chip after blur

this solves a regression introduced in 1.1.2 by #9650
change `ng-change` demo to use `$log` instead of `alert`
fix some lint line length warnings
JSDoc clean up

Fixes #10758
---
 src/components/chips/demoBasicUsage/index.html | 15 ++++++++-------
 .../chips/demoBasicUsage/readme.html           |  3 +--
 src/components/chips/demoBasicUsage/script.js  |  4 ++--
 src/components/chips/js/chipsController.js     | 18 ++++++++++--------
 4 files changed, 21 insertions(+), 19 deletions(-)

diff --git a/src/components/chips/demoBasicUsage/index.html b/src/components/chips/demoBasicUsage/index.html
index 6c0c5b29840..60067926703 100644
--- a/src/components/chips/demoBasicUsage/index.html
+++ b/src/components/chips/demoBasicUsage/index.html
@@ -20,22 +20,23 @@ <h2 class="md-title">Use a custom chip template.</h2>
     <br/>
     <h2 class="md-title">Use the default chip template.</h2>
 
-    <md-chips ng-model="ctrl.fruitNames" readonly="ctrl.readonly" md-removable="ctrl.removable"></md-chips>
+    <md-chips ng-model="ctrl.fruitNames" readonly="ctrl.readonly" md-removable="ctrl.removable">
+    </md-chips>
 
     <br/>
-    <h2 class="md-title">Use ng-change</h2>
+    <h2 class="md-title">Use ng-change and add-on-blur</h2>
 
-    <md-chips ng-model="ctrl.ngChangeFruitNames" ng-change="ctrl.onModelChange(ctrl.ngChangeFruitNames)" 
-      md-removable="ctrl.removable"></md-chips>
+    <md-chips ng-model="ctrl.ngChangeFruitNames" md-add-on-blur="true"
+              ng-change="ctrl.onModelChange(ctrl.ngChangeFruitNames)"
+              md-removable="ctrl.removable"></md-chips>
 
     <br/>
     <h2 class="md-title">Make chips editable.</h2>
 
-    <md-chips ng-model="ctrl.editableFruitNames" readonly="ctrl.readonly" md-removable="ctrl.removable"
-              md-enable-chip-edit="true"></md-chips>
+    <md-chips ng-model="ctrl.editableFruitNames" readonly="ctrl.readonly"
+              md-removable="ctrl.removable" md-enable-chip-edit="true"></md-chips>
 
     <br/>
-
     <h2 class="md-title">Use Placeholders and override hint texts.</h2>
 
     <md-chips
diff --git a/src/components/chips/demoBasicUsage/readme.html b/src/components/chips/demoBasicUsage/readme.html
index bd76a4cd7a2..2ea0b5c349c 100644
--- a/src/components/chips/demoBasicUsage/readme.html
+++ b/src/components/chips/demoBasicUsage/readme.html
@@ -3,8 +3,7 @@
   <code>md-chips</code> component. In order to achieve this, the behavior has changed to also select
   and highlight the newly appended chip for <code>300ms</code> before re-focusing the text input.
 </p>
-
 <p>
   Please see the <a href="api/directive/mdChips">documentation</a> for more information and for
   the new <code>md-chip-append-delay</code> option which allows you to customize this delay.
-</p>
\ No newline at end of file
+</p>
diff --git a/src/components/chips/demoBasicUsage/script.js b/src/components/chips/demoBasicUsage/script.js
index 7f615e520a6..7ad42cbb78d 100644
--- a/src/components/chips/demoBasicUsage/script.js
+++ b/src/components/chips/demoBasicUsage/script.js
@@ -7,7 +7,7 @@
       }])
       .controller('BasicDemoCtrl', DemoCtrl);
 
-  function DemoCtrl ($timeout, $q) {
+  function DemoCtrl ($timeout, $q, $log) {
     var self = this;
 
     self.readonly = false;
@@ -42,7 +42,7 @@
     };
 
     self.onModelChange = function(newModel) {
-      alert('The model has changed');
+      $log.log('The model has changed to ' + newModel + '.');
     };
   }
 })();
diff --git a/src/components/chips/js/chipsController.js b/src/components/chips/js/chipsController.js
index 155ea05fc3d..4441c216533 100644
--- a/src/components/chips/js/chipsController.js
+++ b/src/components/chips/js/chipsController.js
@@ -446,8 +446,7 @@ MdChipsCtrl.prototype.resetSelectedChip = function() {
  * determined as the next chip in the list, unless the target chip is the
  * last in the list, then it is the chip immediately preceding the target. If
  * there is only one item in the list, -1 is returned (select none).
- * The number returned is the index to select AFTER the target has been
- * removed.
+ * The number returned is the index to select AFTER the target has been removed.
  * If the current chip is not selected, then -1 is returned to select none.
  */
 MdChipsCtrl.prototype.getAdjacentChipIndex = function(index) {
@@ -462,7 +461,7 @@ MdChipsCtrl.prototype.getAdjacentChipIndex = function(index) {
  * @param {string} newChip chip buffer contents that will be used to create the new chip
  */
 MdChipsCtrl.prototype.appendChip = function(newChip) {
-  this.shouldFocusLastChip = true;
+  this.shouldFocusLastChip = !this.addOnBlur;
   if (this.useTransformChip && this.transformChip) {
     var transformedChip = this.transformChip({'$chip': newChip});
 
@@ -716,7 +715,9 @@ MdChipsCtrl.prototype.selectAndFocusChip = function(index) {
  * Call `focus()` on the chip at `index`
  */
 MdChipsCtrl.prototype.focusChip = function(index) {
-  var chipContent = this.$element[0].querySelector('md-chip[index="' + index + '"] .md-chip-content');
+  var chipContent = this.$element[0].querySelector(
+    'md-chip[index="' + index + '"] .md-chip-content'
+  );
 
   this.ariaTabIndex = index;
 
@@ -857,8 +858,7 @@ MdChipsCtrl.prototype.configureAutocomplete = function(ctrl) {
 };
 
 /**
- * Whether the current chip buffer should be added on input blur or not.
- * @returns {boolean}
+ * @returns {boolean} Whether the current chip buffer should be added on input blur or not.
  */
 MdChipsCtrl.prototype.shouldAddOnBlur = function() {
 
@@ -869,14 +869,16 @@ MdChipsCtrl.prototype.shouldAddOnBlur = function() {
   // If the model value is empty and required is set on the element, then the model will be invalid.
   // In that case, we still want to allow adding the chip. The main (but not only) case we want
   // to disallow is adding a chip on blur when md-max-chips validation fails.
-  var isModelValid = this.ngModelCtrl.$isEmpty(this.ngModelCtrl.$modelValue) || this.ngModelCtrl.$valid;
+  var isModelValid = this.ngModelCtrl.$isEmpty(this.ngModelCtrl.$modelValue) ||
+    this.ngModelCtrl.$valid;
   var isAutocompleteShowing = this.autocompleteCtrl && !this.autocompleteCtrl.hidden;
 
   if (this.userInputNgModelCtrl) {
     isModelValid = isModelValid && this.userInputNgModelCtrl.$valid;
   }
 
-  return this.addOnBlur && !this.requireMatch && chipBuffer && isModelValid && !isAutocompleteShowing;
+  return this.addOnBlur && !this.requireMatch && chipBuffer && isModelValid &&
+    !isAutocompleteShowing;
 };
 
 MdChipsCtrl.prototype.hasFocus = function () {