Implement editor.focus()

[fredck]

🐞 Is this a bug report or feature request? (choose one)

• Feature request

✅ Expected result

For implementors, I think a common requirement is moving the focus to the editor either on startup or when doing actions outside of it. I was facing this need.

My first approach for it was trying to use the main API entrypoint for it, the editor instance, and call editor.focus(). This is not available.

❎ Actual result

Currently, I'm using the following: editor.element.focus(), which touches the native web API. I assume this worked just because I'm using the ballon editor and my original div is there. I would be even more confused if I would have to do it with other creators that replace my element.

[fredck]

Btw, when it comes to the behavior, editor.focus() is not about putting the focus in the editable contents but instead putting the editor in focus. Therefore, if there is any additional UI of the editor active when focus is called, that UI is the one that gets focus.

[Reinmar]

We have the editor.editing.view.focus() method and we didn't need anything more so far. I'm not aware of cases where some other part of editor's UI may need to receive focus from outside – so far, in all our implementation of the editor it was only about focusing the editable in the right way (e.g. the right editable element).

Still, I'd consider implementing editor.focus() (which would call editor.editing.view.focus()) because of discoverability issues. And because specific editors may want to handle this differently.

WDYT? cc @oleq @oskarwrobel @pjasiun

[fredck]

As a clarification, please notice the semantic difference:

• editor.editing.view.focus() means "make the editing view of the editor focused". It is very specific about which part of the editor is to be focused.
• editor.focus() means "make the editor focused". I'm not stating which part of the editor is to get focus because I don't care as long as the editor has focus. Ofc, by default it will put the focus in the editing view.

[Reinmar]

I agree. editor.focus() might be used in the future for focusing the right part of the UI. That's why I also agree that it'll be good to implement it. I only meant that we didn't have yet such a use case in which it wouldn't be the editable – perhaps because we didn't work on a11y. But it means that we can't be sure whether such use case will ever appear.

PS. Buttons should still call editor.editing.view.focus() because that's what you expect after e.g. applying bold. You don't want the focus to stay in the toolbar.

[pjasiun]

Still, I'd consider implementing editor.focus() (which would call editor.editing.view.focus()) because of discoverability issues. And because specific editors may want to handle this differently.

Agree. That's not clear at all what to do to focus editor.

[Reinmar]

PS. Buttons should still call editor.editing.view.focus() because that's what you expect after e.g. applying bold. You don't want the focus to stay in the toolbar.

⚠️ Buttons are supposed to focus the editing area. Editor.focus() is a shorthand but it's reasonably likely that it's going to focus also other focusable parts of the editor, depending on what hold the focus recently.

[mlewand]

As pointed in #714 (comment) the changes in our UI buttons should be reverted. I'll add a PR with a revert for this.

[julian-henao]

I have an CKEditor instance in a grid wich when editing a cell popus up the editor, but for some odd reason focus event doesn't work. If I move it out from the grid it works perfectly. Any input?

[Witoso]

@julian-henao please create a new issue with the full description, thanks!