-
Notifications
You must be signed in to change notification settings - Fork 6.8k
Open
Labels
P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentAn issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: cdk/text-field
Description
Reproduction
- open in chrome https://stackblitz.com/edit/angular-dqeq92?file=src%2Fapp%2Fdialog-content-example.html
- type a few line breaks or texts into the textarea until the the div's scrollbar appear
- scroll to the bottom and type more line breaks or text
Expected Behavior
The scroll position of the div should not be changed.
Actual Behavior
After each key hit the div gets scrolled to top. So its not possible to see what is currently typed.
Environment
- Angular: 12.2.11
- CDK/Material: 12.2.9
- Browser(s): Chrome, Edge (Chromium), Opera
- Operating System: Windows
When ngZoneEventCoalescing is set to false, it works in Chrome as expected.
It seems like its related to #23233. In firefox it works as expected.
When the firefox work around in the autosize Directive is used for chrome too, then it works fine. But I'm not really know, if it has some other side effects when using the work around for chrome too.
components/src/cdk/text-field/autosize.ts
Lines 227 to 237 in a931de5
| const needsMarginFiller = isFirefox && this._hasFocus; | |
| const measuringClass = isFirefox | |
| ? 'cdk-textarea-autosize-measuring-firefox' | |
| : 'cdk-textarea-autosize-measuring'; | |
| // In some cases the page might move around while we're measuring the `textarea` on Firefox. We | |
| // work around it by assigning a temporary margin with the same height as the `textarea` so that | |
| // it occupies the same amount of space. See #23233. | |
| if (needsMarginFiller) { | |
| element.style.marginBottom = `${element.clientHeight}px`; | |
| } |
zerbusdetroy, AurelienJoy, AndrewK15 and CorentinDeBoisset
Metadata
Metadata
Assignees
Labels
P3An issue that is relevant to core functions, but does not impede progress. Important, but not urgentAn issue that is relevant to core functions, but does not impede progress. Important, but not urgentarea: cdk/text-field