Contrib.social

CKEditor 5 merges adjacent lists, AdjacentListsSupport plugin fixes this

Open on Drupal.org →
Created on 17 November 2023, about 1 year ago
Updated 15 July 2024, 5 months ago

Problem/Motivation

The CKEditor 5 list plugin will merge two adjacent lists into one by default. This can be adverse behavior for users who are pasting in lists that are separated and delineated by some attribute on the lists.

Steps to Reproduce

When editing a formatted text field using Ckeditor 5

  1. switch the editor to source mode.
  2. Paste in two unordered lists that have each have a unique class. Something like: 
    <ul class="red-list">
    <li>red list item 1</li>
    <li>red list item 2</li>
</ul>
<ul class="blue-list">
    <li>blue list item 1</li>
    <li>blue list item 2</li>
</ul>
  3. Turn off source mode, switching back to the wysiwyg editor. You will see the lists were merged into one. If you switch back to source mode you will see this: 
    <ul class="red-list">
    <li>
        red list item 1
    </li>
    <li>
        red list item 2
    </li>
    <li>
        blue list item 1
    </li>
    <li>
        blue list item 2
    </li>
</ul>

Proposed resolution

Add the AdjacentListsSupport plugin that was introduced in ckeditor5 38.1.0. This disables the behavior described above. With this plugin the example given would result in the same code that was inserted in by the user.

Here is the Ckeditor 5 issue that resulted in the creation of this plugin: https://github.com/ckeditor/ckeditor5/issues/13945

📌 Task
Status

Needs work

Version

11.0 🔥

Component
CKEditor 5  →

Last updated 2 days ago

Created by

dk-massive

Live updates comments and jobs are added and updated live.
  • Needs tests

    The change is currently missing an automated test that fails when run with the original code, and succeeds when the bug has been fixed.

Sign in to follow issues

Comments & Activities

contrib.social Blog FAQ Discussions
Production build 0.71.5 2024