CKEditor 5 Content Filtering Doesn't Work

Problem/Motivation

Due to changes in the underlying system between CKEditor 4 and 5, this is going to require a significant amount of effort and likely re-evaluation of what is possible and needed for support in our existing patterns.

In CKEditor 4, the Advanced Content Filter module allowed for the specification of allowed and disallowed content rules using string values. In the integration with Patternkit, we enabled patterns to specify these rules within the schema using the options.allowedContent and options.disallowedContent values that were passed directly into the CKEditor configuration.

CKEditor 5 no longer supports the string-based definition of these rules and instead requires a more elaborate specification using an object format. The challenge this presents is that existing patterns are in use with the string-based rules, but maintaining the same behavior in CKEditor 5 would require either a migration of those rules to the object format at the pattern level or a conversion into the object format within the CKEditor Patternkit integration. Placing the migration responsibility on the patterns is the safest route since it would enable them to ensure the configuration is maintained as expected. Attempting to instead convert the existing string rules into objects would open up a lot of opportunity for bugs and incomplete support as we try to dynamically interpret any mixture of valid and potentially invalid filters a pattern may present.

Since CKEditor 4 also supports the same object format, ensuring usage of that format is passed along appropriately in both CKeditor 4 and 5 would offer an opportunity for sites to migrate their configuration while still on CKEditor 4 before upgrading to version 5 and losing the functionality altogether.

Steps to reproduce

1. Enable the following modules:
   • Patternkit
   • Patternkit Example
   • Layout Builder
   • CKEditor 5
2. Configure the Full HTML filter format to use CKEditor 5 (/admin/config/content/formats)
3. Configure CKEditor 5 for usage by Patternkit in the Patternkit settings under the "JSON Pattern Library Settings" tab (/admin/config/user-interface/patternkit/json):
   • Set "WYSIWYG editor" to CKEditor5
   • Select the configured filter format in the "CKEditor toolbar" field
4. Enable Layout Builder with node-specific overrides on the Basic Page content type
5. Create and save a new Basic Page Node
6. Edit the layout for the new page
7. Place a new "[Patternkit] Example with Filtered Content" block
8. Observe the notes on the field explaining content filtering
9. Observe all buttons are enabled in the CKEditor field
10. Populate the WYSIWYG field with content that should be filtered according to the description
11. Save the block
12. Observe the content was saved and displayed

Proposed resolution

Remaining tasks

Implement object rule based filtering in CKEditor 5
Update example patterns to demonstrate new filtering usage
Add automated tests validating pattern filtering
Document migration path for existing pattern implementations

User interface changes

API changes

Data model changes