Writing Flow: up arrow can't traverse template part or synced pattern

[annezazu]

Pulling from the FSE Outreach Program's Final Touches call for testing:

I also noticed that when navigating blocks in list view, the up arrow key sometimes cannot traverse back up when it encounters synced patterns, or a footer template part. From this GIF image https://s.id/1V2kO, you’ll notice that near the end of the animation, the key got stuck in the spacer and footer block.

Here's a video using 6.4-beta2 and GB 16.7.1:

Screen.Recording.2023-10-09.at.2.32.21.PM.mov

@andrewserong as I know you have it on your list to improve List View #49563

[andrewserong]

Thanks for the ping!

From testing this out, and looking at the embedded screengrab and the linked GIF, this appears to be a writing flow issue within the editor canvas rather than a list view issue, as the cursor being trapped / the up key not working appears to only occur when focus is within the editor canvas rather than within the list view.

Here's a screengrab (focus is within the list view when there's an extra border around list view items):

2023-10-10.11.04.46.mp4

In the above screengrab:

• First, click on a selected block within the list view to shift focus to be within the list view. Up and down arrow keys appear to work and allow traversing between a block and an adjacent template part of synced pattern
• Shift focus to be within the editor canvas and then attempt to use up/down arrows to navigate outside the boundaries of the template part — the user can't press up to move up into the next template part / synced pattern
• Move focus back to the list view, and the user can navigate via the cursor keys again

I've updated the labels and issue title to reflect Writing Flow. I haven't followed recent changes to writing flow too closely, so I'll just ping @ellatrix in case this issue rings any bells. But do let me know if anyone encounters further keyboard issues when focus is within the list view!

[andrewserong]

Just linking a potentially similar issue: #51554

[annezazu]

Ah ha. Great sleuthing. I'll loop these both into this issue: #53305

[ellatrix]

I'll need more info on what's in that synced pattern. Can you share the blocks?

[annezazu]

Sure! I cheated and just pulled in this Core provided pattern: https://wordpress.org/patterns/pattern/fullwidth-vertically-aligned-headline-on-right-with-description-on-left/ and then converted it to a synced pattern :D

[ellatrix]

The problem is the click to select stuff. The synced pattern has an overlay that prevents the nested paragraph from gaining focus.

[alexstine]

The related issue can be found here: #54369