Source mode in CKEditor may cause editor width to increase

• Type: Bug
• Status: Closed
• Resolution: Fixed
• Affects Version/s: 7.3.X, Master
• Fix Version/s: 7.3.10 DXP FP1, 7.3.10.1 DXP SP1, 7.3.6 CE GA7, 7.3.X, 7.4.13 DXP GA1, Master
• Component/s: CKEditor
• Labels:
  • liferay-dxp-73-sp1
  • liferay-fixpack-dxp-1-7310
• Fix Priority: 3
• Git Pull Request: https://github.com/liferay-frontend/liferay-portal/pull/425

CKEditor source mode is not properly managing long lines. As a result, a long line will extend the editor window width beyond the original one, up to the width of the longest line.

This effect is particularly exacerbated in some cases where we preload editor contents with text coming from a predefined template

Steps to reproduce
1. Go to Instance Settings → email → Account Created Notification
2. In the "Body without Password" editor, enable "source" mode

Note: The case of predefined email templates is particularly misleading as those templates already contain line breaks (<br/>) in the wysiwyg mode, which can be expected to produce corresponding line breaks in source mode. However, parser is not breaking lines upon those tags. <p> tags produce line breaks in source mode. Even if we managed to change how line breaks are produced, it would not be enough as a very long line will produce the reported behavior, as shown in these alternative steps:

2. In the "Body without Password" editor, make sure "source" mode is not enabled. Delete all text
3. Write a long, single line, ensure it gets wrapped in the editor
4. Enable "source" mode

Observed behavior: editor window witdth grows to acommodate the text
Expected behavior: editor witdth should not change. Line may be wrapped or just overflow.

Additional notes to solve this

• A possible solution to this would be to enable line wrap in source mode.
• However, please note that it's also possible to let the line overflow, hiding it once it exceeds window width. This behavior can be observed in the CKEditor we use in the Web Content creation/edition page
• In light of this, I would consider harmonizing this behavior across all ckeditor instances: either wrap lines or let them overflow, or make it configurable in the input-editor tag, so that we have a consistent default behavior which does not alter window width