Skip to content
New issue

Have a question about this project? # for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “#”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? # to your account

.autofocus doesn't set focused style #1124

Closed
djulien opened this issue Apr 26, 2020 · 0 comments · Fixed by #1127
Closed

.autofocus doesn't set focused style #1124

djulien opened this issue Apr 26, 2020 · 0 comments · Fixed by #1127
Assignees
Labels

Comments

@djulien
Copy link

djulien commented Apr 26, 2020

In the EditorJS constructor, setting config.autofocus = true does not set the style of the first block to "ce-block--focused". (This is important for apps that use CSS to highlight the block having the focus).

Steps to reproduce:

  1. new EditorJS() with config {autofocus: true}

Expected behavior:
The first block has the cursor and the focus style.

Device, Browser, OS:
Firefox 75.0, Ubuntu 20.04 (but this doesn't matter)

Editor.js version:
2.17.0/2.18.0

The fix is to insert a line after setting the caret in ./src/compoents/core.ts, as shown below:

          if ((this.configuration as EditorConfig).autofocus) {
            const { BlockManager, Caret } = this.moduleInstances;

            Caret.setToBlock(BlockManager.blocks[0], Caret.positions.START);
//add this line:
            BlockManager.blocks[0].focused = true; //also turn on editor icon and styling -DJ

I forked the source code, made the change, rebuilt and tried a quick test and it seemed to work/didn't seem to break anything. However, there were "out of date" messages and several warnings during the build so I probably shouldn't create a branch and PR. The actual change would be as follows:

@@ -87,6 +87,7 @@ export default class Core {
             const { BlockManager, Caret } = this.moduleInstances;
 
             Caret.setToBlock(BlockManager.blocks[0], Caret.positions.START);
+            BlockManager.blocks[0].focused = true; //also turn on editor icon and styling -DJ
           }

thanks.

@djulien djulien added the bug label Apr 26, 2020
@djulien djulien changed the title autofocus doesn't set focused style .autofocus doesn't set focused style Apr 26, 2020
@gohabereg gohabereg self-assigned this Apr 26, 2020
@neSpecc neSpecc mentioned this issue Jun 2, 2020
# for free to join this conversation on GitHub. Already have an account? # to comment
Labels
Projects
None yet
Development

Successfully merging a pull request may close this issue.

2 participants