Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

[Discussion] By arrow key movement, the cursor should be able to reach the inline end.

See original GitHub issue

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

feature Relate to

What’s the current behavior?

If I am not wrong, the onSelect skip the inline end because the mouse click in some browsers cannot catch the inline end. But the logic of key input, which is decided by packages/slate slate core codebase, is consistent crossing browsers. We should normalize the selection when and only when the mouse click happens.

I think we should provide is{Something}VisiblyTheSame for on{Event}. These methods are designed to

  1. If the computed slate variable is not significantly different from the existing range in the slate value, then do not normalize
  2. if normalize, we would prefer the range closer to the existing range in slate value
  3. otherwise, use the normalized range

Then we still have consistent behavior between browsers, and we can have the cursor at the end of inline to insert and delete.

Issue Analytics

  • State:closed
  • Created 6 years ago
  • Comments:19 (14 by maintainers)

github_iconTop GitHub Comments

urugatorcommented, Mar 3, 2018

In firefox the behavior depends on how the selection was obtained:

  • mouse click: depends on which inline the user actually clicked (the cursor can end up in both)
  • mouse selection: same as click - it depends where mouseUp was performed (this is a little bit weird because you may have a selection like aaa[bbb] and end up in “aaa”)
  • arrow keys: depends on direction - the selection ends up in the node closer to previous selection: |<aaa><bbb> -> <aaa|><bbb> <aaa><bbb>| <- <aaa><|bbb>

I even tried IE11 just out of intereset:

  • selection can be obtained in both (similary to firefox)
  • but insertions are always in the next (similary to chrome)
  • arrow movement always places selection to the next (opposite of chrome)
urugatorcommented, Mar 3, 2018

Hi, not sure if it helps somehow, but I tried to briefly test the default behavior of contenteditable on Chrome, what I found out:

  • it doesn’t matter whether the inline is followed by some textual node or not, the behavior is always the same
  • the selection is always in the same node as the character directly preceeding the selection (this is even indicated by the cursor having the same styling as the character before) - so actually, the selection is always in the “previous”, not in the “next” node…
  • THE TWIST: even though the selection is always inside “the previous” inline, whenever user inserts (by typing/pasting) any content, the selection jumps right after the current node prior to inserting the content (this seems like bug to me)

In conclusion:

  • selection is always in previous inline
  • inserting content causes the selection to move outside prior to inserting content

Could we preventDefault all insertions and perform them manually?

Read more comments on GitHub >

github_iconTop Results From Across the Web

Arrow keys started highlighting text - Microsoft Community
Normal behavior for a keyboard is arrow keys move cursor on text, if the Shift key is pressed using arrow keys text is...
Read more >
What is a function to have arrow keys move cursor? - SitePoint
Hi Angela and welcome to the JavaScript forums. It just means that it was posted in the wrong place at the end of...
Read more >
Navigating and Selecting With the Keyboard - LibreOffice Help
Navigating and Selecting With the Keyboard ; Up, down arrow keys. Moves the cursor up or down one line. (Command+OptionCtrl+Alt) Moves the current...
Read more >
Accessibility: How can I set the position of the cursor in the ...
Navigation is possible with arrow keys up, down, left and right. How can the cursor always be set to the right in the...
Read more >
Keyboard Shortcuts in the IPython Shell | Python Data Science ...
The IPython shell doesn't go this far, but does provide a number of keyboard shortcuts for ... Ctrl-b or the left arrow key,...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Post

No results found

github_iconTop Related Hashnode Post

No results found