Click-through pattern not behaving as expected for Template Parts

[jameskoster]

Description

There is currently a small discrepancy between the selection behaviour for Template Parts and Reusable Blocks on the canvas.

Both utilise the 'overlay' and 'click-through' pattern which dictates that regardless of where you click on the block, the parent will always be selected first. Subsequent clicks are required to select children. Here's how that works for Reusable Blocks:

RB.mp4

The same is not true of Template Parts. In the video below I am able to bypass the click-through and directly select the Site Title and the Navigation block:

TP.mp4

It's interesting that clicking the site tagline block doesn't bypass the click-through, so I'm not sure if the problem is with the Template Part block, or the Site Title and Navigation blocks instead.

The issue exists in both the template editor and the site editor.

Step-by-step reproduction instructions

1. Install and activate a block theme.
2. If one doesn't exist, create a Header template part and place it in whichever template is used to render pages.
3. Ensure the Header template part includes an instance of the Site Title and Navigation blocks.
4. Edit a page in the post editor.
5. In the Template section of the Inspector, click 'Edit'.
6. Hover the Site Title or Navigation block and click
7. Notice that the Site Title or Navigation block is selected rather than the Header template part

[Addison-Stavlo]

so I'm not sure if the problem is with the Template Part block, or the Site Title and Navigation blocks instead.

If I create a reusable block with a Site Title in it, I can repro the same behavior there as well. 🤔

I can't seem to repro in either with just the navigation block as is seen in your gif.

[Addison-Stavlo]

It seems possibly related to RichText in some way.

For the SiteTitle, I notice the issue is no longer present if I change the RichText's tagName prop from a to div (not certain of the implications here, or why its an a anyways).

I can also repro the same issue by adding a Buttons/Button block with some text in it (it also uses RichText, although not any a tag):

Although there are plenty of other blocks that use RichText that don't seem to have any issue.

[Mamaduka]

I'm removing this issue from WP 5.9 project board since RC1 was released last night.

We can try and work on the fix for the next minor release.

[annezazu]

This came up as part of the twelfth call for testing for the FSE Outreach Program:

Clicking Header or any template section is somewhat difficult, as it easily selects blocks inside of it.

I've experienced this personally and have also seen this come up throughout the community as folks are trying to ensure that they are adding content to the right spaces. Since template parts update everywhere, it's key that we ensure folks have a way to do so without much friction. The current experience makes this difficult without using List View.