Size Change: +437 B (0%)

Total Size: 1.23 MB

_{compressed-size-action}

Some minor updates:

• @ockham added some code in e33997e to render inner blocks from PHP.
• @luisherranz and I pushed 570437d and 8ace6c6 to render inner blocks on the editor.

These two changes would solve all problems with the static-dynamic behavior.

I'll update the list of next steps that @ockham posted in the issue.

Added variation to inject the inner block template on block insertion.

https://github.com/WordPress/gutenberg/pull/40522/files#diff-c3f8b5a86aa52698e50024403d5f4e7a50206b840b45770262194ca30c72d686R21-R28

We are using this method because it was impossible to know when innerBlocks.length === 0 was due to a new block, or due to a legacy block. Props to @gziolo for the suggestion!

If I create a (childless) Post Comments block (<-- wp:post-comments /-->) on trunk (i.e. with the block.json’s "inserter": false flag removed), save that, and then try to reload the editor on this PR’s branch, I get a warning message about invalid block content:

The console shows

I believe that this is because the merged block’s save() would generate the <div /> with className wp-block-post-comments, but that’s not what’s stored in the post body (from when the block was first created on trunk).

I think the problem is that we’re unconditionally rendering the wrapping <Tag />: https://github.com/WordPress/gutenberg/pull/40522/files#diff-3a8f25d555bb48cf812311952459528f8dabbff12f35f07baf926d19e288ca32R8

I've tried to fix this with some logic as follows:

diff --git a/packages/block-library/src/post-comments/save.js b/packages/block-library/src/post-comments/save.js
index 94b8adfadc..d556d66621 100644
--- a/packages/block-library/src/post-comments/save.js
+++ b/packages/block-library/src/post-comments/save.js
@@ -1,12 +1,16 @@
 /**
  * WordPress dependencies
  */
-import { InnerBlocks, useBlockProps } from '@wordpress/block-editor';
+import { useInnerBlocksProps, useBlockProps } from '@wordpress/block-editor';
+import { Children } from '@wordpress/element';
 
 export default function save( { attributes: { tagName: Tag } } ) {
-	return (
-		<Tag { ...useBlockProps.save() }>
-			<InnerBlocks.Content />
-		</Tag>
-	);
+	const blockProps = useBlockProps.save();
+	const innerBlocksProps = useInnerBlocksProps.save( blockProps );
+
+	if ( Children.count( innerBlocksProps.children ) === 0 ) {
+		return;
+	}
+
+	return <Tag { ...innerBlocksProps } />;
 }

Notes:

• InnerBlocks.Content is basically just a wrapper around useInnerBlocksProps.save(), so those two are more or less equivalent (AFAICT).
• { Children } from '@wordpress/element' is an alias for React.Children.

My patch isn't quite working yet: It seems that even with the childless Post Comments block, Children.count( innerBlocksProps.children ) is always 1 -- there seems to be a RawHTML component inside 😕

To be continued.

Per discussion on the issue, and due to the problems we've encountered, we've decided to stop working on this for now. We'll revisit after WP 6.0.