consuldemocracy / consuldemocracy

Consul Democracy - Open Government and E-Participation Web Software

Home Page:https://consuldemocracy.org

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Replace CKEditor 4 with a maintained editor

javierm opened this issue · comments

Background

CKEditor 4 reached its End of Life in June 2023. We're using it via the ckeditor gem, which has been barely maintained for years. Furthermore, we aren't upgrading to the latest versions of these gems because they require loading external JavaScripts files while browsing the site, which is something we try to avoid.

Requirements

  • The new editor will allow attaching images with ActiveStorage, or a way to add support for it will be provided.
  • The new editor will correctly load existing content generated with CKEditor 4 or a way to migrate the old content to the new editor will be provided.
  • Ideally, the new editor will provide easy ways to generate all the HTML tags we're currently using with CKEditor 4 (<h2>, <h3>, <p>, <ul>, <ol>, <a>, <strong>, <em>, <table>, <img>).
  • There should be at least a good chance that the new editor will be maintained for the foreseeable future.
  • The new editor will work for as many people as possible (this includes people using mobile phones, people using old browsers, ...).
  • People browsing the site won't need to download code from external URLs in order to make the new editor work.
  • The license of the new editor must be a free sofware license.
  • The interface of the new editor will be displayed in the same language as the rest of the page.
  • The size of the assets provided by the editor as well as the time it takes to load should be reasonable.
  • Bonus points if it allows either HTML or Markdown and can replace markdown-it as well.

Some options could be CKEditor 5, Trix, TipTap, Summernote, TinyMCE, ...

I have had a little play with tinymce using the tinymce gem which seems to work.

I have only done some initial tests but it does seem to read existing images ok.

The screenshots show tinymce being used to edit the Legislation homepage and successfully handle an image which was embedded using CKEditor.

The only issue I have seen is that it can be a little slow to load

Whether Tinymce is any better or worse than any of the other options I don't know, but it was an interesting diversion to get the basics of it working

image

image

Hi, @coslajohn 😄.

Thanks for the info! I've added TinyMCE to the list.

The only issue I have seen is that it can be a little slow to load

If I remember correctly, TinyMCE loads a lot of stuff, just like CKEditor. For CKEditor, we are limiting the loaded plugins to the minmum necessary. Maybe something similar could be done with TinyMCE 🤔.

I have only done some initial tests but it does seem to read existing images ok.

Just to clarify, AFAIK any editor capable of reading <img> tags will be able to read existing images. The tricky part would be attaching new ones 🤔.