Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Don't try and render unstable location if Nav block has ID #36863

Merged
merged 4 commits into from
Nov 26, 2021

Conversation

getdave
Copy link
Contributor

@getdave getdave commented Nov 25, 2021

Description

We learnt in Automattic/themes#5086 that if you are using a Universal Theme the Nav block can end up rendering nothing even though there are items added in the Site Editor.

Since the Navigation block now stores its inner "items" in a CPT there a no longer an inner blocks stored directly on the block itself. the only time when inner blocks are stored directly on the block is if the block is part of a pattern. If you are working with the Nav block within the editor your changes are saved to the CPT and not as inner blocks.

If __unstableLocation is defined (universal Themes) then even if you add "items" to the Nav block in the Site Editor, the front end rendering code will try and render the menu at __unstableLocation. If such a Menu does not exist then nothing is shown. This is due to the conditional:

if ( empty( $inner_blocks ) && array_key_exists( '__unstableLocation', $attributes ) ) {

This is wrong. The contents of the Site Editor should take precedence. The reason they aren't is that the code is expecting the contents of the Nav block to be the inner blocks whereas this can now also be indicated by the presence of a navigationMenuId attribute (which references the wp_navigation CPT where the nav "items" are stored).

Addresses Automattic/themes#5086

Closes #36865

How has this been tested?

  • Install the "universal" Blockbase Theme.
  • Make sure you have no (classic menus defined for the site in the customizer.

On trunk

  • Go to the Site Editor, click on the header and add a few links to the navigation block
  • Check the frontend: no menu shows up

On this PR

  • Go to the Site Editor, click on the header and add a few links to the navigation block
  • Check the frontend: the items you manually added in the Site Editor should show up.

Screenshots

Types of changes

Checklist:

  • My code is tested.
  • My code follows the WordPress code style.
  • My code follows the accessibility standards.
  • I've tested my changes with keyboard and screen readers.
  • My code has proper inline documentation.
  • I've included developer documentation if appropriate.
  • I've updated all React Native files affected by any refactorings/renamings in this PR (please manually search all *.native.js files for terms that need renaming or removal).

@getdave getdave added [Block] Navigation Affects the Navigation Block [Type] Bug An existing feature does not function as intended labels Nov 25, 2021
@getdave getdave added the [Feature] Themes Questions or issues with incorporating or styling blocks in a theme. label Nov 25, 2021
@getdave getdave self-assigned this Nov 25, 2021
@getdave getdave marked this pull request as ready for review November 25, 2021 14:26
@getdave getdave requested a review from talldan November 25, 2021 14:28
@adamziel
Copy link
Contributor

Looks good to me, but cc-ing @talldan who might have more context here.

@getdave getdave mentioned this pull request Nov 25, 2021
38 tasks
Copy link
Contributor

@scruffian scruffian left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

This solves the problem for me.

…as long as there are items at that location.
@scruffian
Copy link
Contributor

I added a commit to address #36865

So the priority is:

  1. navigationMenuId
  2. __unstableLocation, providing that the menu at that location has items
  3. innerBlocks

@getdave getdave force-pushed the fix/nav-block-unstable-location-for-universal-themes branch from 02079cc to c6fc6da Compare November 26, 2021 09:58
array_key_exists( '__unstableLocation', $attributes ) &&
! array_key_exists( 'navigationMenuId', $attributes ) &&
! empty( gutenberg_get_menu_items_at_location( $attributes['__unstableLocation'] ) )
) {
$menu_items = gutenberg_get_menu_items_at_location( $attributes['__unstableLocation'] );
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

There is now an inefficiency here as we are calling gutenberg_get_menu_items_at_location twice...

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Let's follow up here.

@getdave getdave merged commit 9ac58ac into trunk Nov 26, 2021
@getdave getdave deleted the fix/nav-block-unstable-location-for-universal-themes branch November 26, 2021 12:45
@github-actions github-actions bot added this to the Gutenberg 12.1 milestone Nov 26, 2021
noisysocks pushed a commit that referenced this pull request Dec 6, 2021
* Don't try and render unstable location if Nav block has ID

* Reinstate condition for empty inner blocks

* Lint

* Show the unstableLocation menu items even if there are inner blocks, as long as there are items at that location.

Co-authored-by: Adam Zieliński <adam@adamziel.com>
Co-authored-by: Ben Dwyer <ben@scruffian.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
[Block] Navigation Affects the Navigation Block [Feature] Themes Questions or issues with incorporating or styling blocks in a theme. [Type] Bug An existing feature does not function as intended
Projects
None yet
Development

Successfully merging this pull request may close these issues.

Navigation Block: Render nav items from __unstableLocation even if there is content inside the block.
4 participants