Editor: Ensure block attribute serialization in PHP matches the JavaScript equivalent.

The `serializeAttributes()` function in JavaScript uses `JSON.stringify`, which does not encode slashes and unicode characters by default. This resulted in the PHP serialization through `json_encode()` producing different results.

This also switches from `json_encode()` to `wp_json_encode()` to prevent failures when any non UTF-8 characters are included.

Props kevinfodness, SergeyBiryukov, timothyblynjacobs.
Fixes #53936.

git-svn-id: https://develop.svn.wordpress.org/trunk@51674 602fd350-edb4-49c9-b593-d223f7449a82
This commit is contained in:
Jonathan Desrosiers 2021-08-26 19:09:16 +00:00
parent 62e8d8f115
commit 44180691e6
2 changed files with 8 additions and 1 deletions

View File

@ -488,13 +488,17 @@ function get_dynamic_block_names() {
* substitution for characters which might otherwise interfere with embedding
* the result in an HTML comment.
*
* This function must produce output that remains in sync with the output of
* the serializeAttributes JavaScript function in the block editor in order
* to ensure consistent operation between PHP and JavaScript.
*
* @since 5.3.1
*
* @param array $block_attributes Attributes object.
* @return string Serialized attributes.
*/
function serialize_block_attributes( $block_attributes ) {
$encoded_attributes = json_encode( $block_attributes );
$encoded_attributes = wp_json_encode( $block_attributes, JSON_UNESCAPED_SLASHES | JSON_UNESCAPED_UNICODE );
$encoded_attributes = preg_replace( '/--/', '\\u002d\\u002d', $encoded_attributes );
$encoded_attributes = preg_replace( '/</', '\\u003c', $encoded_attributes );
$encoded_attributes = preg_replace( '/>/', '\\u003e', $encoded_attributes );

View File

@ -47,6 +47,9 @@ class Tests_Blocks_Serialize extends WP_UnitTestCase {
// Block with attribute values that may conflict with HTML comment.
array( '<!-- wp:attributes {"key":"\\u002d\\u002d\\u003c\\u003e\\u0026\\u0022"} /-->' ),
// Block with attribute values that should not be escaped.
array( '<!-- wp:attributes {"key":"€1.00 / 3 for €2.00"} /-->' ),
);
}