Jetpack Block PHP Fixture Tests: Tracking issue for blocks requiring server-side rendering tests

[andrewserong]

In #19743 we introduced a server-side fixture test for the Business Hours block. The test grabs the serialized markup from the JS-based fixtures tests, and runs the markup through the block's server-side render_block function. If a fixture for the server rendering does not exist, one is created. If a fixture exists, then the output of the render_block function is compared against the *.server-rendered.html fixture.

In this way, we have a (hopefully) fairly simple way of adding tests for the server rendering of blocks, in addition to the existing fixture tests that cover the JS edit and save behaviour.

This tracking issue is to add in similar tests for all the other Jetpack blocks that use server rendering. In #19985 we introduced a generalised approach to running PHP-based server rendered fixtures tests by adding a parent Jetpack_Block_Fixture_TestCase class to inherit from when adding a fixture test to the test/php/extensions/blocks directory. Instructions are proposed in #20004.

Steps to add a server-rendered fixture

• Copy an existing PHP block fixture test that inherits from Jetpack_Block_Fixture_TestCase (e.g. https://github.com/Automattic/jetpack/blob/HEAD/projects/plugins/jetpack/tests/php/extensions/blocks/test-repeat-visitor.php)
• Save to the same directory with a filename matching the block that you're targeting
• Ensure there are existing .serialized.html block fixtures for this block
• Update class names, comments, and the BLOCK_NAME class constant to reference the block you're trying to test
• Take a look at the test_server_side_rendering_based_on_serialized_fixtures tests and set any server side state or mocks that are required before the dynamic block's render callback is called, and add that code before calling $this->generate_server_side_rendering_based_on_serialized_fixtures() to run through generating and testing the server-rendered block fixtures.
• Update the call to $this->generate_server_side_rendering_based_on_serialized_fixtures() to include the appropriate slug to match the directory containing the block's code, and the desired extension for the generated server-rendered markup (usually defaults to .server-rendered.html)

Tasks

• See if the approach from Jetpack Block PHP Fixture Tests: Add test for the server rendered Business Hours block #19743 can be generalised in a useful way into utility functions for these tests (addressed in Repeat Visitor Block: Add JS and PHP fixture tests #19985)
• Ensure that deprecated markup is also picked up by these server-based tests. Deprecated markup that hasn't yet been migrated to the current markup (E.g. an old blog post that a user hasn't gone back to edit) should also result in successful server rendering of the block.

Blocks that could use tests for their server-side rendering

Note: I haven't included blocks that use a render_block function that only loads assets. Each of the below blocks alters rendered markup in some way, so would benefit from fixture tests.

Also some blocks might perform API requests or do other things that could make it harder to get them under test. In some cases maybe this is an opportunity to do some light refactoring. In others, perhaps we should park it until we need to make changes to the block further down the track.

• jetpack/business-hours
• jetpack/button
• jetpack/calendly (include deprecations, could be a good one to start with)
• jetpack/contact-form and associated blocks (registered here
  • jetpack/field-text
  • jetpack/field-name
  • jetpack/field-email
  • jetpack/field-url
  • jetpack/field-date
  • jetpack/field-telephone
  • jetpack/field-textarea
  • jetpack/field-checkbox
  • jetpack/field-checkbox-multiple
  • jetpack/field-radio
  • jetpack/field-select
  • jetpack/field-consent
• jetpack/contact-info and associated blocks
  • jetpack/address
  • jetpack/email
  • jetpack/phone
• jetpack/donations
• jetpack/eventbrite
• jetpack/gif
• jetpack/google-calendar
• jetpack/image-compared (just for AMP support?)
• jetpack/instagram-gallery
• jetpack/mailchimp
• jetpack/map (inserts an API key, might need some mocking?)
• jetpack/opentable
• jetpack/pinterest
• jetpack/podcast-player
• jetpack/premium-content
• jetpack/rating-star
• jetpack/recurring-payments
• jetpack/repeat-visitor (Repeat Visitor Block: Add JS and PHP fixture tests #19985)
• jetpack/revue
• jetpack/simple-payments
• jetpack/slideshow
• jetpack/story (Story block: Fix (server-side) rendering of external stories #19876)
• jetpack/tiled-gallery
• jetpack/wordads

Note: For the Jetpack Contact Form, tests already exist — before working on it, check to see whether or not the existing tests provide adequate coverage. We might not need to fixture tests for this one if the existing tests suffice.