ion-range knobs can be moved from the bar using arrow keys and ionchange not fired using arraow keys to update the ion-range values

[amsdams]

Ionic version: (check one with "x")
(For Ionic 1.x issues, please use https://github.com/ionic-team/ionic-v1)
[ ] 2.x
[ ] 3.x
[ x] 4.x
[x] 4.0.0-beta.1

I'm submitting a ... (check one with "x")
[x ] bug report
[ ] feature request

Current behavior:

it is possible to move the knobs in ion-outside of the bar and container using arrow keys.
ionchange event not fired when using arrow keys to move the knobs

Expected behavior:

it is not possible to move the knobs in ion-outside of the bar and container using arrow keys.
ionchange event is fired when using arrow keys to move the knobs.

Steps to reproduce:

Related code:

<script src="https://unpkg.com/@ionic/[email protected]/dist/ionic.js"></script>
<ion-item>
  <ion-range min="-200" max="200" color="secondary">
    <ion-label slot="start">-200</ion-label>
    <ion-label slot="end">200</ion-label>
  </ion-range>
</ion-item>

Other information:

Ionic info: (run ionic info from a terminal/cmd prompt and paste output below):

Ionic:

   ionic (Ionic CLI) : 4.0.3

System:

   NodeJS : v10.7.0
   npm    : 6.2.0
   OS     : macOS High Sierra

PS: not using ionic cli. just using stencil starter with ionic core dep for using ion-range

[amsdams]

@manucorporat, thank you for helping solving this issue. Are dual knobs still working with this fix?

[ionitron-bot]

Thanks for the issue! This issue is being locked to prevent comments that are not relevant to the original issue. If this is still an issue with the latest version of Ionic, please create a new issue and ensure the template is fully filled out.