From 94f925f562516ea9dda789f6adeb864925dcb242 Mon Sep 17 00:00:00 2001
From: Blackbaud-PatrickOFriel <patrick.ofriel@blackbaud.com>
Date: Mon, 31 Jul 2017 13:49:31 -0400
Subject: [PATCH] Update search change to occur on ngModel change, not angular
 change

---
 src/modules/search/search.component.html    |  4 ++--
 src/modules/search/search.component.spec.ts | 20 ++++++++++++++++++--
 src/modules/search/search.component.ts      |  2 ++
 3 files changed, 22 insertions(+), 4 deletions(-)

diff --git a/src/modules/search/search.component.html b/src/modules/search/search.component.html
index aa7a4a162..a21eca332 100644
--- a/src/modules/search/search.component.html
+++ b/src/modules/search/search.component.html
@@ -26,8 +26,8 @@
         <input
           type="text"
           class="sky-form-control sky-search-input"
-          [(ngModel)]="searchText"
-          (change)="searchTextChanged(searchText)"
+          [ngModel]="searchText"
+          (ngModelChange)="searchTextChanged($event)"
           (keyup)="enterPress($event, searchText)"
           (focus)="inputFocused(true)"
           (blur)="inputFocused(false)"
diff --git a/src/modules/search/search.component.spec.ts b/src/modules/search/search.component.spec.ts
index 7babfefca..f4375f0d8 100644
--- a/src/modules/search/search.component.spec.ts
+++ b/src/modules/search/search.component.spec.ts
@@ -102,6 +102,21 @@ describe('Search component', () => {
     fixture.detectChanges();
   }
 
+  function setNgModel(text: string) {
+    let inputEvent = document.createEvent('Event');
+    let params = {
+      bubbles: false,
+      cancelable: false
+    };
+    inputEvent.initEvent('input', params.bubbles, params.cancelable);
+
+    let inputEl = element.query(By.css('input'));
+    inputEl.nativeElement.value = text;
+
+    inputEl.nativeElement.dispatchEvent(inputEvent);
+    fixture.detectChanges();
+  }
+
   function triggerInputEnter() {
     let inputEl = element.query(By.css('input'));
     inputEl.triggerEventHandler('keyup', { which: 13});
@@ -223,8 +238,8 @@ describe('Search component', () => {
     expect(component.lastSearchTextApplied).toBe('applied text');
   });
 
-  it('should emit search change event on input change', () => {
-    setInput('change text');
+  it('should emit search change event on ngModel change', () => {
+    setNgModel('change text');
     expect(component.lastSearchTextChanged).toBe('change text');
     expect(component.lastSearchTextApplied).not.toBe('change text');
   });
@@ -258,6 +273,7 @@ describe('Search component', () => {
 
     expect(element.query(By.css('.sky-input-group-clear')).nativeElement).not.toBeVisible();
     expect(component.lastSearchTextApplied).toBe('');
+    expect(component.lastSearchTextChanged).toBe('');
   });
 
   it('should apply the correct focus class', () => {
diff --git a/src/modules/search/search.component.ts b/src/modules/search/search.component.ts
index 564ee98c4..f46af5ab5 100644
--- a/src/modules/search/search.component.ts
+++ b/src/modules/search/search.component.ts
@@ -162,6 +162,7 @@ export class SkySearchComponent implements OnDestroy, OnInit, OnChanges {
     this.clearButtonShown = false;
 
     this.searchAdapter.focusInput(this.elRef);
+    this.searchChange.emit(this.searchText);
 
     this.searchApply.emit(this.searchText);
   }
@@ -185,6 +186,7 @@ export class SkySearchComponent implements OnDestroy, OnInit, OnChanges {
   }
 
   public searchTextChanged(searchText: string) {
+    this.searchText = searchText;
     this.searchChange.emit(searchText);
   }