Provide an upgrade path from "codesnippet" contrib CKEditor 4 plugin to "CodeBlock" core CKEditor 5 plugin

Created on 27 April 2023, over 1 year ago
Updated 31 August 2023, about 1 year ago

Problem/Motivation

Similar previous issue: #3274278: Migrate "codetag" contrib CKEditor 4 plugin to built-in equivalent in core's CKEditor 5 .

#3263384: Add ckeditor5-code-block package and CodeBlock plugin added the CKEditor 5 CodeBlock to Drupal core's CKEditor 5 build. That means that https://www.drupal.org/project/codesnippet was largely obsolete. Which is why it has not seen movement in the past year at 📌 Drupal 10 & CKEditor 5 support Needs work .

The two missing features in core compared to the https://www.drupal.org/project/codesnippet contrib module for CKEditor 4:

  1. The ability to configure which languages are available for the content creator to select from
  2. The ability to apply syntax highlighting

Steps to reproduce

  1. install and enable https://www.drupal.org/project/codesnippet
  2. Add the CodeSnippet button to a CKEditor-enabled text format:
  3. Configure it:
  4. Attempt to upgrade from CKeditor (4) to CKEditor 5. Also, notice the error that the button is not added:
  5. With the proposed patch, switching from CK4 to CK5 does not trigger warning, and the button is present in the same location in the toolbar. And it has the same configuration:

Proposed resolution

After #3263384: Add ckeditor5-code-block package and CodeBlock plugin landed, Ability to configure additional languages (e.g. "bash" or "SQL") for CKEditor 5 CodeBlock plugin Fixed was opened. That landed yesterday. That means the first missing feature is now addressed.

That only leaves syntax highlighting. Drupal core should not do that. But … it really was also not a concern for a CKEditor plugin either! So I did the research (see #3269387-16: Drupal 10 & CKEditor 5 support ) and found that there's two solutions available in contrib today:

  1. https://www.drupal.org/project/highlight_php — with #3287893-4: Automated Drupal 10 compatibility fixes applied
  2. https://www.drupal.org/project/highlightjs_input_filter — tested with version 1.0.1

Furthermore, syntax highlighting is only cosmetic — the text editor UX and the data model (stored markup) are unaffected by syntax highlighting absence/presence

That means that Drupal core should provide an upgrade path from https://www.drupal.org/project/codesnippet to Drupal core's CodeBlock plugin, just like we did in #3274278: Migrate "codetag" contrib CKEditor 4 plugin to built-in equivalent in core's CKEditor 5 .

Remaining tasks

None.

User interface changes

None.

API changes

None.

Data model changes

None.

Release notes snippet

Sites switching a text format using CKEditor 4 with the https://www.drupal.org/project/codesnippet plugin enabled will automatically have their settings upgraded for an equivalent text editor user experience.

📌 Task
Status

Fixed

Version

10.1

Component
CKEditor 5 

Last updated 2 days ago

Created by

🇧🇪Belgium wim leers Ghent 🇧🇪🇪🇺

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.71.5 2024