Gutenberg: wp.data.select() is not working on the Experimental Navigation page

[manmotive]

Describe the bug

I am attempting to retrieve the menu item ID (the underlying post ID) of the selected menu item. On the Experimental Navigation page, I believe the menu item ID will be stored as the clientId on the block.

I am using the following to get the clientId:

wp.data.select( 'core/block-editor' ).getSelectedBlock().clientId;

On a standard post or page

This works, the client ID is returned as expected:

On the Experimental Navigation page

This doesn't work, the same code returns an error:

To reproduce

1. Go to Gutenberg > Navigation (beta)
2. Select a menu item
3. Paste the following into the console:

wp.data.select( 'core/block-editor' ).getSelectedBlock().clientId;

1. See error

Expected behavior

The client ID of the selected block is returned.

Editor version:

• WordPress version: 5.4.1
• Does the website has Gutenberg plugin installed, or is it using the block editor that comes by default? Plugin
• If the Gutenberg plugin is installed, which version is it? 8.0

[manmotive]

Screencast:

https://www.youtube.com/watch?v=mB5kvC2hy0E

[noisysocks]

It looks like there's two separate issues here:

1. wp.data.select( 'core/block-editor' ).getSelectedBlock() should not return undefined on the Navigation screen. This is a bug.

2. As mentioned in https://github.com/WordPress/gutenberg/pull/21036#issuecomment-628353007, there's currently no way for third parties to get the ID of the underlying menu item given a Navigation Link's client ID.

   We probably should be using @wordpress/data in the Navigation screen. Props to @talldan for first suggesting this. We could then close this issue by adding e.g. a getMenuItem selector.

   wp.data.select( 'core/edit-navigation' ).getMenuItem( clientId )
   

[talldan]

I wonder if this is because those selectors can only run within the scope of the <BlockEditorProvider>. Looks like the same thing happens on the experimental Widgets screen.

[youknowriad]

No, that's because by BlockEditorProvider is "scoped" which means it doesn't rely on the global 'core/block-editor' store. I'd argue that it's a good thing to start this way and see later if we really need to make it global. (it's just a prop)

[adamziel]

As mentioned in #21036 (comment), there's currently no way for third parties to get the ID of the underlying menu item given a Navigation Link's client ID.

https://github.com/WordPress/gutenberg/pull/23033 solved this issue. It is now possible to use the following selectors:

wp.data.select( 'core/edit-navigation' ).getNavigationPostForMenu( menuId );
wp.data.select( 'core/edit-navigation' ).getMenuItemForClientId( clientId );

[adamziel]

wp.data.select( 'core/block-editor' ).getSelectedBlock() should not return undefined on the Navigation screen. This is a bug.

https://github.com/WordPress/gutenberg/pull/23675 will solve this problem - I encourage reviews and discussion.

[adamziel]

This issue is now solved in full. Feel free to reopen if anything comes up.