Ion-range mouse vs touch events

Ionic Framework ionic-v3
1

I discovered an interesting issue while playing around with ion-range. I have implemented an ion-range element to track audio progress. I’ve bound the ion-range to a currentPosition variable.

<ion-range debounce="1" min="0" max="{{audioFile.Duration}}" [(ngModel)]="currentPosition (ionChange)="onUpdagePosition()">
            <ion-label range-left>{{currentPosition}}</ion-label>
            <ion-label range-right>{{audioFile.Duration}}</ion-label>
</ion-range>

This works fine when I test using ionic serve. When I build and test in my browser (ionic cordova build browser), I noticed that the label doesn’t update if I manually change the knob position. I discovered that if I go into responsive mode on chrome (developer tools > Toggle Device Toolbar / command + shift + M) it works fine.

Here’s what I know:

  1. ionChange is called and if I console.log(this.currentPosition) I can see the value change though the the label text does not change

  2. Clicking on the range changes currentPosition and the label

I suspect this has something to do with touch/mouse events getting mixed up.

Any insights would be super helpful! Thanks!