ckeditor / ckeditor5

Powerful rich text editor framework with a modular architecture, modern integrations, and features like collaborative editing.
https://ckeditor.com/ckeditor-5
Other
9.6k stars 3.71k forks source link

CKEditor 5 accumulates class properties when switch code language in Code Block #15453

Open andrisszep opened 11 months ago

andrisszep commented 11 months ago

πŸ“ Provide detailed reproduction steps (if any)

The Code Block function of CKEditor 5 does not delete the class properties of the previous code language when you select a different code language. This means that the old class properties accumulate and are not deleted when you change the code language.

  1. Select Code Block on CKEditor 5 editor bar, write your code.
  2. Select the appropriate code language.
  3. If you want to change it and select another code language, the previous one will not be removed from the class of the code tag.

βœ”οΈ Expected result

This behavior can be problematic because when you change the code language, you would expect the class property of the new code language to replace the old one, and no stacking would occur.

❌ Actual result

There are more then one "language-*" properties on the class attribute of the code tag .

Screenshot from 2023-11-30 16-37-25

πŸ“ƒ Other details

Witoso commented 11 months ago

Hi! I cannot reproduce it on the demo site you linked. Could you share a recording?

https://github.com/ckeditor/ckeditor5/assets/9881379/b444d065-5762-4525-8dea-1c2d01b06127

andrisszep commented 10 months ago

Yes, you are right. I would like to change the issue description. I can show the problem on another CKEditor 5 demo page, where the Source feature is located. https://ckeditor.com/ckeditor-5/demo/html-support/

Reproduce steps: 1, Create a new Code Block (add content and select the proper code language) 2, Swithc to Source mode, make any modification in the code block. 3, Switch back to editor mode, select code block, change language to any other 4, There are now 2 "language" properties in the class attribute of the code tag.

Screencast from 2024-01-05 09:01:12.webm

nmangold commented 1 week ago

I confirm this issue. Also, I can only reproduce this after using the Source button to swap between source mode and back, then switching the language code, as described in the previous comment.

This issue is blocking the following issues.