Allow cursor to exit from container blocks

[Garry Yao]

The editor should provide the ability of exiting cursor from paragraph block into container blocks, mostly "div" and "blockquote", there's no explicit specification yet, a proper solution that address this problem should come out of this ticket.

<div>
<p>paragraph one</p>
<p>paragraph two</p>
</div>

<blockquote>
<p>cited paragraph</p>
</blockquote>

[Garry Yao]

The proposed patch create every block limit a padding node (in wysiwyg only), thus arrow keys stop on it, user could easily exit from such container block by press enter at the end of it.

[Jakub Ś]

After consulting with @fredck I'm attaching my comment from ticket #3986

Since this is a discussion than in my opinion we have a general problem with exiting block-level elements.

Let's start with table:

1. To get out of table at the bottom, you have to press down arrow.
2. To get out of table at the top you have to press top or left arrow twice - "double-arrow" and start typing. That way new paragraph will be created above the table. As @garry.yao has said - this works in all browsers except FF.
3. The newly created paragraph can be deleted but there are some browser inconsistencies. In Webkit and IE you have to use SHIFT+right-arrow(or End) to select whole text and than press delete. In Opera you have to select text, press DELETE, press down-arrow and then up-arrow.
4. Additionally there is let's say edge case when you want to delete paragraph after table which ends the document. There are also some browser inconsistencies. You can read more about this issue here #7001

Div:
When you create a div it is impossible to get out of it using enter or arrows, neither at the top nor at the bottom. @garry.yao has pointed out these problem here: #6847
Blockquote
This case is almost the same as div, except that thanks to it's "toggle button logic" it is possible to leave it at the bottom. But again it is impossible to leave it at the top or at the bottom using arrows

Lists:
To leave the list at the bottom all you have to do is press ENTER two times and you're out. Again there is no possibility to escape lists at the top. I have tried to workaround the problem by creating first empty list element and then deleting it with backspace but there are some browser inconsistencies. You can read about it here: #8259

Forms
It is impossible to get out of form at the top, neither using arrows nor mouse. Getting out at the bottom is as easy as in tables.

I don’t know if this is possible but it would be nice to unify this behavior. Let’s say to get out of block you have to press up/down arrow twice quickly “double-arrow”. Since almost none of block-level elements, that start the document, allows for leaving them at the top and tables partially support it, sounds like a good idea (at least to me).
Leaving the element at the bottom is more complex – Adding new behavior to divs is no problem. Blockquote and List have their way to let cursor out (double enter and toggle button in toolbar). Perhaps this could be an additional way to leave those two elements.
Froms and Tables unfortunately can be exited with one-arrow press. To unify would meant to drop current behavior and implement new one. No other solution comes to my mind here.

One problem comes to my mind that could quickly emerge here. It should be also possible to easily delete those newly created paragraphs with a delete or backspace key.

There is one more edge case. What if you have to block-level elements next to each other like two tables or two divs and you want to insert something between them? Currently there is no such functionality. @datalink has pointed out this problem in #8032. In that ticked I have proposed sketch of a plugin that could insert paragraph or other element, dependant on enterMode, on demand (when pressing the button). Maybe it leads in the right direction.

This is just a draf of my point of view on the problem, I may have missed something, so don’t kill me at the start :).

[Frederico Caldeira Knabben]

Replying to garry.yao:

The proposed patch create every block limit a padding node (in wysiwyg only), thus arrow keys stop on it, user could easily exit from such container block by press enter at the end of it.

The proposed idea is still too simplistic and doesn't cover some other need, like the ability to move before the blocks.

We should go for a full implementation here. I have it already defined on my mind. I'll work to put it "on paper". It should cover the possibility of leaving any kind of block with both the keyboard and the mouse, as well as leave some "blocking" situations, like links at the end of the line.

[Alfonso Martínez de Lizarrondo]

I guess that this is the type of discussion that Aryeh might be interested for the Editing APIs spec: ​http://cksource.com/forums/viewtopic.php?f=11&t=23338

Maybe not for this version, but defining the caret movement seems quite important and complex to do it right given all the possible situations.

[Jakub Ś]

#3986 and #7821 tackle the problem of placing the cursor before the table.

[Garry Yao]

The solution for this ticket is not planned for v4 right now.

[Jakub Ś]

#8561 was marked as duplicate

[Damian]

@j.swiderski - Could you please explain how this defect is a duplicate of #8561 ?

It seems to me that this ticket on its own would not address the issue raised in #8561, specifically the creation of a list from a nested block structure.

[Jakub Ś]

@damo you are right #8561 is not a duplicate. Sorry for that.

IMO part of your ticket is related to leaving element boundaries but it definitely is not a duplicate.

NOTE: Any discussion about #8561 should be continued in #8561. Not here.

[Jakub Ś]

I believe that this issue can be now fixed as it was taken care of by introducing Magic Line plugin in CKEditor 4.x (v4)