Skip to content

bug: Skip focus on <ion-textarea> elements when using tabindex=-1 #26944

@AppGonder

Description

@AppGonder

Prerequisites

Ionic Framework Version

v6.x

Current Behavior

when using tabindex=-1 to avoid a focus on input, it works fine on <ion-input> but on <ion-textarea> is not working on ionic versions greather then v4.

<ion-item>
  <ion-textarea placeholder="Test" tabindex="-1"></ion-textarea>
</ion-item>

<ion-item>
  <ion-input placeholder="Test" tabindex="-1"></ion-input>
</ion-item

Expected Behavior

Pressing tab or enter key, the behavior is expected to not focus on next inputs or text areas. Inspecting the html element the attribute tabindex is not passing for the <textarea> element.

Steps to Reproduce

add tabindex=-1 to html tags <ion-input> and <ion-textarea> and press tab key on keyboard, the focus is skipped on the forms

Code Reproduction URL

No response

Ionic Info

Ionic:

Ionic CLI : 6.20.1
Ionic Framework : @ionic/angular 6.1.8
@angular-devkit/build-angular : 13.1.2
@angular-devkit/schematics : 13.1.2
@angular/cli : 13.1.2
@ionic/angular-toolkit : 6.1.0

Capacitor:

Capacitor CLI : 3.5.1
@capacitor/android : 3.5.1
@capacitor/core : 3.5.1
@capacitor/ios : 3.5.1

Utility:

cordova-res : 0.15.4
native-run : 1.6.0

System:

NodeJS : v16.14.0
npm : 8.19.2
OS : Windows 10

Additional Information

No response

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions