Uncaught CKEditorError: ckeditor-duplicated-modules

[roykoper]

Q	A
Sulu Version	2.5.9
PHP Version	8.2.4
DB Version	MariaDB 10.5.8
Browser Version	Chrome 111.0.5563.110

Actual Behavior

An error when changing the ckeditorConfigRegistry

Expected Behavior

No error with an adjusted toolbar according to the new configuration

Steps to Reproduce

I encountered this error in a customer's project, and to make sure it's not limited to this project I tried it using the latest build of Sulu.

1. composer create-project sulu/skeleton my-project -n
2. Setup .env, database etc
3. cd admin/assets
4. npm install @ckeditor/ckeditor5-font
5. Update app.js to the following:

// Add project specific javascript code and import of additional bundles here:
import {ckeditorPluginRegistry, ckeditorConfigRegistry} from 'sulu-admin-bundle/containers';
import Font from '@ckeditor/ckeditor5-font/src/font';

// Implement custom extensions here

ckeditorPluginRegistry.add(Font);
ckeditorConfigRegistry.add((config) => ({
    toolbar: [...config.toolbar, 'fontColor'],
}));

6. cd ../../
7. bin/console sulu:admin:update-build (but don't overwrite package.json or app.js)
8. Go to <your_host>/admin
9. Observe error as shown in Actual Behavior

[alexander-schranz]

When you run npm install @ckeditor/ckeditor5-font you will get a false version of the ckeditor package which is not compatible with the sulu version. Please check the version matrix here to get to install the correct version of the ckeditor package:

sulu/sulu-demo#77 (comment)