ckeditor5
ckeditor5 copied to clipboard
[Balloon editor] Inserting and deleting image from link crashes editor
📝 Provide detailed reproduction steps (if any)
- Open balloon editor example http://127.0.0.1:8080/ckeditor5/latest/examples/builds/balloon-editor.html
- Place a collapsed selection in the middle of a link
- Open balloon toolbar with ALT+F10
- Insert an image
- Delete an image (with delete, not undo)
✔️ Expected result
Image disappears, editor continues working
❌ Actual result
Image gets deleted but editor crashes
📃 Other details
- Browser: Chrome, Mozilla Firefox, Safari
- OS: MacOS
- First affected CKEditor version: current release since it was impossible to open balloon toolbar with keyboard in earlier versions
Stack trace:
Uncaught TypeError: Cannot read properties of undefined (reading 'values')
at Zd._getBalloonPosition (snippet.js:4:367780)
at Zd._showView (snippet.js:4:367632)
at Zd.remove (snippet.js:4:365379)
at Cg._hideToolbar (snippet.js:4:500991)
at Cg._updateToolbarsVisibility (snippet.js:4:500919)
at Au.<anonymous> (snippet.js:4:499673)
at Au.fire (snippet.js:4:3066)
at Au.update (snippet.js:4:319826)
at Object.<anonymous> (snippet.js:4:319749)
at Object.fire (snippet.js:4:3066)
Uncaught CKEditorError: view-renderer-filler-was-lost
Read more: https://ckeditor.com/docs/ckeditor5/latest/support/error-codes.html#error-view-renderer-filler-was-lost
at Xo._removeInlineFiller (snippet.js:4:97410)
at Xo.render (snippet.js:4:95325)
at Va._render (snippet.js:4:141813)
at Va.<anonymous> (snippet.js:4:138214)
at Va.fire (snippet.js:4:3066)
at Va.change (snippet.js:4:141107)
at snippet.js:4:542083
Uncaught CKEditorError: cannot-change-view-tree
Read more: https://ckeditor.com/docs/ckeditor5/latest/support/error-codes.html#error-cannot-change-view-tree
at Va.change (snippet.js:4:140767)
at Va._disableRendering (snippet.js:4:141717)
at Dl.listenTo.priority (snippet.js:4:207029)
at yh.fire (snippet.js:4:3066)
at yh._runPendingChanges (snippet.js:4:296719)
at yh.change (snippet.js:4:293203)
at snippet.js:4:424334
at fa.<anonymous> (snippet.js:4:422051)
at fa.fire (snippet.js:4:3066)
at fa.set [as isFocused] (snippet.js:4:5647)
If you'd like to see this fixed sooner, add a 👍 reaction to this post.
2 notes after debugging this issue:
Reproduction steps clarification
It won't occur unless the image toolbar replaces the link actions view on the inserted image element.
Issue will occur in this scenario:
Issue won't occur in this scenario:
Similarly, if you move selection away after inserting an image and then focus it back without triggering the link actions view first, the error won't be thrown. This seems to be heavily connected with the interaction between link actions view and toolbars, so this issue should be considered while working on ckeditor/ckeditor5#12333.
Bug details
It is not well visible in the docs, but the link actions balloon actually tries to attach to the element that is no longer in DOM (a span that is a wrapper for the image), so it ends up in the corner of the screen:
It's easier to notice in the manual test:
At first I thought the bug is somewhere in EditorUI#addToolbar()
and the whole focus management and navigation on Alt+F10 but it does not look like the case.
It's more likely that the ability to open and display the balloon toolbar using Alt+F10 when the LinkActionsView
is visible that we introduced in the toolbar accessibility project is pushing the ContextualBalloon
plugin into a state that was not previously possible. I briefly checked this and there's something odd happening to the stacks in the ContextualBalloon
. Understanding what is going on there will require more research.
There has been no activity on this issue for the past year. We've marked it as stale and will close it in 30 days. We understand it may still be relevant, so if you're interested in the solution, leave a comment or reaction under this issue.
We've closed your issue due to inactivity over the last year. We understand that the issue may still be relevant. If so, feel free to open a new one (and link this issue to it).