matTabLink `disabled` input should be `matTabLinkDisabled`
- Langage dominant
- TypeScript
- Étoiles
- 25k
- Forks
- 6.8k
- Merge moyen
- 1 j 8 h
- PR mergées (30 j)
- 91
Description
#### Reproduction
Use StackBlitz to reproduce your issue: https://stackblitz.com/edit/angular-zju32k
Steps to reproduce:
1. Put a tooltip on a `matTabLink`
2. Disabled the `matTabLink`
#### Expected Behavior
Tab should be disabled, and tooltip should show.
#### Actual Behavior
Tooltip did not show.
#### Notes/Thoughts
If the input is changed to `matTabLinkDisabled`, then `disabled` and `[disabled]="true"` should still be able to work. However, it would also be possible to use `matTabLinkDisabled`, which would make it possible to disable the `MatTabLink` specifically, without disabling any other directive on the element.
I *believe* this would be a non breaking change, as the input is declared in the `inputs` field on component:
```typescript
@Directive({
selector: '[mat-tab-link], [matTabLink]',
exportAs: 'matTabLink',
inputs: ['disabled', 'disableRipple', 'tabIndex'], // <== HERE
host: {
'class': 'mat-tab-link',
'[attr.aria-current]': 'active ? "page" : null',
'[attr.aria-disabled]': 'disabled',
'[attr.tabIndex]': 'tabIndex',
'[class.mat-tab-disabled]': 'disabled',
'[class.mat-tab-label-active]': 'active',
}
})
export class MatTabLink
```
So *my understanding* is right now, you can’t read the disabled field by name anyways.
#### Environment
- Angular: 8.2.11
- CDK/Material: 8.2.1
- Browser(s): Version 77.0.3865.120 (Official Build) (64-bit)
- Operating System (e.g. Windows, macOS, Ubuntu): Debian Rodette
Guide de contribution
Ouvrir le guide de contribution
Piste de recherche
Commence par la reproduction StackBlitz et la déclaration de la directive MatTabLink présentées dans l’issue, en te concentrant sur l’interaction entre son input disabled et le tooltip. C’est terminé lorsqu’un lien d’onglet désactivé affiche toujours son tooltip, tandis que disabled et matTabLinkDisabled restent tous deux utilisables comme décrit.
Rédigé par le modèle d'indexation à partir du texte de l'issue.
Évaluation
- Stack technique
- angular, typescript
- Domaine
- frontend
- Type d'issue
- Bug
- Difficulté
- 3/5
- Temps estimé
- 1-2 jours
- Activité
- À l'abandon
- Clarté
- Plutôt claire
- Accessibilité débutants
- 48/100