bug(cdkTextareaAutosize): Textarea padding breaks auto-height work
- Dominant language
- TypeScript
- Stars
- 25k
- Forks
- 6.8k
- Avg merge
- 1d 8h
- Merged PRs (30d)
- 91
Description
### Description
It is not possible to set vertical padding for Textarea
- it doesn't count
- as you enter text, the height of the field increases without adding a newline
### Reproduction
Steps to reproduce:
1. Use
```
cdkTextareaAutosize
cdkAutosizeMinRows="1"
cdkAutosizeMaxRows="10"
```
3. Add padding to style ".textarea {padding: 10px;}"
### Expected Behavior
- added padding
- the height only changes when the text is increased by one line
### Actual Behavior
- field height increases for each letter
- vertical padding is not taken into account
stackblitz - [https://stackblitz.com/edit/angular-zqu9zw](https://stackblitz.com/edit/angular-zqu9zw?file=src%2Fmain-component.html)
### Environment
- Angular: 15.2.8
- CDK/Material: 15.2.8
- Browser(s): Chrome Version 112.0.5615.138
- Operating System (e.g. Windows, macOS, Ubuntu): Windows 10
Contributor guide
Research direction
Start with the cdkTextareaAutosize reproduction in the linked StackBlitz and compare its behavior with the stated padding and row settings. The work is done when vertical padding is included in the calculated height and the textarea grows only when the text adds a line.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- angular, typescript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 50/100