Problem/Motivation

As a developer, when you run into an issue with CKEditor 5, in particular a plugin, all files are minified and debug can be a challenge.
For instance running into #3273510: CKEditor 5 crash when multiple alignment buttons are activated due to duplicate configuration you may want to see what is going on in aligment.js file but you can't.
CKEditor console error.

It would be nice, for DX, to point at the documentation to install an unminified version.

Steps to reproduce

Try any reproduction scenario from a given CKE5 specific issue and try debugging. For instance the one given in description is a good candidate.

Proposed resolution

I suggest to add a message to the error message to point at the documentation. This really saves time as a developer.

Support from Acquia helps fund testing for Drupal Acquia logo

Comments

Dom. created an issue. See original summary.

Dom.’s picture

Providing here a demo patch for the idea.

Before:
CKEditor console error.

After:
CKEditor + DX message

Remaining task:

  • Is this approach good ?
  • Get an agreement on the wording
  • What is the documentation moves ?
marcvangend’s picture

Issue tags: +Documentation

Usually I would be cautious to add console.log/warn/error, but since there is a console.error already, I don't think that should be a problem. Some other thoughts:

  • Like you say, there is a risk in hard-coding documentation URLs. I don't know if there is an official policy for this (maybe we should discuss this with the documentation team?). Links to drupal.org in the current codebase mostly point to issues, not documentation. Those URLs tend to use the drupal.org/node/[nid] form instead of the aliased URL.
  • If we decide to do this, it should also be mentioned on the documentation page itself that it is linked to from code, to avoid someone accidentally breaking the link or (re)moving the content.
  • If the message recommends using an "unminified version of CKeditor", then as a user I expect to find these exact words on the documentation page. At the moment there is a disconnect between the (proposed) console message and the documentation, which speaks about "Build tools" and "Installing CKEditor 5 from source". It left me wondering if "installing from source" and "using an unminified version" are the same thing.
  • The added message is not really a warning. IMHO console.log() or console.info() is more appropriate.
Dom.’s picture

@marcvangend
Thanks a lot for review. Let me answer point by point here :

  1. totally makes sense. I am updating here the patch to link to the documentation via it's nid path
  2. I have added a sentence at the end of the documentation page for that purpose. Please could you review it also ? I am not a native speaker hence the wording is probably not good enough
  3. I have updated the documentation accordingly too, in particular by adding a --dev option to the command line for unminified purpose specifically
  4. console.log() make it "white" and lost among other console data. console.info() makes totally sense here though. I also updated the patch accordingly.
Wim Leers’s picture

Status: Needs review » Reviewed & tested by the community
Issue tags: -drupaldevdays +ddd2022, +DX (Developer Experience)

#2: love it! 🤩

Great feedback by @marcvangend, and already addressed by @Dom. — fantastic! I think there is zero chance of the link breaking because it's using the node ID, not the path alias.

This is unquestionably a DX improvement.

RTBC! (Only slightly clarified the handbook page 🤓)

bnjmnm’s picture

Status: Reviewed & tested by the community » Needs work
+++ b/core/modules/ckeditor5/js/ckeditor5.es6.js
@@ -469,6 +469,7 @@
+          console.info('Debugging can be done with an unminified version of CKEditor by installing from the source file. Consult documentation at https://www.drupal.org/node/3258901')

The documentation page this references outdated The

yarn dll:build --dev

command was removed a while back. There is currently no command in core to build an unminified version.

Wim Leers’s picture

Status: Needs work » Needs review

@bnjmnm But then … wouldn't it be better to still commit this and then update the handbook page later? That would at least point users in a helpful direction? 😊

Wim Leers’s picture

bnjmnm’s picture

wouldn't it be better to still commit this and then update the handbook page later? That would at least point users in a helpful direction?

If it pointed them in a helpful direction, yes. In this case they're directed to an outdated documentation page that has objectively incorrect information. It's bad enough this page is up to begin with. If someone is directed there intentionally, it gives them all the more reason to believe that something is wrong on their end, not the documentation. They could waste time trying to get a feature to work that doesn't actually exist.

bnjmnm’s picture

Oh this is for installing an entire separate CKEditor, not an unminified version in core. That's my mistake.
At one when this was in contrib we were doing more direct interaction with dll and could create an unminified instance pretty easily. It kinda looked like that so I decided it was that 🤭. If this process works with the core plugins it sounds fine, especially if it benefits the dev days participation I've been pleased to see happening.

Version: 9.4.x-dev » 9.5.x-dev

Drupal 9.4.0-alpha1 was released on May 6, 2022, which means new developments and disruptive changes should now be targeted for the 9.5.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

Version: 9.5.x-dev » 10.1.x-dev

Drupal 9.5.0-beta2 and Drupal 10.0.0-beta2 were released on September 29, 2022, which means new developments and disruptive changes should now be targeted for the 10.1.x-dev branch. For more information see the Drupal core minor version schedule and the Allowed changes during the Drupal core release cycle.

smustgrave’s picture

Status: Needs review » Needs work

Needs reroll for 10.1

smustgrave’s picture

Status: Needs review » Needs work

The last submitted patch, 14: 3273532-14.patch, failed testing. View results

smustgrave’s picture

Status: Needs work » Needs review

Think this is a random failure.

nod_’s picture

Why the string split? it's not usual to do that in the JS

smustgrave’s picture

Thought I would be dinged for the 80 character limit but think I got that mixed up. Uploaded a patch with no breaks.

nod_’s picture

Status: Needs review » Reviewed & tested by the community

all good for me :)

alexpott’s picture

Version: 10.1.x-dev » 10.0.x-dev
Category: Support request » Task
Status: Reviewed & tested by the community » Fixed

Committed and pushed 58b45dcb6f to 10.1.x and 8bed000244 to 10.0.x. Thanks!

We could backport this to Drupal 9 if people want to.

  • alexpott committed 58b45dc on 10.1.x
    Issue #3273532 by Dom., smustgrave, Wim Leers, bnjmnm, marcvangend:...

  • alexpott committed 8bed000 on 10.0.x
    Issue #3273532 by Dom., smustgrave, Wim Leers, bnjmnm, marcvangend:...
Wim Leers’s picture

Version: 10.0.x-dev » 9.5.x-dev
Status: Fixed » Reviewed & tested by the community
FileSize
1.41 KB

Let's do that. Many people won't be jumping to 10, but will be making the small step to 9.5, and hence will be developing/testing CKEditor 5 in there, so … 🙏

alexpott’s picture

Status: Reviewed & tested by the community » Fixed

Committed dfacc85 and pushed to 9.5.x. Thanks!

  • alexpott committed dfacc85 on 9.5.x
    Issue #3273532 by Dom., smustgrave, Wim Leers, bnjmnm, marcvangend:...

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.