Gutenberg Block manipulation: Undo parse_blocks() with serialize_blocks() results in unicode issues

Question

I would like to manipulate Gutenberg Blocks with PHP. Therefore I need to parse post_content into an array and the same way back after manipulation. But I don't get that far, because already the parsing back and forth doesn't work.

function change_post_data_before_save( $data, $postarr ) {
    $post_data = $data['post_content']; //post_content seems to be json encoded 
    //stripping slashes otherwise $blocks[0]['attrs'] would be NULL
    $post_data = str_replace('\\"', '"', $post_data);
    //trying to replace double slash in unicodes but it seems not to work
    $post_data = str_replace('\\\u', '\u', $post_data);
    $blocks = parse_blocks($post_data); //there are still some issues with schema and other array parts

    //manipulation of $blocks if needed

    $post_content = serialize_blocks( $blocks ); //seems to work correct
    $data['post_content'] = $post_content;

    return $data;
}
add_filter( 'wp_insert_post_data', 'change_post_data_before_save', 10, 2 );

Any ideas how to json decode $data['post_data'] without destroying parts in $blocks[0]['attrs'] which need to be json encoded? I tried replacement but it seems not to work for unicodes and serialize_blocks() destroyes it in the end.

Example Code:

//expected result - saved in database without wp_insert_post_data (see above)
<!-- wp:uagb/faq {"block_id":"f1ad85bc","enableSchemaSupport":true,"schema":"{\u0022@context\u0022:\u0022https://schema.org\u0022,\u0022@type\u0022:\u0022FAQPage\u0022,\u0022@id\u0022:\u0022http://localhost/specials/gutenberg/\u0022,\u0022mainEntity\u0022:[{\u0022@type\u0022:\u0022Question\u0022,\u0022name\u0022:\u0022Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\u0022,\u0022acceptedAnswer\u0022:{\u0022@type\u0022:\u0022Answer\u0022,\u0022text\u0022:\u0022This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\u0022}}]}"} -->
<div class="wp-block-uagb-faq uagb-faq__outer-wrap uagb-block-f1ad85bc uagb-faq-icon-row uagb-faq-layout-accordion uagb-faq-expand-first-false uagb-faq-inactive-other-true uagb-faq-equal-height" data-faqtoggle="true" role="tablist"><script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","@id":"http://localhost/specials/gutenberg/","mainEntity":[{"@type":"Question","name":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","acceptedAnswer":{"@type":"Answer","text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"}}]}</script><div class="uagb-faq__wrap uagb-buttons-layout-wrap"><!-- wp:uagb/faq-child {"block_id":"61cac9b0","question":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","answer":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"} -->
<div class="wp-block-uagb-faq-child uagb-faq-child__outer-wrap uagb-block-61cac9b0"><div class="uagb-faq-child__wrapper"><div class="uagb-faq-item" role="tab" tabindex="0"><div class="uagb-faq-questions-button uagb-faq-questions"><span class="uagb-icon uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-icon-active uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-question">Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></div><div class="uagb-faq-content"><span><p>This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</p></span></div></div></div></div>
<!-- /wp:uagb/faq-child --></div></div>
<!-- /wp:uagb/faq -->

<!-- wp:kadence/iconlist {"items":[{"icon":"fe_alertCircle","link":"","target":"_self","size":20,"width":2,"text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","color":"","background":"","border":"","borderRadius":0,"padding":5,"borderWidth":1,"style":"default"}],"uniqueID":"_a79c18-e7"} -->
<div class="wp-block-kadence-iconlist kt-svg-icon-list-items kt-svg-icon-list-items_a79c18-e7 kt-svg-icon-list-columns-1 alignnone"><ul class="kt-svg-icon-list"><li class="kt-svg-icon-list-style-default kt-svg-icon-list-item-wrap kt-svg-icon-list-item-0"><div style="display:inline-flex;justify-content:center;align-items:center" class="kt-svg-icon-list-single kt-svg-icon-list-single-fe_alertCircle"><svg style="display:inline-block;vertical-align:middle" viewbox="0 0 24 24" height="20" width="20" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12" y2="16"></line></svg></div><span class="kt-svg-icon-list-text">This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></li></ul></div>
<!-- /wp:kadence/iconlist -->

Debugging:

//result of $data['post_content']
<!-- wp:uagb/faq {\\"block_id\\":\\"f1ad85bc\\",\\"enableSchemaSupport\\":true,\\"schema\\":\\"{\\\\u0022@context\\\\u0022:\\\\u0022https://schema.org\\\\u0022,\\\\u0022@type\\\\u0022:\\\\u0022FAQPage\\\\u0022,\\\\u0022@id\\\\u0022:\\\\u0022http://localhost/specials/gutenberg/\\\\u0022,\\\\u0022mainEntity\\\\u0022:[{\\\\u0022@type\\\\u0022:\\\\u0022Question\\\\u0022,\\\\u0022name\\\\u0022:\\\\u0022Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\\\u0022,\\\\u0022acceptedAnswer\\\\u0022:{\\\\u0022@type\\\\u0022:\\\\u0022Answer\\\\u0022,\\\\u0022text\\\\u0022:\\\\u0022This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\\\u0022}}]}\\"} -->
<div class=\\"wp-block-uagb-faq uagb-faq__outer-wrap uagb-block-f1ad85bc uagb-faq-icon-row uagb-faq-layout-accordion uagb-faq-expand-first-false uagb-faq-inactive-other-true uagb-faq-equal-height\\" data-faqtoggle=\\"true\\" role=\\"tablist\\"><script type=\\"application/ld+json\\">{\\"@context\\":\\"https://schema.org\\",\\"@type\\":\\"FAQPage\\",\\"@id\\":\\"http://localhost/specials/gutenberg/\\",\\"mainEntity\\":[{\\"@type\\":\\"Question\\",\\"name\\":\\"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\",\\"acceptedAnswer\\":{\\"@type\\":\\"Answer\\",\\"text\\":\\"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\"}}]}</script><div class=\\"uagb-faq__wrap uagb-buttons-layout-wrap\\"><!-- wp:uagb/faq-child {\\"block_id\\":\\"61cac9b0\\",\\"question\\":\\"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\",\\"answer\\":\\"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\"} -->
<div class=\\"wp-block-uagb-faq-child uagb-faq-child__outer-wrap uagb-block-61cac9b0\\"><div class=\\"uagb-faq-child__wrapper\\"><div class=\\"uagb-faq-item\\" role=\\"tab\\" tabindex=\\"0\\"><div class=\\"uagb-faq-questions-button uagb-faq-questions\\"><span class=\\"uagb-icon uagb-faq-icon-wrap\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewbox=\\"0 0 448 512\\"><path d=\\"M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\\"></path></svg></span><span class=\\"uagb-icon-active uagb-faq-icon-wrap\\"><svg xmlns=\\"http://www.w3.org/2000/svg\\" viewbox=\\"0 0 448 512\\"><path d=\\"M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z\\"></path></svg></span><span class=\\"uagb-question\\">Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></div><div class=\\"uagb-faq-content\\"><span><p>This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</p></span></div></div></div></div>
<!-- /wp:uagb/faq-child --></div></div>
<!-- /wp:uagb/faq -->

<!-- wp:kadence/iconlist {\\"items\\":[{\\"icon\\":\\"fe_alertCircle\\",\\"link\\":\\"\\",\\"target\\":\\"_self\\",\\"size\\":20,\\"width\\":2,\\"text\\":\\"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\",\\"color\\":\\"\\",\\"background\\":\\"\\",\\"border\\":\\"\\",\\"borderRadius\\":0,\\"padding\\":5,\\"borderWidth\\":1,\\"style\\":\\"default\\"}],\\"uniqueID\\":\\"_a79c18-e7\\"} -->
<div class=\\"wp-block-kadence-iconlist kt-svg-icon-list-items kt-svg-icon-list-items_a79c18-e7 kt-svg-icon-list-columns-1 alignnone\\"><ul class=\\"kt-svg-icon-list\\"><li class=\\"kt-svg-icon-list-style-default kt-svg-icon-list-item-wrap kt-svg-icon-list-item-0\\"><div style=\\"display:inline-flex;justify-content:center;align-items:center\\" class=\\"kt-svg-icon-list-single kt-svg-icon-list-single-fe_alertCircle\\"><svg style=\\"display:inline-block;vertical-align:middle\\" viewbox=\\"0 0 24 24\\" height=\\"20\\" width=\\"20\\" fill=\\"none\\" stroke=\\"currentColor\\" xmlns=\\"http://www.w3.org/2000/svg\\" stroke-width=\\"2\\" stroke-linecap=\\"round\\" stroke-linejoin=\\"round\\"><circle cx=\\"12\\" cy=\\"12\\" r=\\"10\\"></circle><line x1=\\"12\\" y1=\\"8\\" x2=\\"12\\" y2=\\"12\\"></line><line x1=\\"12\\" y1=\\"16\\" x2=\\"12\\" y2=\\"16\\"></line></svg></div><span class=\\"kt-svg-icon-list-text\\">This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></li></ul></div>
<!-- /wp:kadence/iconlist -->

//result of $post_data
<!-- wp:uagb/faq {"block_id":"f1ad85bc","enableSchemaSupport":true,"schema":"{\\u0022@context\\u0022:\\u0022https://schema.org\\u0022,\\u0022@type\\u0022:\\u0022FAQPage\\u0022,\\u0022@id\\u0022:\\u0022http://localhost/specials/gutenberg/\\u0022,\\u0022mainEntity\\u0022:[{\\u0022@type\\u0022:\\u0022Question\\u0022,\\u0022name\\u0022:\\u0022Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\u0022,\\u0022acceptedAnswer\\u0022:{\\u0022@type\\u0022:\\u0022Answer\\u0022,\\u0022text\\u0022:\\u0022This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)\\u0022}}]}"} -->
<div class="wp-block-uagb-faq uagb-faq__outer-wrap uagb-block-f1ad85bc uagb-faq-icon-row uagb-faq-layout-accordion uagb-faq-expand-first-false uagb-faq-inactive-other-true uagb-faq-equal-height" data-faqtoggle="true" role="tablist"><script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","@id":"http://localhost/specials/gutenberg/","mainEntity":[{"@type":"Question","name":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","acceptedAnswer":{"@type":"Answer","text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"}}]}</script><div class="uagb-faq__wrap uagb-buttons-layout-wrap"><!-- wp:uagb/faq-child {"block_id":"61cac9b0","question":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","answer":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"} -->
<div class="wp-block-uagb-faq-child uagb-faq-child__outer-wrap uagb-block-61cac9b0"><div class="uagb-faq-child__wrapper"><div class="uagb-faq-item" role="tab" tabindex="0"><div class="uagb-faq-questions-button uagb-faq-questions"><span class="uagb-icon uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-icon-active uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-question">Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></div><div class="uagb-faq-content"><span><p>This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</p></span></div></div></div></div>
<!-- /wp:uagb/faq-child --></div></div>
<!-- /wp:uagb/faq -->

<!-- wp:kadence/iconlist {"items":[{"icon":"fe_alertCircle","link":"","target":"_self","size":20,"width":2,"text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","color":"","background":"","border":"","borderRadius":0,"padding":5,"borderWidth":1,"style":"default"}],"uniqueID":"_a79c18-e7"} -->
<div class="wp-block-kadence-iconlist kt-svg-icon-list-items kt-svg-icon-list-items_a79c18-e7 kt-svg-icon-list-columns-1 alignnone"><ul class="kt-svg-icon-list"><li class="kt-svg-icon-list-style-default kt-svg-icon-list-item-wrap kt-svg-icon-list-item-0"><div style="display:inline-flex;justify-content:center;align-items:center" class="kt-svg-icon-list-single kt-svg-icon-list-single-fe_alertCircle"><svg style="display:inline-block;vertical-align:middle" viewbox="0 0 24 24" height="20" width="20" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12" y2="16"></line></svg></div><span class="kt-svg-icon-list-text">This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></li></ul></div>
<!-- /wp:kadence/iconlist -->

//result of $blocks
array (
  0 => 
  array (
    'blockName' => 'uagb/faq',
    'attrs' => 
    array (
      'block_id' => 'f1ad85bc',
      'enableSchemaSupport' => true,
      'schema' => '{"@context":"https://schema.org","@type":"FAQPage","@id":"http://localhost/specials/gutenberg/","mainEntity":[{"@type":"Question","name":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","acceptedAnswer":{"@type":"Answer","text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"}}]}',
    ),
    'innerBlocks' => 
    array (
      0 => 
      array (
        'blockName' => 'uagb/faq-child',
        'attrs' => 
        array (
          'block_id' => '61cac9b0',
          'question' => 'Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)',
          'answer' => 'This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)',
        ),
        'innerBlocks' => 
        array (
        ),
        'innerHTML' => '
<div class="wp-block-uagb-faq-child uagb-faq-child__outer-wrap uagb-block-61cac9b0"><div class="uagb-faq-child__wrapper"><div class="uagb-faq-item" role="tab" tabindex="0"><div class="uagb-faq-questions-button uagb-faq-questions"><span class="uagb-icon uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-icon-active uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-question">Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></div><div class="uagb-faq-content"><span><p>This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</p></span></div></div></div></div>
',
        'innerContent' => 
        array (
          0 => '
<div class="wp-block-uagb-faq-child uagb-faq-child__outer-wrap uagb-block-61cac9b0"><div class="uagb-faq-child__wrapper"><div class="uagb-faq-item" role="tab" tabindex="0"><div class="uagb-faq-questions-button uagb-faq-questions"><span class="uagb-icon uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-icon-active uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-question">Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></div><div class="uagb-faq-content"><span><p>This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</p></span></div></div></div></div>
',
        ),
      ),
    ),
    'innerHTML' => '
<div class="wp-block-uagb-faq uagb-faq__outer-wrap uagb-block-f1ad85bc uagb-faq-icon-row uagb-faq-layout-accordion uagb-faq-expand-first-false uagb-faq-inactive-other-true uagb-faq-equal-height" data-faqtoggle="true" role="tablist"><script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","@id":"http://localhost/specials/gutenberg/","mainEntity":[{"@type":"Question","name":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","acceptedAnswer":{"@type":"Answer","text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"}}]}</script><div class="uagb-faq__wrap uagb-buttons-layout-wrap"></div></div>
',
    'innerContent' => 
    array (
      0 => '
<div class="wp-block-uagb-faq uagb-faq__outer-wrap uagb-block-f1ad85bc uagb-faq-icon-row uagb-faq-layout-accordion uagb-faq-expand-first-false uagb-faq-inactive-other-true uagb-faq-equal-height" data-faqtoggle="true" role="tablist"><script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","@id":"http://localhost/specials/gutenberg/","mainEntity":[{"@type":"Question","name":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","acceptedAnswer":{"@type":"Answer","text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"}}]}</script><div class="uagb-faq__wrap uagb-buttons-layout-wrap">',
      1 => NULL,
      2 => '</div></div>
',
    ),
  ),
  1 => 
  array (
    'blockName' => NULL,
    'attrs' => 
    array (
    ),
    'innerBlocks' => 
    array (
    ),
    'innerHTML' => '

',
    'innerContent' => 
    array (
      0 => '

',
    ),
  ),
  2 => 
  array (
    'blockName' => 'kadence/iconlist',
    'attrs' => 
    array (
      'items' => 
      array (
        0 => 
        array (
          'icon' => 'fe_alertCircle',
          'link' => '',
          'target' => '_self',
          'size' => 20,
          'width' => 2,
          'text' => 'This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)',
          'color' => '',
          'background' => '',
          'border' => '',
          'borderRadius' => 0,
          'padding' => 5,
          'borderWidth' => 1,
          'style' => 'default',
        ),
      ),
      'uniqueID' => '_a79c18-e7',
    ),
    'innerBlocks' => 
    array (
    ),
    'innerHTML' => '
<div class="wp-block-kadence-iconlist kt-svg-icon-list-items kt-svg-icon-list-items_a79c18-e7 kt-svg-icon-list-columns-1 alignnone"><ul class="kt-svg-icon-list"><li class="kt-svg-icon-list-style-default kt-svg-icon-list-item-wrap kt-svg-icon-list-item-0"><div style="display:inline-flex;justify-content:center;align-items:center" class="kt-svg-icon-list-single kt-svg-icon-list-single-fe_alertCircle"><svg style="display:inline-block;vertical-align:middle" viewbox="0 0 24 24" height="20" width="20" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12" y2="16"></line></svg></div><span class="kt-svg-icon-list-text">This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></li></ul></div>
',
    'innerContent' => 
    array (
      0 => '
<div class="wp-block-kadence-iconlist kt-svg-icon-list-items kt-svg-icon-list-items_a79c18-e7 kt-svg-icon-list-columns-1 alignnone"><ul class="kt-svg-icon-list"><li class="kt-svg-icon-list-style-default kt-svg-icon-list-item-wrap kt-svg-icon-list-item-0"><div style="display:inline-flex;justify-content:center;align-items:center" class="kt-svg-icon-list-single kt-svg-icon-list-single-fe_alertCircle"><svg style="display:inline-block;vertical-align:middle" viewbox="0 0 24 24" height="20" width="20" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12" y2="16"></line></svg></div><span class="kt-svg-icon-list-text">This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></li></ul></div>
',
    ),
  ),
)

Final result after serialize_blocks():

//result of $post_content [can not be shown in Gutenberg UI "This block contains unexpected or invalid content."]
<!-- wp:uagb/faq {"block_id":"f1ad85bc","enableSchemaSupport":true,"schema":"{\\u0022@context\\u0022:\\u0022https:\\/\\/schema.org\\u0022,\\u0022@type\\u0022:\\u0022FAQPage\\u0022,\\u0022@id\\u0022:\\u0022http:\\/\\/localhost\\/specials\\/gutenberg\\/\\u0022,\\u0022mainEntity\\u0022:[{\\u0022@type\\u0022:\\u0022Question\\u0022,\\u0022name\\u0022:\\u0022Headline with special characters: (\\u00b0C, \\u00e4, \\u00f6, \\u00fc, \\u00df, \\u00d6, \\u00c4, \\u00dc)\\u0022,\\u0022acceptedAnswer\\u0022:{\\u0022@type\\u0022:\\u0022Answer\\u0022,\\u0022text\\u0022:\\u0022This is a test with special characters: (\\u00b0C, \\u00e4, \\u00f6, \\u00fc, \\u00df, \\u00d6, \\u00c4, \\u00dc)\\u0022}}]}"} -->
<div class="wp-block-uagb-faq uagb-faq__outer-wrap uagb-block-f1ad85bc uagb-faq-icon-row uagb-faq-layout-accordion uagb-faq-expand-first-false uagb-faq-inactive-other-true uagb-faq-equal-height" data-faqtoggle="true" role="tablist"><script type="application/ld+json">{"@context":"https://schema.org","@type":"FAQPage","@id":"http://localhost/specials/gutenberg/","mainEntity":[{"@type":"Question","name":"Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)","acceptedAnswer":{"@type":"Answer","text":"This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)"}}]}</script><div class="uagb-faq__wrap uagb-buttons-layout-wrap"><!-- wp:uagb/faq-child {"block_id":"61cac9b0","question":"Headline with special characters: (\\u00b0C, \\u00e4, \\u00f6, \\u00fc, \\u00df, \\u00d6, \\u00c4, \\u00dc)","answer":"This is a test with special characters: (\\u00b0C, \\u00e4, \\u00f6, \\u00fc, \\u00df, \\u00d6, \\u00c4, \\u00dc)"} -->
<div class="wp-block-uagb-faq-child uagb-faq-child__outer-wrap uagb-block-61cac9b0"><div class="uagb-faq-child__wrapper"><div class="uagb-faq-item" role="tab" tabindex="0"><div class="uagb-faq-questions-button uagb-faq-questions"><span class="uagb-icon uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H272V64c0-17.67-14.33-32-32-32h-32c-17.67 0-32 14.33-32 32v144H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h144v144c0 17.67 14.33 32 32 32h32c17.67 0 32-14.33 32-32V304h144c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-icon-active uagb-faq-icon-wrap"><svg xmlns="http://www.w3.org/2000/svg" viewbox="0 0 448 512"><path d="M416 208H32c-17.67 0-32 14.33-32 32v32c0 17.67 14.33 32 32 32h384c17.67 0 32-14.33 32-32v-32c0-17.67-14.33-32-32-32z"></path></svg></span><span class="uagb-question">Headline with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></div><div class="uagb-faq-content"><span><p>This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</p></span></div></div></div></div>
<!-- /wp:uagb/faq-child --></div></div>
<!-- /wp:uagb/faq -->

<!-- wp:kadence/iconlist {"items":[{"icon":"fe_alertCircle","link":"","target":"_self","size":20,"width":2,"text":"This is a test with special characters: (\\u00b0C, \\u00e4, \\u00f6, \\u00fc, \\u00df, \\u00d6, \\u00c4, \\u00dc)","color":"","background":"","border":"","borderRadius":0,"padding":5,"borderWidth":1,"style":"default"}],"uniqueID":"_a79c18-e7"} -->
<div class="wp-block-kadence-iconlist kt-svg-icon-list-items kt-svg-icon-list-items_a79c18-e7 kt-svg-icon-list-columns-1 alignnone"><ul class="kt-svg-icon-list"><li class="kt-svg-icon-list-style-default kt-svg-icon-list-item-wrap kt-svg-icon-list-item-0"><div style="display:inline-flex;justify-content:center;align-items:center" class="kt-svg-icon-list-single kt-svg-icon-list-single-fe_alertCircle"><svg style="display:inline-block;vertical-align:middle" viewbox="0 0 24 24" height="20" width="20" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="10"></circle><line x1="12" y1="8" x2="12" y2="12"></line><line x1="12" y1="16" x2="12" y2="16"></line></svg></div><span class="kt-svg-icon-list-text">This is a test with special characters: (°C, ä, ö, ü, ß, Ö, Ä, Ü)</span></li></ul></div>
<!-- /wp:kadence/iconlist -->

Related Topic: serialize_blocks breaking html tags in content

Answer 1

As already described in the comments, many WordPress Gutenberg plugins do not use the strict JSON format as WordPress prescribes... (and poorly documented) So it comes to two problems:

• Sometimes the data is in a JSON format, which parse_blocks() cannot read. If no change is made here, for example, the value attr will be NULL (example in the first post)
• serialize_blocks() converts all special characters to Unicode, which causes the plugin block to stop working properly and results in error messages in the Gutenberg UI: "This block contains unexpected or invalid content.".

Especially for the plugins Advanced-Gutenberg and Kadence-Blocks the bugs have already been reported. I have developed the following workaround, which is quick and dirty, but it works. If anyone has comments, additions or improvements, please let me know!

function change_post_data_before_save( $data ) {
    $post_data = $data['post_content'];
    $post_data = str_replace('\\"', '"', $post_data); //parse_blocks() need " to parse $blocks[]['attr'] correctly

    $blocks = parse_blocks($post_data);
    $post_content = implode( '', array_map( 'serialize_block2', $blocks ) ); //serialize_block() replacement because serialize_block_attributes() does not support JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE

    $post_content = str_replace('"', '\\"', $post_content); //undo " correction from above
    $data['post_content'] = $post_content;

    return $data;
}
add_filter( 'wp_insert_post_data', 'change_post_data_before_save', 10, 2 );


//only sub method calls has been changed
function serialize_block2( $block ) {
    $block_content = '';

    $index = 0;
    foreach ( $block['innerContent'] as $chunk ) {
        $block_content .= is_string( $chunk ) ? $chunk : serialize_block2( $block['innerBlocks'][ $index++ ] ); //change
    }

    if ( ! is_array( $block['attrs'] ) ) {
        $block['attrs'] = array();
    }

    return get_comment_delimited_block_content2(
        $block['blockName'],
        $block['attrs'],
        $block_content
    );
}


//only sub method calls has been changed
function get_comment_delimited_block_content2( $block_name, $block_attributes, $block_content ) {
    if ( is_null( $block_name ) ) {
        return $block_content;
    }

    $serialized_block_name = strip_core_block_namespace( $block_name );
    $serialized_attributes = empty( $block_attributes ) ? '' : serialize_block_attributes2( $block_attributes ) . ' '; //change

    if ( empty( $block_content ) ) {
        return sprintf( '<!-- wp:%s %s/-->', $serialized_block_name, $serialized_attributes );
    }

    return sprintf(
        '<!-- wp:%s %s-->%s<!-- /wp:%s -->',
        $serialized_block_name,
        $serialized_attributes,
        $block_content,
        $serialized_block_name
    );
}


//change gutenberg json_encoding to keep plugin block formats and prevent issue "This block contains unexpected or invalid content."
function serialize_block_attributes2( $block_attributes ) {
    $encoded_attributes = json_encode( $block_attributes, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE ); //change
    $encoded_attributes = preg_replace( '/--/', '\\u002d\\u002d', $encoded_attributes );
    $encoded_attributes = preg_replace( '/</', '\\u003c', $encoded_attributes );
    $encoded_attributes = preg_replace( '/>/', '\\u003e', $encoded_attributes );
    $encoded_attributes = preg_replace( '/&/', '\\u0026', $encoded_attributes );
    // Regex: /\\"/
    $encoded_attributes = preg_replace( '/\\\\"/', '\\u0022', $encoded_attributes );

    return $encoded_attributes;
}