Description

When pattern overrides are enabled for a block, the block name becomes the key that attribute data is stored under in instances of the pattern block. For example, a button block called "CTA" would store it's url attribute value in a pattern block's content like so:

content: { "CTA": { "url": "https://wordpress.org" } }

Another feature of pattern overrides is that two blocks can share the same name, so two paragraphs, or a paragraph and a heading can have their text content synced, with the data being stored in the same object.

A problem occurs when a user gives a button block and an image block the same name. The image block has the following attributes:

• url - used for the <img> tag's src attribute
• href - used for the optional <a> tag's href attribute

While the button block has:

• url - used for the optional <a> tag's href attribute

For image and button url means two different things. If an image and a button share the same override name, it can result in a broken image src when the user sets the button block's link. It's unfortunate that the button block's attribute isn't called href.

Another factor is that the image block's href isn't currently a supported attribute for pattern overrides / block bindings.

Step-by-step reproduction instructions

1. Add an image and a button to a post
2. Select both and create a pattern
3. Enable overrides for both the image and the button, and use the same block name.
4. Save the pattern and go back to the post
5. Set the button block's link to something that's not an image url (e.g. https://wordpress.org)

Expected: The link for the image is set to the same thing given the two blocks are named the same
Actual: The image block has a broken image

Screenshots, screen recording, code snippet

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