Form Blocks: Ensure fixtures are generated correctly

[t-hamano]

Description

Note: This issue was discovered in #56507 when trying to add deprecation to the Input Field block.

There are four blocks related to the form:

• Form (core/form)
• Input Field (core/form-input)
• Form Submission Notification (core/form-submission-notification)
• Form Submit Button (core/form-submit-button)

There are two fixture files for these blocks:

• core__form
• core__form-input

However, in the json file that represents the expected representation, it is recognized as a core/missing block.

gutenberg/test/integration/fixtures/blocks/core__form.json

Line 3 in e7ebdcf

"name": "core/missing",

gutenberg/test/integration/fixtures/blocks/core__form-input.json

Line 3 in e7ebdcf

"name": "core/missing",

As a result, deprecation will not work and serialized markup will not be generated correctly.

The cause of this is due to various factors, and I believe that the following two issues need to be resolved in order to generate the fixture file correctly.

Full post content test does not register experimental blocks

In the full-content.test.js file, all core blocks are registered via registerCoreBlocks(). However, the blocks related to the form are experimental and will not be registered unless you explicitly opt-in in the Experimental settings.

As a result, the fixture test treats it as a non-existent block, which is the first cause.

We need to somehow register blocks related to the form that are not registered via registerCoreBlocks() in our fixture tests.

The behavior of the save function of the Input Field block is different in the fixture test

The Input Field block attempts to generate a name attribute from its label in the save() function when the name attribute does not exist. This is handled via the getNameFromLabel() function. Inside this function, we create a dummy element that contains the label string, and generate an appropriate name attribute from its innerText.

However, if we assume that the Input Field block is registered in the fixture test, this process will result in an error.

TypeError: Cannot read properties of undefined (reading 'replace')

  26 |      // Get the slug.
  27 |      return (
> 28 |              removeAccents( dummyElement.innerText )
     |                           ^
  29 |                      // Convert anything that's not a letter or number to a hyphen.
  30 |                      .replace( /[^\p{L}\p{N}]+/gu, '-' )
  31 |                      // Convert to lowercase

If we don't generate a dummy element and replace it with logic that removes the HTML tag, the fixture test should pass.

Step-by-step reproduction instructions

N/A

Screenshots, screen recording, code snippet

No response

Environment info

No response

Please confirm that you have searched existing issues in the repo.

Yes

Please confirm that you have tested with all plugins deactivated except Gutenberg.

Yes