Fix: Don't render image when src attribute is empty

[SantosGuillamot]

What?

In this old pull request, a check was introduced to not render the image when the src attribute is not defined. Following the same logic, I believe the image shouldn't render when the attribute is an empty string. This could be the case when that attribute is connected to an empty custom field through block bindings, for example.

Why?

When the image src is an empty string, this is the resulting HTML in trunk

<figure class="wp-block-image"><img decoding="async" src="" alt=""></figure>

Following the same reasoning of the original PR: "According to MDN, the img element must have src attribute, so I believe this is incorrect markup."

The src attribute is required, and contains the path to the image you want to embed.

For that reason, I think it is better to not render the image.

How?

I'm just changing the conditional to not render the image when the attribute is falsy, not only null.

Testing Instructions

1. Register a custom field with an empty value by default.

	register_meta(
		'post',
		'empty_field',
		array(
			'label'          => 'Empty Field',
			'show_in_rest' => true,
			'single'       => true,
			'type'         => 'string',
			'default'      => '',
		)
	);

2. Go to a page and insert an image.
3. Connect the image src to the empty field. Go to the block settings -> Attributes -> Click three dots -> Select URL -> Connect it to a custom field.
4. Go to the frontend and check that the HTML doesn't include the empty img.

[gziolo]

Tested locally and it works perfectly fine. I set one of the connected images to have an empty string as URL:

The second image is a valid URL:

Before:

After (no broken image, no HTML printed):

[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: SantosGuillamot <[email protected]>
Co-authored-by: gziolo <[email protected]>

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

[github-actions]

I just cherry-picked this PR to the wp/6.7 branch to get it included in the next release: a0f74e8

[t-hamano]

Thanks for the fix! I can't remember why I used a null check instead of an empty check, but I think the approach in this PR is the best.