CKEditor displays the code (Insert code block) in one line.

[Volkozub]

Hi!

There is a «Code blocks» demo example in the documentation: https://ckeditor.com/docs/ckeditor5/latest/features/code-blocks.html This is what the code looks like when pasted into html: ---GOOD---

<pre><code class="language-html">&lt;div id="editor"&gt;
    &lt;p&gt;Here goes the initial content of the editor.&lt;/p&gt;
&lt;/div&gt;</code></pre><pre><code class="language-javascript">ClassicEditor
    .create( document.querySelector( '#editor' ) )
    .catch( error =&gt; {
        console.error( error );
    } );</code></pre><pre><code class="language-plaintext"> ________________
/                \
| How about moo? |  ^__^
\________________/  (oo)\_______
                  \ (__)\       )\/\
                        ||----w |
                        ||     ||</code></pre>

And this is what the same code looks like in my CKEditor: ---BAD---

<pre><code class="language-html">&lt;div id="editor"&gt;    &lt;p&gt;Here goes the initial content of the editor.&lt;/p&gt;&lt;/div&gt;</code></pre>

<pre><code class="language-javascript">ClassicEditor    .create( document.querySelector( '#editor' ) )  .catch( error =&gt; {       console.error( error ); } );</code></pre>

<pre><code class="language-plaintext"> ________________/                \| How about moo? |  ^__^\________________/  (oo)\_______                 \ (__)\       )\/\                        ||----w |                       ||     ||</code></pre>

Please tell me why this is happening? How can I fix this? Maybe this problem is related to my CSS? Has anyone detected such a problem?

Thanks!

[Volkozub]

Who is interested, we are discussing here: https://stackoverflow.com/questions/78543375/ckeditor-displays-the-code-insert-code-block-in-one-line

---

My last comments are what I came across as result:

The source code in CKEditor looks like this: ibb.co/s6SZ7YL. But then it changes to this:

<pre><code class=\"language-javascript\">ClassicEditor\t.create( document.querySelector( '#editor' ) )\t.catch( error =&gt; {\t\tconsole.error( error );\t} );</code></pre>

Removed br. I suspect that this has something to do with the license - so that the whole world pays money. ))

And here CKEditor returns this ibb.co/sgZGpKn even without \t - just all in the one line ibb.co/hBgBXVQ. )) The Insert Code Block algorithm chooses random solutions. ) Joe Biden probably wrote the code himself. ) Cretinism!

---