bug: ion-searchbar input is always labelled "search text"; aria-label on the host is not forwarded
Les mainteneurs répondent en général sous 1 jour
Personne n'a encore pris cette issue.
Évaluation
- Difficulté
- 2/5
- Temps estimé
- 1-3 heures
- Accessibilité débutants
- 84/100
- Type d'issue
- Bug
- Clarté
- Clairement spécifiée
- Activité
- Active
- Stack technique
- typescript
- Domaine
- accessibility, frontend
Piste de recherche
Commencez dans core/src/components/searchbar/searchbar.tsx, au niveau du code des attributs hérités vers la ligne 285, et de l’input natif vers la ligne 690. Comparez la gestion existante de aria-label dans ion-input et ion-textarea, puis vérifiez la reproduction avec aria-label et aria-labelledby. C’est terminé lorsque l’input natif reçoit ces attributs de l’hôte et utilise toujours "search text" lorsqu’aucun des deux n’est fourni.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Description
Prerequisites
- I have read the Contributing Guidelines.
- I agree to follow the Code of Conduct.
- I have searched for existing issues that already report this problem, without success.
Ionic Framework Version
- v8.x / v9.x (reproduced on 9.0.3)
Current Behavior
The native <input> rendered by ion-searchbar always carries aria-label="search text":
and the component inherits only lang and dir from the host:
So an aria-label (or aria-labelledby) placed on <ion-searchbar> never reaches the input. A screen reader announces every searchbar as "search text, search field" — in English, whatever the app language, and without saying what the field searches (members, chats, messages, places…). ion-input and ion-textarea already forward aria-label from the host to the native control, so ion-searchbar is the odd one out.
Expected Behavior
ion-searchbar forwards aria-label / aria-labelledby from the host to its <input>, the way ion-input does, keeping "search text" as the fallback when the host sets neither.
Steps to Reproduce
- Render
<ion-searchbar aria-label="Search family members" placeholder="Search family members"></ion-searchbar>. - Inspect the rendered
input.searchbar-input, or focus it with VoiceOver / NVDA. - The input's accessible name is "search text"; the host's
aria-labelis ignored.
Code Reproduction URL
The three-line snippet above reproduces it in any Ionic app; the behaviour follows directly from the two source lines linked. Happy to add a StackBlitz if that helps triage.
Ionic Info
Ionic Framework 9.0.3, Angular 22 (standalone), Capacitor 8. Observed with iOS 18 VoiceOver and Chrome 140 + NVDA.
Additional Information
Our workaround is an Angular directive on ion-searchbar that, after render, copies the host placeholder onto input.searchbar-input as aria-label. I would be glad to open a PR that adds aria-label / aria-labelledby to the inherited attributes and passes them to the input, falling back to "search text".
- Langage dominant
- TypeScript
- Étoiles
- 52.7k
- Forks
- 13.3k
- Merge moyen
- 3 j 17 min
- PR mergées (30 j)
- 59
Préparer son environnement
- Aucun Dockerfile ni fichier Docker Compose
- Propose un modèle de pull request
- Lire le guide de contribution
Par où commencer
- Lisez l'issue en entier, puis le guide de contribution du projet.
- Signalez en commentaire que vous la prenez — cela évite que deux personnes fassent le même travail.
- Forkez le dépôt et travaillez sur une branche.
- Ouvrez une pull request qui référence le numéro de l'issue.
Autres issues de ionic-team/ionic-framework
-
triage
Difficulté 2/5 1-3 heures Accessibilité débutants 72/100
ionic-team/ionic-framework#31410 · 1 commentaire ·
Les mainteneurs répondent en général sous 1 jour
-
triage
Difficulté 2/5 1-3 heures Accessibilité débutants 72/100
ionic-team/ionic-framework#31314 ·
Les mainteneurs répondent en général sous 1 jour
-
triage
Difficulté 2/5 1-3 heures Accessibilité débutants 86/100
ionic-team/ionic-framework#31291 ·
Les mainteneurs répondent en général sous 1 jour
-
triage
Difficulté 2/5 1-3 heures Accessibilité débutants 70/100
ionic-team/ionic-framework#30738 ·
Les mainteneurs répondent en général sous 1 jour
-
package: core type: bug
Difficulté 1/5 Moins d'une heure Accessibilité débutants 72/100
ionic-team/ionic-framework#29864 · 1 commentaire ·
Les mainteneurs répondent en général sous 1 jour
Toutes les issues de ionic-team/ionic-framework
Issues similaires
-
area/frontend good first issue kind/cooldown
Difficulté 2/5 1-3 heures Accessibilité débutants 78/100
Les mainteneurs répondent en général sous 1 jour
-
bug
Difficulté 2/5 1-3 heures Accessibilité débutants 85/100
voidzero-dev/oxc-angular-compiler#511 ·
Les mainteneurs répondent en général sous 1 jour
-
Difficulté 2/5 1-3 heures Accessibilité débutants 78/100
langchain-ai/deepagentsjs#898 · 1 commentaire ·
Les mainteneurs répondent en général sous 1 jour
-
Difficulté 1/5 Moins d'une heure Accessibilité débutants 92/100
anomalyco/models.dev#8509 · 2 commentaires ·
Les mainteneurs répondent en général sous 1 jour
-
bug documentation P2 UI/UX
Difficulté 2/5 1-3 heures Accessibilité débutants 85/100
Les mainteneurs répondent en général sous 1 jour