draft-js icon indicating copy to clipboard operation
draft-js copied to clipboard

Editor focus out of view when pressing enter

Open HalilFocic opened this issue 3 years ago • 1 comments

Do you want to request a feature or report a bug?

Bug

What is the current behavior?

If I have static height for my editor,while pressing enter it doesn't scroll to where cursor is.It only focuses after I type 3 letters.

If the current behavior is a bug, please provide the steps to reproduce and if possible a minimal demo of the problem. You can use this jsfiddle to get started: https://jsfiddle.net/gmertk/e61z7nfa/.

What is the expected behavior?

I would like if it behaved something like word, when you reach the bottom it automatically scrolls last line a bit up to leave some space.

Which versions of Draft.js, and which browser / OS are affected by this issue? Did this work in previous versions of Draft.js?

0.11.7. It affects every browser on every OS. It didn't work on previous versions.

HalilFocic avatar Jan 25 '22 14:01 HalilFocic

It's an old bug, and that's a mystery why they didn't fixed it yet. But this solution helped me:

:global(.DraftEditor-root) {
  & [data-contents] {
    overflow: auto;
    padding-bottom: 5px;
  }
}

It's from https://github.com/facebook/draft-js/issues/304#issuecomment-476951825, but with some modifications.

NestlyS avatar Mar 05 '22 10:03 NestlyS