westonruter / syntax-highlighting-code-block

Extending the WordPress Code block with syntax highlighting rendered on the server, thus having faster frontend performance and being AMP-compatible.
https://wordpress.org/plugins/syntax-highlighting-code-block/
GNU General Public License v2.0
118 stars 11 forks source link

Fix compatibility with Gutenberg 17.1 after it removed preserveWhiteSpace serialisation differences #791

Closed westonruter closed 9 months ago

westonruter commented 11 months ago

Fixes #790.

In Gutenberg 17.1, I paste the following into a new Code block:

<!DOCTYPE html>
<html>
    <head>
        <title>PHP Test</title>
    </head>
    <body>
        <?php echo '<p>Hello World</p>'; ?>
    </body>
</html>

When I look at the post_content, it shows the block markup as follows:

<!-- wp:code {"language":"xml"} -->
<pre class="wp-block-code"><code>&lt;!DOCTYPE html><br>&lt;html><br>    &lt;head><br>        &lt;title>PHP Test&lt;/title><br>    &lt;/head><br>    &lt;body><br>        &lt;?php echo '&lt;p>Hello World&lt;/p>'; ?><br>    &lt;/body><br>&lt;/html></code></pre>
<!-- /wp:code -->

This gets rendered as:

image

When this is what is expected:

image

This PR fixes the problem by ensuring BR tags are replaced with newlines before applying syntax highlighting.

westonruter commented 11 months ago

ZIP build: syntax-highlighting-code-block.zip (1.5.0-alpha-20231202T000854Z-3dc095a)