Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

bug(matTabLink): disabled flag prevents mouse click but does not prevent clicking using spacebar #27270

Closed
1 task
smorandi opened this issue Jun 9, 2023 · 1 comment · Fixed by #27274
Closed
1 task
Assignees
Labels
area: material/tabs P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent

Comments

@smorandi
Copy link

smorandi commented Jun 9, 2023

Is this a regression?

  • Yes, this behavior used to work in the previous version

The previous version in which this bug was not present was

No response

Description

This is a follow up for #27071.
It claims that this issue was fixed, but it is not. Yes, preventing clicking by mouse is working fine now.
However, one can still initiate the action via keyboard by hitting spacebar when navigating to a disabled tab via cursor keys.

Navigating to disabled tabs should probably not be possible in the first place though.

Reproduction

StackBlitz link:
Steps to reproduce:
1.
2.

Expected Behavior

Setting a tab disabled should prevent mouseclicks and keyboard actions (space/return etc.)

Actual Behavior

It is still possible to navigate and activate a disabled tab via keyboard

Environment


     _                      _                 ____ _     ___
    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 16.0.5
Node: 16.18.0
Package Manager: npm 8.19.2
OS: win32 x64

Angular: 16.0.5
... animations, cli, common, compiler, compiler-cli, core, forms
... language-service, localize, platform-browser
... platform-browser-dynamic, router

Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.1600.5
@angular-devkit/build-angular     16.0.5
@angular-devkit/core              16.0.5
@angular-devkit/schematics        16.0.5
@angular/cdk                      16.0.4
@angular/material                 16.0.4
@angular/material-luxon-adapter   16.0.4
@schematics/angular               16.0.5
rxjs                              7.8.1
typescript                        5.0.4
@smorandi smorandi added the needs triage This issue needs to be triaged by the team label Jun 9, 2023
@zarend zarend added P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent area: material/tabs and removed needs triage This issue needs to be triaged by the team labels Jun 9, 2023
@zarend zarend changed the title bug(matTabLink): disabled flag does not work #2 bug(matTabLink): disabled flag prevents mouse click but does not prevent clicking using spacebar Jun 9, 2023
@crisbeto crisbeto self-assigned this Jun 10, 2023
crisbeto added a commit to crisbeto/material2 that referenced this issue Jun 10, 2023
Fixes that while we were preventing clicks on disabled links using `pointer-events`, we didn't prevent keyboard events.

Fixes angular#27270.
crisbeto added a commit that referenced this issue Jun 10, 2023
#27274)

Fixes that while we were preventing clicks on disabled links using `pointer-events`, we didn't prevent keyboard events.

Fixes #27270.

(cherry picked from commit 2fbb81d)
crisbeto added a commit that referenced this issue Jun 10, 2023
#27274)

Fixes that while we were preventing clicks on disabled links using `pointer-events`, we didn't prevent keyboard events.

Fixes #27270.
crisbeto added a commit that referenced this issue Jun 10, 2023
#27274)

Fixes that while we were preventing clicks on disabled links using `pointer-events`, we didn't prevent keyboard events.

Fixes #27270.

(cherry picked from commit 2fbb81d)
@angular-automatic-lock-bot
Copy link

This issue has been automatically locked due to inactivity.
Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

This action has been performed automatically by a bot.

@angular-automatic-lock-bot angular-automatic-lock-bot bot locked and limited conversation to collaborators Jul 11, 2023
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: material/tabs P3 An issue that is relevant to core functions, but does not impede progress. Important, but not urgent
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants