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.

Sign up for GitHub

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

Jump to bottom

bug(text field): Long multiline text field - scrolled up on input #20255

Open
kissds opened this issue Aug 10, 2020 · 1 comment · May be fixed by #30312
Open

bug(text field): Long multiline text field - scrolled up on input #20255

kissds opened this issue Aug 10, 2020 · 1 comment · May be fixed by #30312
Labels
area: cdk/text-field help wanted The team would appreciate a PR from the community to address this issue P4 A relatively minor issue that is not relevant to core functions

Comments

@kissds
Copy link

kissds commented Aug 10, 2020

Reproduction

https://monosnap.com/file/mKU40IcGQvhrgnhN9U3TLpAeouTj2g

Steps to reproduce:

  1. open https://v9.material.angular.io/cdk/text-field/examples in ie11
  2. find example "Auto-resizing textarea"
  3. inspect text field in the bottom of page
  4. uncheck element.style max-height (or you can try to reproduce it without cdkAutosizeMaxRows)
  5. insert very long text into the text field (about 50 lines) - height of content must to be higher than viewport's height
  6. put the cursor on the third line from the end (not on last line)
  7. enter some letter

Expected Behavior

The cursor and the letter just entered remain in the viewport.

Actual Behavior

The scroll moved up to the top of textarea

Environment

  • Angular: 9.1.0
  • CDK/Material: 9.2.4 and 10.0.0
  • Browser(s): ie11
  • Operating System (e.g. Windows, macOS, Ubuntu): Windows
@kissds kissds added the needs triage This issue needs to be triaged by the team label Aug 10, 2020
@jelbourn jelbourn added area: cdk/text-field help wanted The team would appreciate a PR from the community to address this issue P4 A relatively minor issue that is not relevant to core functions and removed needs triage This issue needs to be triaged by the team labels Aug 13, 2020
@mistrykaran91
Copy link
Contributor

Hi! Is anybody working on it? Otherwise, I could try to fix it if you don't mind.

mistrykaran91 added a commit to mistrykaran91/components that referenced this issue Jan 13, 2025
@mistrykaran91
fix(cdk/text-field): Long multiline textfield focus issue.
a6c08d5 
When we have long multiline textfield and put cursor on almost an end (For eg. on 3rd last line) the scroll moves up to the top of textarea. This fix will use `blur` and `focus` in `scrollToCaretPosition` method

Fixes angular#20255
@mistrykaran91 mistrykaran91 linked a pull request Jan 13, 2025 that will close this issue
Open
mistrykaran91 added a commit to mistrykaran91/components that referenced this issue Feb 13, 2025
@mistrykaran91
fix(cdk/text-field): Long multiline textfield focus issue.
c7256b2 
When we have long multiline textfield and put cursor on almost an end (For eg. on 3rd last line) the scroll moves up to the top of textarea. This fix will use `blur` and `focus` in `scrollToCaretPosition` method

Fixes angular#20255
mistrykaran91 added a commit to mistrykaran91/components that referenced this issue Mar 4, 2025
@mistrykaran91
fix(cdk/text-field): Long multiline textfield focus issue.
60af3c5 
When we have long multiline textfield and put cursor on almost an end (For eg. on 3rd last line) the scroll moves up to the top of textarea. This fix will set the `scrollTop` `scrollToCaretPosition` method

Fixes angular#20255
mistrykaran91 added a commit to mistrykaran91/components that referenced this issue Mar 4, 2025
@mistrykaran91
fix(cdk/text-field): Long multiline textfield focus issue.
aff4247 
When we have long multiline textfield and put cursor on almost an end (For eg. on 3rd last line) the scroll moves up to the top of textarea. This fix will set the `scrollTop` in `scrollToCaretPosition` method

Fixes angular#20255
mistrykaran91 added a commit to mistrykaran91/components that referenced this issue Mar 4, 2025
@mistrykaran91
fix(cdk/text-field): Long multiline textfield focus issue.
dc6c818 
When we have long multiline textfield and put cursor on almost an end (For eg. on 3rd last line) the scroll moves up to the top of textarea. This fix will `blur` and `focus` in `scrollToCaretPosition` method

Fixes angular#20255
mistrykaran91 added a commit to mistrykaran91/components that referenced this issue Mar 6, 2025
@mistrykaran91
fix(cdk/text-field): Long multiline textfield focus issue.
4e82db5 
When we have long multiline textfield and put cursor on almost an end (For eg. on 3rd last line) the scroll moves up to the top of textarea. This fix will listen to scroll event and update the `scrollTop` in `resizeToFitContent` method

Fixes angular#20255
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
area: cdk/text-field help wanted The team would appreciate a PR from the community to address this issue P4 A relatively minor issue that is not relevant to core functions
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix(cdk/text-field): Long multiline textfield focus issue mistrykaran91/components
3 participants
@jelbourn @kissds @mistrykaran91