search

ianstormtaylor / slate

A completely customizable framework for building rich text editors. (Currently in beta.)
http://slatejs.org
MIT License
29.94k stars 3.25k forks source link

Unable to focus on empty editor on mobile #2208

Closed alanchrt closed 4 years ago

alanchrt commented 6 years ago

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

Bug.

What's the current behavior?

On mobile/touch devices, a tap on an empty Editor does not focus the editor. If the editor already has text, it's fine.

In the GIF, there are multiple clicks/touches, but no focus. Here is the fiddle shown.

peek 2018-09-25 21-39

What's the expected behavior?

A tap on an empty Editor should focus for editing.

ericedem commented 6 years ago

I can't find the older issue that discusses this problem right now, but you can workaround this with:

<Editor
  onFocus={(event, change) => change.focus()}
/>
alanchrt commented 6 years ago

Thank you! This works for now.

alanchrt commented 6 years ago

So, it ends up that change.focus() hack really messes with a lot of other things (focus is initially/briefly in the wrong spot when clicking into the editor, scroll position gets messed with to focus the other position, etc.).

Any idea what the underlying cause is?

ianstormtaylor commented 6 years ago

Does it still happen without a placeholder?

shahkashani commented 6 years ago

Yeah, seems to happen with or without a placeholder. If the form is empty, you can't ever seem to be able to enter text. I tried to add that workaround above, but the editor throws an error. Same thing happens on the demo site:

slate

ianstormtaylor commented 6 years ago

Can you see if this is focused now with https://github.com/ianstormtaylor/slate/pull/2396 merged?

shahkashani commented 6 years ago

I can no longer reproduce the crash, which is great. Things generally work fine in empty editors that have the placeholder. But sometimes you get into this weird state where there is no placeholder (and there should be), and in those situations you can't type.

ezgif-4-952897590c82

steida commented 6 years ago

@shahkashani How you made that gif? Thank you.

shahkashani commented 5 years ago

@steida No problem! That one was made using the built-in iOS screen recorder and then converting the video to a GIF on ezgif.com! Hope that helps.

ianstormtaylor commented 4 years ago

I believe that this may be fixed by https://github.com/ianstormtaylor/slate/pull/3093, which has changed a lot of the logic in Slate and slate-react especially. I'm going to close this out, but as always, feel free to open a new issue if it persists for you. Thanks for understanding.