search

backdrop / backdrop-issues

Issue tracker for Backdrop core.
144 stars 40 forks source link

Add support for CKEditor 5 (CKEditor 4 becomes EoL in 2023) #4122

Closed klonos closed 10 months ago

klonos commented 5 years ago

The update to CKEditor 5 in the Drupal community has been bumpy. We are hoping to avoid most of that frustration for our community.

Plan for updating to CKEditor 5:

TODOs for the ckeditor5 module (incomplete)

Original post:

CKEditor 4 to 5 is a big change, similar to the D7 to D8 move:

https://support.ckeditor.com/hc/en-us/articles/115005971405-How-to-migrate-from-CKEditor-4-to-CKEditor-5-

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. Please refer to this guide to see a summary of the most important aspects to be taken into consideration before you proceed with migrating to CKEditor 5.

https://www.drupal.org/project/ckeditor5_sections

From Paragraphs to Sections - Next level Drupal content editing (DrupalCon Amsterdam - Session Proposal)

Add optional support for CKEditor 5 in D9 so we can remove CKE 4 from Drupal 10

... General requirement: the high-level existing features documented at https://www.drupal.org/docs/8/core/modules/ckeditor/overview continue to exist. If there are strong reasons to not have those features anymore, it needs sign-off from Drupal product managers. Those are: structured content, clean markup, integrates with filter system, paste from Word/Google Docs, drag-and-drop text editor configuration UI, strong safety guarantees, contrib extensibility.

...

Drupal 9 + CKE4 security support The CKEditor team guarantees security fixes for CKEditor 4 until early 2024. This allows us to ship CKEditor 4 with Drupal 9 without the need to shorten Drupal 9's release cycle 🥳 (if CKEditor 4 security support would end in early 2023 like we first thought might be the case, Drupal 9's life would be shorter than 3 years).

...

in today's CKEditor 5 any HTML that that does not have a CKE5 converter will result in data loss.

From https://wimleers.com/blog/cke5-gcw#fn:3

In a nutshell: CKEditor 4 leverages the browser as much as possible. Consequence: any tiny difference in behavior across browsers in low-level APIs has a huge negative impact. CKEditor 5 therefore avoids using the browser for many low-level operations, and re-implements many things. This way, it can guarantee consistency and reliability. But consequently, not all HTML is natively supported anymore!

klonos commented 4 years ago

Discussion in d.org (issue against Drupal 9.1.x): [META] Select the best modern editor for Drupal 9

klonos commented 4 years ago

How long will CKEditor 4 be supported?

CKEditor 4 is a stable and mature application, which had its initial release at the end of 2012 and has been actively developed and improved since then. The CKEditor 4.x line is under a “Long Term Support” (LTS) programme which means that its development and support is guaranteed until 2023. If you are looking for a proven solution that will be fully supported for years, CKEditor 4 is a perfect choice.

klonos commented 3 years ago

There's some encouraging progress in Drupal-land re CKEditor 5:

Would be great if we had some 👀 on the code in the contrib https://www.drupal.org/project/ckeditor5 and see if it can be backported to Backdrop. I'm thinking that @quicksketch would be the most suitable person to do this, and provide feedback re whether this is doable, and rough estimate on the amount of work required. Another point to look into is whether this is doable in 1.x, or still best left for 2.x.

klonos commented 3 years ago

Update: we briefly mentioned this towards the end of the weekly dev meeting, but unfortunately we run out of time. This will be added to the dev agenda for next week though, so stay tuned!

klonos commented 3 years ago

We should keep an eye on https://www.drupal.org/project/wysiwyg/issues/3123281 and https://github.com/enu-sav/RS/tree/cke5

I have ported CKEditor5 to Drupal using the Wysiwyg module. In a minimalist way, with no configuration GUI on Drupal site, all configuration is supposed to be done by means of CKeditor's own tools. It consists of two files ckeditor5.inc and ckeditor5.js.

... I just took the most simple editor supported by the wysiwig module and based on it I added ckeditor5 (i. e. without any possibility to configure it from Drupal - this is probably possible but for me configuring through the js file is currently good enough for me).

izmeez commented 2 years ago

I added an item in the Backdrop CMS Forum Initiatives on this subject Plans for CKEditor 4 EOL in 2023 and CKEditor 5 changes and was advised of this issue. In the forum I provided a link to an interesting detailed video from May 2021, Reimagining the WYSIWYG CKEditor 5 in Drupal Core / DrupalCon North America 2021. I'm actually asking is CKEditor 5 the way to go for Backdrop CMS or will it be better to consider the wysiwyg module with another visual editor or a change to the Gutenberg editor?

laryn commented 1 year ago

So if I understand it correctly, Drupal 10 has CKEditor 5 out of the box. Does anybody know if they were they able to make the transition relatively seamless?

avpaderno commented 1 year ago

@laryn For what I recall, it wasn't a smoothless transition. There have been many issues in the CKEditor5 module queue and in the Drupal core queue.

klonos commented 1 year ago

Yeah, I hear that there's been efforts to automate transition, but the move is kinda "bumpy" after all - that's why they include both CKE v4 and v5 in core. I believe that new sites/installations enable v5 OOTB by default, whereas existing sites upgrading from previous versions of Drupal have the option to keep using v4.

This is what I got on a vanilla 9.5.x installation:

image

jenlampton commented 1 year ago

I think we should create a ckeditor5 contrib module (much like the Drupal core ckeditor5 module) and allow people who are building new sites to start using the new module now, if they want to.

In Drupal world there is currently an upgrade path for the text formats, but there is no upgrade path for content (as of Dec 2022). Editing pages in CKE5 that were created in CKE4 is still a problem. And many modules that provided CK4E add-ons have not been updated for CKE5.

For backdrop, these are the contrib modules that have CKE4 add-ons (as of Dec 2022)

olafgrabienski commented 1 year ago

In Drupal world [...] there is no upgrade path for content (as of Dec 2022).

Is there a Drupal page with information about the status of the upgrade path for content? I've only found a page about testing the upgrade path, but it doesn't mention the current status.

klonos commented 1 year ago

@olafgrabienski I don't have a good answer for that - last time I heard about it I think it was in a youtube video about the state of CKE5, so this is from memory.

https://www.drupal.org/project/drupal/issues/3304736 however starts with the following,:

We have a reliable CKEditor 4 → 5 upgrade path (see \Drupal\ckeditor5\SmartDefaultSettings and related infrastructure). But it's still manual.

...so things might have changed since. As you keep reading though, you'll see that things are not that simple. It also seems that there's some work that will need to be done in contrib, which is being coordinated in https://www.drupal.org/docs/core-modules-and-themes/core-modules/ckeditor-5-module/upgrade-coordination-for-modules-providing-ckeditor-4-plugins

I hope that this helps.

izmeez commented 1 year ago

I have my doubts about bothering with an upgrade to CKEditor 5 especially seeing it now includes a premium paid version for some features such as collaboration. It might make more sense to focus on the Wysiwyg module with support for TinyMCE and other editors.

klonos commented 1 year ago

...especially seeing it now includes a premium paid version for some features such as collaboration.

That has always been the case @izmeez - even with CKEditor v4. The product has always had "premium" (paid-for) features, but these were completely optional and there was no "intrusive pressure" to use these.

I understand your concerns, but CKEditor has been selected after very careful consideration for both Backdrop and Drupal 8+. Other than the technical reasons behind the specific choice, the main reason for including a WYSIWYG editor by default in the CMS has also been for a very good reason: better out-of-the-box user experience. Instead of having to download and install and configure dozens of separate modules and libraries in order to get the functionality most people need, you get all that effortlessly. Also, having the editor be part of core, you get better integration with other subsystems (such as the media library, and permissions for specific text formats and filters etc.). This is not a thing only for Backdrop/Drupal - all modern/popular CMS'es out there have a default editor that ships with the core product.

Lastly, since you seem to be concerned with premium features, have you checked https://www.tiny.cloud/pricing ? 😉

jenlampton commented 1 year ago

We've been talking about this issue quite a lot recently, but there have been no updates here which surprises me. I'm going to post an update to the Original Post with our course of action for how we'll be moving to CKE5. It's still open for discussion, but as our plans change we should update the post so it remains current.

klonos commented 1 year ago

Enable this module by default for new installs

Do we need to consider the case of new Backdrop sites that are being provisioned in order to have D7 content upgraded/migrated over? 🤔

Also, namespace-wise, is there value in having 2 separate modules, or should we make a single ckeditor module that loads the selected version of the CKEditor library? (similarly to how we are implementing the jQuery v1 vs. v3 switch in #3106). That way, we won't be needing to keep updating the name of the module as new versions of CKEditor are being released and we upgrade to them. If there are technical reasons to go with versioned machine names and have separate modules, and/or if that makes things easier, then fair enough.

avpaderno commented 1 year ago

CKEditor 5 is a completely different library, written from scratch. On the contrary, jQuery 3.0 has not changed all its API, respect to jQuery 1.0. Having a single module that handles both CKEditor 5 and CKEditor 3 would be more problematic than having a module for each library.

klonos commented 1 year ago

Right. Thanks @kiamlaluno 👍🏼

herbdool commented 1 year ago

Part of me wants to sit on my laurels and wait until it is backported to the 400,000 Drupal 7 sites that will be EOL. Or at least to those supported by the LTS.

herbdool commented 1 year ago

Or maybe more likely the LTS will patch Ckeditor 4.

quicksketch commented 1 year ago

I've stubbed out a CKEditor 5 module, forking from the core ckeditor (4) module. Hardly anything works and I'm still figuring out how to load external plugins, but it's a start: https://github.com/quicksketch/ckeditor5/

Once I get the basics working I'll transfer the repository into contrib if that seems like the way we want to manage the initial version.

herbdool commented 1 year ago

@quicksketch awesome! Yes, let's put it into contrib first when you feels it's ready to go there.

quicksketch commented 1 year ago

I figured out loading plugins and now most of the toolbar can be configured. I had to manually (for now) assemble the CKEditor build to get a version that worked with loading plugins. We could either script the process of assembling CKEditor packaged versions or hopefully there may be some progress on this issue filed against CKEditor core: https://github.com/ckeditor/ckeditor5/issues/10142 so we won't have to do it in the future.

klonos commented 1 year ago

For the people watching this thread here, can you please head over to https://github.com/ckeditor/ckeditor5/issues/10142 and react with a 👍🏼 in the issue summary? That seems to be a way in which the CKEditor maintainers/community gauges the popularity of a request, so lets show them how many people are affected, shall we?

klonos commented 1 year ago

This will need to happen sooner than 2.x (as discussed in recent weekly dev meetings), so I've moved the milestone to 1.x (no due date).

quicksketch commented 1 year ago

I'm nearly ready to transfer https://github.com/quicksketch/ckeditor5 to contrib. Things are coming together.

I've also started filing issues against the project to denote things yet to be done: https://github.com/quicksketch/ckeditor5/issues

If anyone wants to hammer on it, please give it a shot. File issues or ping me on Zulip under the CKEditor 5 thread.

tygrus2 commented 11 months ago

1) Would it be possible to have the "CKEditor v5" available for new pages while leaving "CKEditor v4" still available to edit existing pages/section? 2) Would it possible to allow the user to test the v4->v5 conversion on a page, check the preview & help fix what can't be done automatically (check what fails & offer help to common problems)? So the v4->v5 is done 1 page at a time at the user request.

v4 & v5 are both available by setting a flag on the page/section so editing & page generator know which version was used.

quicksketch commented 11 months ago

Would it be possible to have the "CKEditor v5" available for new pages while leaving "CKEditor v4" still available to edit existing pages/section?

Yes, if you set up an additional text format, you could have the old one that runs CKEditor 4, while the new text format is configured for CKEditor 5, then switch one piece of content at a time from the old format to the new format. Though eventually you may want to eliminate the old text format, and it might be difficult to track down every last place where the old format was used.

klonos commented 11 months ago

@tygrus2 as @quicksketch said, yes, what you are asking is possible. Allow me to provide some more detailed steps in order to help you (and anyone else reading this thread) with that:

  1. For now, please install and enable the contributed CKEditor 5 module https://github.com/backdrop-contrib/ckeditor5 (if everything goes according to plan, it will be in Backdrop CMS core in version 1.27.0, which is scheduled for release in January 15, 2024, so you will not need to install the contributed module - you will only need to enable it in core for existing sites - for new sites, CKEditor 5 will be the default and CKEditor 4 will be disabled/hidden)
  2. With the CKeditor module enabled, head over to this page from the admin bar: Configuration > Content authoring > Text editors and formats (admin/config/content/formats)
  3. Click the "+ Add text format" link at the top-left
  4. Give the new format a name that will make it easier to distinguish from the one you are currently using with CKE4. Something obvious like "CKE5" perhaps, but up to you. You can change this name that is shown to editors later (not the machine name though - so make sure you have that as you need it to be)
  5. In the "Text editor" option, select "CKEditor 5". That should show the "CKEditor Toolbar" section.
  6. Configure the same set of buttons that you have in the text format that uses CKE4.
  7. Also configure the same set of settings further down the form.
  8. In the "Roles" section, you can configure the same as CKE4, or of you want only specific people to be able to test this initially, select only some admin roles.
  9. Save the configuration.

Now, when editing/creating content, you should be able to see the option to switch to CKE5: image

In the screenshot above, the "Filtered HTML" option is using CKE4.

Bonus: if you want to specify which editor will be the default, you can reorder the available formats in the "Text editors and formats" page (admin/config/content/formats). The one at the top will be what is selected by default when creating new content. When editing existing content, the editor that was used to create that content will be selected by default (or the editor that was used last to edit it).

I hope that this helps people with their testing 🙂

stpaultim commented 11 months ago

There was talk in today's dev meeting about merging the contrib module into core as quickly as possible to allow time for testing before the next major release. The thought was that this might happen shortly after the next bug fix release.

klonos commented 11 months ago

The thought was that this might happen shortly after the next bug fix release.

...which we agreed to try and get out today (or tomorrow - things are relative with timezones 😅 ) - watch the recording at this point for more: https://youtu.be/p3ES2r4XNsU?t=868

We also discussed about writing a blog post to outline our plans for CKE4 and CKE5 + update also our documentation (or create new documentation if needed).

quicksketch commented 11 months ago

There are a lot of updates this week as we move towards getting a PR ready for core:

I know it seems like this issue has been fairly quiet as most work has been happening in the CKEditor 5 contrib issue queue. Once we get the PR filed against core, the discussion will move here, and then subsequent issues we'll start handling in the core queue as well.

quicksketch commented 11 months ago

I made an initial PR the includes all contrib history here: https://github.com/backdrop/backdrop/pull/4604

Its a little weird and neat that because we forked from core's ckeditor.module when starting CKEditor 5, all the history from CKEditor 4 is also maintained. It's a little excessive, but it could be useful in identifying cruft code that hasn't changed since the CKEditor 4 module was written in 2015.

There definitely some clean-up that needs to occur yet, like removing the separate GitHub Actions configuration files. But hey, it does indeed make CKEditor 5 show up in core as part of the sandbox:

image

quicksketch commented 11 months ago

PR updated to remove contrib-specific cruft, fix the few minor test failures.

For now I have left the full ckeditor5 library inside of the module. IMO just leaving it there would be completely fine, rather than moving it to misc alongside the CKEditor 4 library. The CKEditor 5 library includes special instructions and a build script, and updating the library requires also updating the .module file. We can move the library if desired of course.

For other major adjustments, like enabling CKEditor 5 by default and hiding CKEditor 4, those might be better in follow-up issues?

I think this is ready for review.

herbdool commented 11 months ago

I agree with leaving the library in the module. It's fairly unlikely that someone would use the library without using the module.

laryn commented 11 months ago

I've done some testing on a local with real-world data:

I found a few minor stylistic issues with Gin (which I'll deal with separately) but as far as this core integration I think it's looking amazing. From a basic functionality perspective, I'd be comfortable merging this and filing followups as needed for any tweaks or improvements from there.

laryn commented 11 months ago

One more round of applause for @quicksketch and @indigoxela 👏 👏 👏

quicksketch commented 11 months ago

In the interest of time and completing follow-ups, can this be marked RTBC?

herbdool commented 11 months ago

I've marked it RTBC. I've done a cursory review of the code, plus read up on other people's feedback. So let's merge!

quicksketch commented 11 months ago

Excellent, thank you @herbdool and @laryn! I did a full traditional merge for this PR so all history is left intact (rather than our usual squash-merge). I'll start filing follow-ups. https://github.com/backdrop/backdrop/pull/4604 has been merged into core for 1.27.0!

quicksketch commented 11 months ago

I filed these follow-ups and updated the summary.

We should probably leave this issue open until we finish the change record.

indigoxela commented 11 months ago

@quicksketch many thanks for opening the issues. :+1: Do we have one that covers status page display, yet? Currently only CKE4 is covered on the status page.

quicksketch commented 11 months ago

Do we have one that covers status page display, yet? Currently only CKE4 is covered on the status page.

No we don't. CKE5 outputs the same message as CKE4: CKEditor 5 is installed but not enabled on any formats., etc. But there isn't any kind of warning about upgrading or uninstalling CKE4. I can't remember what we were planning for status messages. I opened a new issue at https://github.com/backdrop/backdrop-issues/issues/6346

indigoxela commented 11 months ago

CKE5 outputs the same message as CKE4

Partly, yes. It shows the "not enabled" warning, but doesn't show the version as v4 does/did. I saw that hook_requirements() differs a bit between 4 and 5 modules. So CKE5 doesn't show up at all on the status page, if there's no problem. That might be by intention, though. The editor version ships with core, so people may not need its exact version info. Or is that an oversight?

quicksketch commented 11 months ago

Version number missing is an oversight.

On Fri, Dec 22, 2023, 10:13 PM indigoxela @.***> wrote:

CKE5 outputs the same message as CKE4

Partly, yes. It shows the "not enabled" warning, but doesn't show the version as v4 does/did. I saw that hook_requirements() differs a bit between 4 and 5 modules. So CKE5 doesn't show up at all on the status page, if there's no problem. That might be by intention, though. The editor version ships with core, so people may not need its exact version info. Or is that an oversight?

— Reply to this email directly, view it on GitHub https://github.com/backdrop/backdrop-issues/issues/4122#issuecomment-1868218778, or unsubscribe https://github.com/notifications/unsubscribe-auth/AAAYO3XTB7GBVKXX64VZBWLYKZZBDAVCNFSM4I7DQZMKU5DIOJSWCZC7NNSXTN2JONZXKZKDN5WW2ZLOOQ5TCOBWHAZDCOBXG44A . You are receiving this because you were mentioned.Message ID: @.***>

quicksketch commented 10 months ago

I drafted and published the CKEditor 5 change notice at https://docs.backdropcms.org/change-records/ckeditor5-upgrade

There is definitely a lot more that could be written, but it should suffice for the purposes of the release and closing this issue.

herbdool commented 10 months ago

@quicksketch just reading it now. Overall looks good - I noticed you fixed a couple issues I did see.

izmeez commented 10 months ago

@quicksketch Great little intro for ckeditor5, a good informative start. Thanks.