Skip to content
New issue

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

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

Already on GitHub? Sign in to your account

Toolbar can render outside of the EditorJS component #2872

Open
ebrine opened this issue Nov 15, 2024 · 3 comments
Open

Toolbar can render outside of the EditorJS component #2872

ebrine opened this issue Nov 15, 2024 · 3 comments
Labels

Comments

@ebrine
Copy link

ebrine commented Nov 15, 2024

Describe a bug.

Steps to reproduce:
It doesn't happen to me everytime, but sometimes when I use my implementation of EditorJS and I hover over the Editor JS component region just as it's loading, the toolbar renders with a negative top value, so it's way above the first component block.

Expected behavior:

I would expect that the toolbar always appears next to the content block hovered, or not at all.
I think that means that the top value should only be allowed to be 0px at minimum.

Screenshots:

Screenshot 2024-11-15 at 11 25 29 AM

Screenshot 2024-11-15 at 11 28 28 AM

Device, Browser, OS:
Macbook Pro
Chrome
14.6.1

Editor.js version:

"@editorjs/editorjs": "^2.30.6",

Plugins you use with their versions:

    "@editorjs/header": "^2.8.7",
    "@editorjs/image": "^2.9.0",
    "@editorjs/paragraph": "^2.11.5",
    "@editorjs/underline": "^1.1.0",
@ebrine ebrine added the bug label Nov 15, 2024
@jakubm95
Copy link

I have the same error

@flo3ds
Copy link

flo3ds commented Dec 22, 2024

Same, image plugin cause the bug on toolbar
Capture d'écran 2024-12-22 094419

console.log(r.getBoundingClientRect()); in moveAndOpen(e=this.Editor.BlockManager.currentBlock) return :
DOMRect { x: 0, y: 0, width: 0, height: 0, top: 0, right: 0, bottom: 0, left: 0 }

@ebrine
Copy link
Author

ebrine commented Dec 23, 2024

Hey @flo3ds are you suggesting that the bug is in "@editorjs/image": "^2.9.0" and not in this project (editor.js)?

I think the toolbar (with classes ce-toolbar, etc) is rendered in this repo's code, not in @editorjs/image.
Let me know if I'm missing something or if you have a suggestion for fixing

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Projects
None yet
Development

No branches or pull requests

3 participants