[MGNLUI-6885] Upgrade to CKEditor 5 Created: 22/Dec/17 Updated: 21/Dec/23 |
|
| Status: | Open |
| Project: | Magnolia UI |
| Component/s: | None |
| Affects Version/s: | None |
| Fix Version/s: | None |
| Type: | Improvement | Priority: | Neutral |
| Reporter: | Julian Nodarse | Assignee: | Unassigned |
| Resolution: | Unresolved | Votes: | 16 |
| Labels: | dx-core-6.3, maintenance, tech-debt | ||
| Remaining Estimate: | Not Specified | ||
| Time Spent: | 0.25d | ||
| Original Estimate: | Not Specified | ||
| Issue Links: |
|
||||||||||||||||||||||||||||||||||||
| Template: |
|
||||||||||||||||||||||||||||||||||||
| Acceptance criteria: |
Empty
|
||||||||||||||||||||||||||||||||||||
| Task DoD: |
[ ]*
Doc/release notes changes? Comment present?
[ ]*
Downstream builds green?
[ ]*
Solution information and context easily available?
[ ]*
Tests
[ ]*
FixVersion filled and not yet released
[ ] 
Architecture Decision Record (ADR)
|
||||||||||||||||||||||||||||||||||||
| Date of First Response: | |||||||||||||||||||||||||||||||||||||
| Epic Link: | CKEditor 5 | ||||||||||||||||||||||||||||||||||||
| Team: | |||||||||||||||||||||||||||||||||||||
| Description |
|
We are currently using CKEditor version 4. Should we consider upgrading to CKEditor 5? Here are some links to consider: |
| Comments |
| Comment by Christopher Zimmermann [ 08/May/19 ] | ||||
|
https://ckeditor.com/docs/ckeditor5/latest/builds/guides/migrate.html "When compared to its predecessor, CKEditor 5 should be considered a totally new editor. Every single aspect of it was redesigned — from installation, to integration, to features, to its data model, and finally to its API. Therefore, moving applications using a previous CKEditor version to version 5 cannot be simply called an “upgrade”. It is something bigger, so the “migration” term fits better. There is no “drop in” solution for migrating. In this guide we hope to summarize the most important aspects you need to consider before you proceed with installing CKEditor 5." | ||||
| Comment by Chuck Aksamit [ 04/Mar/20 ] | ||||
|
It's been two years since this ticket was started and a year since the last comment. I wrote the related SUGGEST-113 ticket, so I'm looking to check in on this again! CKEditor 5 are now out of alpha, beta and up to release 17.0.0 as of a couple weeks ago. And yes it is a migration, possibly a new field altogether or a implementation that lets the dialog creator enable CKE5 via a property on the field definition. A comment on my ticket was related to Vaadin having integrations for CKE5. I did some searching and didn't see anyone working on CKE5/Vaadin yet but maybe Magnolia would have more clout than me in ask them for that? | ||||
| Comment by Richard Gange [ 05/Mar/20 ] | ||||
|
Hey caksamit- I don't see anything out there either. It doesn't look like CKE5 is a priority in the Vaadin ecosystem. It's something they consider to be an "add-on" rather than a component of the core product. The editor itself comes from a third party, obviously, so I think they rely on community contributions for things like that. For example, there is also CodeMirror which is another popular online editor. Also an add-on https://vaadin.com/directory/component/v-codemirror/overview. In the end, I'm not sure it's something we can request from them. I think it will take the efforts of an independent developer to make this happen. In any case I will keep an eye out for any new developments. Cheers | ||||
| Comment by Thomas Duffey [ 19/Mar/20 ] | ||||
|
Suggesting something like CodeMirror is likely missing the point. CKEditor is meant to provide a rich-text content management experience while CodeMirror and similar is a browser based code editor. A typical content manager won't benefit from the latter while the former is super important. The current ckeditor is getting old. It has features like "paste from word" that don't really work any more, yet people want to paste from Word. Lack of a modern rich text editor in Magnolia is becoming an issue. Is the stance really to just wait and see if someone else does it? | ||||
| Comment by Christopher Zimmermann [ 19/Mar/20 ] | ||||
|
Hi Tom, Is it an issue for many of your customers? Are there other concrete examples besides the "paste from word"? (which I agree is a strong argument already) I think a good next step for Magnolia would be to do some research on how much of an effort it would be to implement the vaadin addon. But even this takes time, so we need to compare the severity of this issue with others on our backlog - so any aditional input and/or rationales would help us. | ||||
| Comment by Richard Gange [ 19/Mar/20 ] | ||||
|
I just checked and the latest version of Magnolia uses ckeditor 4.11.3 which was released in February. If we can get Vaadin to update to 4.12+ we can get the paste from word feature. See https://ckeditor.com/blog/CKEditor-4.12-with-Paste-from-Word-enhancements-released/ | ||||
| Comment by Richard Gange [ 19/Mar/20 ] | ||||
|
See | ||||
| Comment by Chuck Aksamit [ 19/Mar/20 ] | ||||
|
@rgange I looked at While we all can recognize CKE4 is a long held staple in rich text editing on the web, the fact here is CKE5 is a redesigned, new editor because of the failings and inconsistencies of the previous CKE API and outdated JS development patterns used in the project. Javascript has came a long way in the last 8 years since CKE4 was originally released (even further if you compare back to the origins of the FCKEditor project in 2003) and it really shows when you try to build a new custom plugin for it, try to use it on a mobile device or even just try to provide two RichText fields in the same dialog with different configurations which is currently impossible. Not only is CKE5 written in and utilizes ES6+ features, it and it's plugins are now part of NPM and follow a industry standard process for install, initialization and error handling. Instantiation is greatly improve by isolating configuration between instances instead of relying on a global window.CKEDITOR object. When it comes to extending the editor, CKE5 further shines with more consistent and succinct API structure and events as well as support for ES6 Promises and Classes. It's all around a better tool for the plugin developer and I would say also for the new developer as the conventions used in CKE4 are so dated that schools, especially code camps, are not teaching them. https://ckeditor.com/docs/ckeditor5/latest/builds/guides/quick-start.html
But the complexities of custom development or inconsistencies with today's implementation patterns aside, there's also a lot of great new features in CKE5 that Magnolia could leverage as features to provide a richer, more communal and more mobile-friendly experience that our clients want today! I'll outline a small selection of them below. Collaboration https://youtu.be/TQG4yNVnGV4 Fine-tuned editor role separation https://ckeditor.com/docs/ckeditor5/latest/features/restricted-editing.html Improved link and media experience https://ckeditor.com/docs/ckeditor5/latest/features/link.html Mobile ready
I hope all of this illustrates where we see CKE4 as languishing and really only being viable as a desktop text editor wherein the administrator can do minimal custom text styling and maybe manage some table content. CKE5 on the other hand not only provides and improves on those features but offers features that could add to the capabilities of Magnolia itself and if integrated correctly, could provide a premium and feature-rich editing experience vs. the competition.
| ||||
| Comment by Christopher Zimmermann [ 20/Mar/20 ] | ||||
|
caksamit Thank you for that! The PM team will definitely take a deep look at CKE5, you've pointed out many things that are highly relevant for Magnolia's current path. However I could imagine that we may only be able to support a subset of the CKE5 features out-of-the box simply because they sound so powerful/complex and far-reaching. But would really only know after studing further. And as always, keep in mind that we have many exciting improvements to make and important maintenance to do - so we just have to evaluate and balance them. Also, re: From the comments there is obviously some frustration on all sides. Which is understandable, as sometimes things take way too long or don't happen. But please stay friendly guys! We're frustrated because we are all passionate about this product we work with every day. Hmmm, where are the dang emoticons here, Jira??? | ||||
| Comment by Marty Glaubitz [ 07/May/20 ] | ||||
|
Yo, any updates here? We need this update because our customers need support for soft line breaks and better table support | ||||
| Comment by Tobias Hitzfeld [ 26/Aug/20 ] | ||||
|
We're recognising that CKEdit and Chrome replaces SPACE characters with  . in Magnolia 5.7.7 sometimes. Found https://dev.ckeditor.com/ticket/11415 and https://github.com/ckeditor/ckeditor4/issues/3819. What about an upgrade? | ||||
| Comment by Simon Lutz [ 23/Sep/20 ] | ||||
| ||||
| Comment by Christopher Chard [ 31/Mar/21 ] | ||||
|
Hi there, | ||||
| Comment by Roman Kovařík [ 11/Nov/21 ] | ||||
|
Hey cchard, as there is no vaadin8 addon with CKEditor 5, the upgrade is blocked until Magnolia migrates to a newer vaadin version. Roman | ||||
| Comment by Richard Gange [ 27/Dec/21 ] | ||||
|
We did just update though --> CKEditor to 4.17.1 (see MGNLUI-6944). Maybe that helps a bit with plugin compatibilities. | ||||
| Comment by Cutolo Luigi [ 18/Apr/23 ] | ||||
|
Hello, since CKEditor 4 is going end of life in June 2023, as specified in this article , are you planning to update to version 5? Thanks Luigi | ||||
| Comment by Quach Hao Thien [ 19/Apr/23 ] | ||||
DiscoveryWhat's new in Ckeditor 5?
The new/upgraded features marked as bold might effect to the current implementation of RichTextField which extends from vaadin extension (https://github.com/alump/CKEditor) that we are using for Magnolia UI 6.2 Which customised plugins could be affected?File browser: filebrowser/plugin.js Magnolia expand: magnoliaexpand/plugin.js Magnolia link: magnolialink/plugin.js Which RichTextField could be affected?
These factories above using the MagnoliaRichTextField.java, which extends from the extension, also be affected. And stylesheet?
| ||||
| Comment by Roman Kovařík [ 19/Apr/23 ] | ||||
|
https://ckeditor.com/blog/ckeditor-4-end-of-life/#b-ckeditor-4-open-source-users
Looks like this is a no go anyway? The only option would be trying:
? | ||||
| Comment by Chuck Aksamit [ 19/Apr/23 ] | ||||
|
Looking at the Content Editor Module, I noticed it uses an inline CKEditor that looks like v5. Is that the case or is there some heavily customized v4 config in use there? The heading buttons stand out as v5 to me.
https://ckeditor.com/ckeditor-5/demo/editor-types/#inline
https://ckeditor.com/docs/ckeditor5/latest/features/headings.html#heading-buttons
| ||||
| Comment by Richard Gange [ 19/Apr/23 ] | ||||
|
Hey caksamit- That is v4 in the content editor. It's just been slimmed down. At the moment we are evaluating the effort to support ckeditor 5. One of the hurdles is Vaadin 8 doesn't offer a jar which supports ckv5. Also there seems to be some licensing issues to be sorted out with using v5. BR |