Gutenberg: Character encoding issue on front end - (’) instead of apostraphe

[hempsworth]

Describe the bug
Since upgrading to Gutenberg 8.7.0, character encoding seems to be broken when pages are rendered on the front end. In my example, I am seeing ’ instead of '

I have tested this with the default theme, and I have confirmed it does not happen when the Gutenberg plugin is disabled.

To reproduce
Steps to reproduce the behavior:

1. Edit any page and use an apostraphe (for example) in _any_ block that accepts text
2. Save and view the rendered page on the front end
3. The encoding is incorrect, and renders ’ instead of '

Editor version (please complete the following information):

• WordPress version: 5.4.2
• Gutenberg plugin installed, version 8.7.0

[ItsJonQ]

Haii!! Hmm, I can't seem to replicate this. I'm testing this locally by checking out Gutenberg at v8.7.0

The above screenshot shows a couple of paragraph blocks with quotes (double, single) and backticks. They seem to be rendering okay.

• WordPress Version: 5.5-beta2-48515
• Gutenberg plugin. v8.7.0
• TwentyTwenty Theme

I'm curious if anyone else is experiencing this!

[JuanCarlosNieto]

I have the same error in spanish with apostrophe and question marks

[dennisheiden]

We have the same problem after the update to v8.7.
With Gutenberg Plugin deactivated, everything is fine.

[ms-studio]

Could it have the same cause as #24445 ? I notice a similar issue with the "Latest Posts" block – all french accented characters are garbled.

[mcsf]

This does seem like a duplicate of #24445. To everyone who reported this issue: could you answer the following questions?

• With what blocks specifically did you have this issue?
• Are these blocks server-side rendered?
• Do these blocks have alignment support, and did you choose a specific align for your block (e.g. Wide)?

Finally:

• Does #24447 not fix the issue for you?

[dennisheiden]

Does any of the commentators use WPML? I did a test with a mostly vanilla WP + GB 8.7 and the issue doesn't appear.

[JuanCarlosNieto]

• I have detected error in background blocks with full width.
• They are not server-side rendered.
• I made the code modificacion in #24447 and solved the problem.
• I am not using WPML there is only one language, spanish

[mcsf]

* I have detected error in background blocks with full width.

* They are not server-side rendered.

Thanks for the feedback. What are these background blocks? Are they core/cover, core/group? (It may be surprising, but the Cover block is actually server-side rendered, partly as a workaround to KSES restrictions on post content for certain user roles (#22346).)

[JuanCarlosNieto]

Sorry for my english, I use administrator role. Perhaps its "cover block" in spanish is translated.

Here are block in back-end and front-end. In back-end the text is correct and in front-end there is a codification error

[ockham]

@JuanCarlosNieto Yep, that's the Cover block :+1: Thanks for confirming. That's indeed #24445, which should be fixed by #24447.

[mcsf]

Ah, I see, it became Fondo in the Spanish translation. ¡Gracias, @JuanCarlosNieto!

[dennisheiden]

Confirmed on my test bench. Cover Block is causing the issue so -> https://github.com/WordPress/gutenberg/issues/24445

Thanks!

[mcsf]

Thanks for your responses. I'm closing this as a duplicate of #24445, now fixed in master by #24447.