ionic-team / ionic-framework

A powerful cross-platform UI toolkit for building native-quality iOS, Android, and Progressive Web Apps with HTML, CSS, and JavaScript.
https://ionicframework.com
MIT License
51.08k stars 13.51k forks source link

bug: ionic-slider allowTouchMove issues when screen reader is active. #22787

Closed gurpreetonebcg closed 3 years ago

gurpreetonebcg commented 3 years ago

Bug Report

Current behavior: We have used allowTouchMove: false, for ionic sliders, it works fine when screen reader is off but when screen reader is active and we navigate from page top to page bottom and left swipe on ok button ionic-slide changed

Expected behavior: When we do left swipe on ok button it should not move to next slide, it should move to next slide only after double tap on ok button.

Related code:

slider.component.ts

slideOpts = {
    initialSlide: 0,
    speed: 400,
    loop: false,
    allowTouchMove: false,
    pagination: false,
    pager: false,
  };

slider.component.html

<ion-slides [options]="slideOpts">
    <ion-slide>
        <h1>Slide 1</h1>
        <ion-button expand="full" size="large">OK</ion-button>
    </ion-slide>
    <ion-slide>
        <h1>Slide 2</h1>
        <ion-button expand="full" size="large">OK</ion-button>
    </ion-slide>
    <ion-slide>
        <h1>Slide 3</h1>
        <ion-button expand="full" size="large">OK</ion-button>
    </ion-slide>
</ion-slides>

Other information:

Ionic info:

Ionic CLI                     : 6.11.8 (C:\Users\DDD\AppData\Roaming\npm\node_modules\@ionic\cli)
   Ionic Framework               : @ionic/angular 5.5.0
   @angular-devkit/build-angular : 0.803.29
   @angular-devkit/schematics    : 8.1.3
   @angular/cli                  : 8.3.29
   @ionic/angular-toolkit        : 2.3.3

   Cordova:

   Cordova CLI       : 10.0.0
   Cordova Platforms : android 9.0.0
   Cordova Plugins   : cordova-plugin-ionic-keyboard 2.2.0, cordova-plugin-ionic-webview 4.1.3, (and 26 other plugins)

Utility:

   cordova-res : 0.11.0
   native-run  : 1.0.0

System:

   NodeJS : v10.15.3 (C:\Program Files\nodejs\node.exe)
   npm    : 6.4.1
   OS     : Windows 10
liamdebeasi commented 3 years ago

Thanks for the issue. The ion-slides component is powered by Swiper.js (https://github.com/nolimits4web/swiper), so the issue is likely in there. Have you opened an issue with the plugin author?

gurpreetonebcg commented 3 years ago

Thanks for the info, no I have not opened issue with the plugin.

liamdebeasi commented 3 years ago

Ok thanks. Can you provide reproduce this issue in an Ionic starter app and provide a link to the GitHub repo? I can take a look to see if I can identify the source of the issue.

ionitron-bot[bot] commented 3 years ago

Thanks for the issue! This issue has been labeled as needs reproduction. This label is added to issues that need a code reproduction.

Please reproduce this issue in an Ionic starter application and provide a way for us to access it (GitHub repo, StackBlitz, etc). Without a reliable code reproduction, it is unlikely we will be able to resolve the issue, leading to it being closed.

If you have already provided a code snippet and are seeing this message, it is likely that the code snippet was not enough for our team to reproduce the issue.

For a guide on how to create a good reproduction, see our Contributing Guide.

liamdebeasi commented 3 years ago

Thanks for the issue! This issue is being closed due to the lack of a code reproduction. 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.

Thank you for using Ionic!