Problem/Motivation
When adding a Menu Item, it is possible to add special items like <nolink> or <button>
According to Menu Link form:Enter <nolink> to display link text only. Enter <button> to display keyboard-accessible link text only.
Current navigation twig template structure does not respect these items and render them as links whose href is empty, having a different behavior than the expected one.
Attaching screenshots of the same menu as part of navigation or as a block to show the differences:
Image may be NSFW.
Clik here to view.
Image may be NSFW.
Clik here to view.
Steps to reproduce
- Install a Drupal site and enable navigation
- Edit any of the menus included in the navigation bar
- Add menu links whose Link field value is <nolink> or <button>
- Confirm that those items are shown as empty links instead of the expected HTML markup
Proposed resolution
Update navigation twig templates to respect the special menu items behavior.
Checked how menu.html.twig
works and it seems this piece of code generates the expected markup:
{{
link(
item.title,
item.url,
item.attributes.removeClass(item_classes).addClass(link_classes)
)
}}
Could be worth to explore how it works and try to reuse or replicate its behavior.