Problem/Motivation
CKEditor 5 currently supports inline <code>…< /code>
thanks to:
ckeditor5_code:
ckeditor5:
plugins: [basicStyles.Code]
drupal:
label: Code
library: core/ckeditor5.basic
admin_library: ckeditor5/admin.basic
toolbar_items:
code:
label: Code
elements:
- <code>
But we do not yet have support for code blocks: <pre><code>…< /code></pre>
. That's where https://ckeditor.com/docs/ckeditor5/latest/features/code-blocks.html comes in.
We did support this in CKEditor 4 too, thanks to the Format
dropdown:
The full list of tags supported by that:
<p>
<h1>
<h2>
<h3>
<h4>
<h5>
<h6>
<pre>
All of those are already supported (thanks to ckeditor5_paragraph
and ckeditor5_heading
), with the exception of the last one: <pre>
.
For that, we need this additional plugin. Right now, you're forced to use "view source" to create such content, which is a regression compared to CKEditor 4.
Steps to reproduce
N/A
Proposed resolution
Add https://ckeditor.com/docs/ckeditor5/latest/features/code-blocks.html to provide an equivalent UX in CKEditor 5.
Remaining tasks
- Add package to
core/package.json
and build the JS. - Add definition to
core/modules/ckeditor5.ckeditor5.yml
. - Expand update path test coverage in
\Drupal\Tests\ckeditor5\Kernel\SmartDefaultSettingsTest
- Expand update path for
Format
button in\Drupal\ckeditor5\Plugin\CKEditor4To5Upgrade\Core::mapCKEditor4ToolbarButtonToCKEditor5ToolbarItem()
. Note that this is tricky becauseFormat
now needs to be mapped to multiple toolbar buttons if<pre>
is allowed in the text format. This is not yet supported byCKEditor4To5UpgradePluginInterface
and will likely require an API addition.
User interface changes
Better UX for
API changes
TBD
Data model changes
None.
Release notes snippet
TBD