Style book: Fix critical error when blocks are not registered

[t-hamano]

What?

I have noticed that if I open StyleBook when the following blocks are not registered, a critical error will occur:

• core/heading
• core/paragraph
• core/group

a5be7578ed2f0df3b4e75a3227192bbf.mp4

Why?

The Typography section of the Overview tab generates examples using the Heading block, Paragraph block, and Group block. However, if these blocks are not registered, createBlock() (__experimentalSanitizeBlockAttributes()) will throw an exception.

How?

Checks whether each block is registered and generates an example.

• If the Heading block is registered: Generate a Heading block example.
• If the Paragraph block is registered:
  • If the Group block is registered: As before, generate two Paragraph block examples for the two-column layout.
  • If the Group block is not registered: generate one Paragraph block example for the one-column layout.

Testing Instructions

• Open the site editor.
• In your browser console, run one or both of the following:

  wp.blocks.unregisterBlockType( 'core/group' );
  wp.blocks.unregisterBlockType( 'core/paragraph' );

• Confirm that the StyleBook opens correctly.

Note

Note that this PR cannot test the scenario when the Heading block is unregistered. Because a different error occurs when the Heading block is unregistered, this will need to be addressed in a separate PR:

Uncaught TypeError: Cannot read properties of undefined (reading 'examples') at StyleBook (index.js:225:61)

Screenshots or screencast

When the Paragraph block is not registered

When the Group block is not registered

[github-actions]

The following accounts have interacted with this PR and/or linked issues. I will continue to update these lists as activity occurs. You can also manually ask me to refresh this list by adding the props-bot label.

If you're merging code through a pull request on GitHub, copy and paste the following into the bottom of the merge commit message.

Co-authored-by: t-hamano <[email protected]>
Co-authored-by: ramonjd <[email protected]>

To understand the WordPress project's expectations around crediting contributors, please review the Contributor Attribution page in the Core Handbook.

[ramonjd]

Great work!

I can confirm the errors, e.g., Uncaught Error: Block type 'core/paragraph' is not registered.

With the extra checks in this PR, the style book works as expected.

I also added a note over at

• Add button interactive states in the stylebook #67541

[t-hamano]

@ramonjd Thanks for the review!