From 4b2e5d32c85c160f4708792ade2911ec1c365752 Mon Sep 17 00:00:00 2001
From: mhartington <mikehartington@gmail.com>
Date: Tue, 5 Dec 2017 13:52:43 -0500
Subject: [PATCH] feat(range): add debounce support

---
 packages/core/src/components/range/range.tsx             | 4 +---
 packages/core/src/components/range/test/basic/index.html | 7 +++++++
 2 files changed, 8 insertions(+), 3 deletions(-)

diff --git a/packages/core/src/components/range/range.tsx b/packages/core/src/components/range/range.tsx
index cd00464790..8c756fe3e7 100644
--- a/packages/core/src/components/range/range.tsx
+++ b/packages/core/src/components/range/range.tsx
@@ -13,8 +13,6 @@ import { clamp } from '../../utils/helpers';
   }
 })
 export class Range implements BaseInputComponent {
-  // private rangeId: string;
-  // private labelId: string;
 
   private styleTmr: any;
 
@@ -128,7 +126,7 @@ export class Range implements BaseInputComponent {
 
   @PropDidChange('value')
   protected valueChanged(val: boolean) {
-    this.ionChange.emit({ value: val });
+    setTimeout(() => this.ionChange.emit({value: val}), this.debounce);
     this.emitStyle();
   }
 
diff --git a/packages/core/src/components/range/test/basic/index.html b/packages/core/src/components/range/test/basic/index.html
index e017b369f2..67739bab75 100644
--- a/packages/core/src/components/range/test/basic/index.html
+++ b/packages/core/src/components/range/test/basic/index.html
@@ -70,6 +70,9 @@
           <ion-item>
             <ion-range dual-knobs="true" id="multiKnob"></ion-range>
           </ion-item>
+          <ion-item>
+            <ion-range id="debounce" debounce="5000"></ion-range>
+          </ion-item>
         </ion-list>
 
         <ion-button onclick="elTest()">Test</ion-button>
@@ -79,6 +82,7 @@
 
   <script>
     var knob = document.getElementById('multiKnob')
+    var debounceRange = document.getElementById('debounce')
     knob.value = {
       lower: 33,
       upper: 60
@@ -92,6 +96,9 @@
     knob.addEventListener('ionChange', function(ev) {
       console.log('change', ev)
     })
+    debounceRange.addEventListener('ionChange', function(ev) {
+      console.log('change', ev)
+    })
 
     function elTest() {
       var range = document.getElementById('range');