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

Space and New line key not working in a textarea used inside a mat-tree #29828

Closed
aujlambkar opened this issue Oct 4, 2024 · 3 comments · Fixed by #29861
Closed

Space and New line key not working in a textarea used inside a mat-tree #29828

aujlambkar opened this issue Oct 4, 2024 · 3 comments · Fixed by #29861
Assignees
Labels
area: material/tree P2 The issue is important to a large percentage of users, with a workaround

Comments

@aujlambkar
Copy link

aujlambkar commented Oct 4, 2024

Which @angular/* package(s) are the source of the bug?

Don't known / other

Is this a regression?

Yes

Description

If a <textarea> is used inside a <mat-tree>, then any space or newline key inputs to the textarea are ignored

This issue has been occurring since the time the angular version was upgraded to 18.2.26
The issue didn't exist before that

Directions to reproduce the issue

Attached a link where you can reproduce the issue
The textarea inside the mat tree exhibits the problem (try typing in some data with spaces and newlines)
The text area which is out side the mat-tree works well with spaces and newline inputs

Workaround:-

The only workaround we could think for currently is to stop propagating the keydown event on textarea which prevents the problem currently

Please provide a link to a minimal reproduction of the bug

https://stackblitz.com/edit/ctwk44-nkcxdo?file=src%2Fexample%2Ftree-dynamic-example.html

Please provide the exception or error you saw

No response

Please provide the environment you discovered this bug in (run ng version)

Angular CLI: 18.2.7
Node: 22.4.1
Package Manager: npm 10.8.1
OS: darwin arm64

Angular: 18.2.7
... animations, cdk, cli, common, compiler-cli, core, forms
... language-service, localize, material, platform-browser
... platform-browser-dynamic, router, service-worker

Package Version

@angular-devkit/architect 0.1802.7
@angular-devkit/build-angular 18.2.7
@angular-devkit/core 18.2.7
@angular-devkit/schematics 18.2.7
@schematics/angular 18.2.7
typescript 5.5.4

Anything else?

No response

@JeanMeche JeanMeche transferred this issue from angular/angular Oct 4, 2024
@crisbeto crisbeto added P2 The issue is important to a large percentage of users, with a workaround area: material/tree labels Oct 9, 2024
@crisbeto crisbeto self-assigned this Oct 11, 2024
crisbeto added a commit to crisbeto/material2 that referenced this issue Oct 11, 2024
Currently the CDK tree handle any keyboard event coming from a descendant. This problematic if there are interactive elements like inputs inside the tree, because their default behavior will be prevented.

This change switches to only handling events coming either directly from the tree or directly from a tree node.

Fixes angular#29828.
@ftaffelt
Copy link

The bugfix doesn't appear in the changelog for the latest v18 releases. So it seems that this bugfix is only in the v19 branch. Would it be possible to also fix this for the v18 branch?

crisbeto added a commit that referenced this issue Oct 30, 2024
Currently the CDK tree handle any keyboard event coming from a descendant. This problematic if there are interactive elements like inputs inside the tree, because their default behavior will be prevented.

This change switches to only handling events coming either directly from the tree or directly from a tree node.

Fixes #29828.
@crisbeto
Copy link
Member

The fix has been cherry-picked into the 18.2.x branch.

@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 Nov 30, 2024
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
area: material/tree P2 The issue is important to a large percentage of users, with a workaround
Projects
None yet
Development

Successfully merging a pull request may close this issue.

3 participants