Problem/Motivation

When I ported the work in #3527890: Missing "nav-link" class on some navigation links to my custom theme, it broke some functionality on our site. Specifically, with https://www.drupal.org/project/layout_builder_modal the "Add Block" functionality stopped giving me a modal window because of a JavaScript error. What I found was that I had sidebar nav items that now looked like....

<span class="use-ajax js-layout-builder-block-link inline-block-list__item nav-link" data-dialog-type="dialog" data-dialog-renderer="off_canvas" data-once="ajax"><a href="/layout_builder/add/block/overrides/node.411/0/content/inline_block%3Avideo" class="use-ajax js-layout-builder-block-link inline-block-list__item" data-dialog-type="iframe" data-once="ajax">Video</a></span>

The attributes for my anchor that were repeated in the span were mostly harmless, but something related to the dialog and ajax attributes caused a JS error because the processing tied to them assumes they are only used on items that can resolve this.url.

The reason the fix in #3527890: Missing "nav-link" class on some navigation links causes this issue is because core's ThemePreprocess.php has this logic...

        // Handle title-only text items.
        $item['text'] = $link['title'];
        if (isset($link['attributes'])) {
          $item['text_attributes'] = new Attribute($link['attributes']);
        }

So text_attributes is going to be a copy of link['attributes'] and doesn't need to be considered when we are rendering a link.

I believe it should be safe, and resolve this issue to replace:

{%- if item.text_attributes -%}
   <span{{ item.text_attributes.addClass('nav-link') }}>{{ item.link }}</span>
 {%- else -%}
   <span class="nav-link">{{ item.link }}</span>
 {%- endif -%}
 

with simply...

   <span class="nav-link">{{ item.link }}</span>

Giving me final markup like....

<span class="nav-link"><a href="/layout_builder/add/block/overrides/node.51/0/content/inline_block%3Avideo" class="use-ajax js-layout-builder-block-link inline-block-list__item" data-dialog-type="iframe" data-once="ajax">Video</a></span>

Issue fork radix-3612635

Command icon Show commands

Start within a Git clone of the project using the version control instructions.

Or, if you do not have SSH keys set up on git.drupalcode.org:

Comments

cyu created an issue. See original summary.

cyu’s picture

Status: Active » Needs review

Merge request has been added here for review.

cyu’s picture

Issue summary: View changes
cyu’s picture

doxigo made their first commit to this issue’s fork.

  • doxigo committed e1225d0e on 6.0.x
    fix #3612635 Remove duplicative link attributes from wrapping span
    
doxigo’s picture

Status: Needs review » Fixed

Thanks Christopher, reviewed and merged 🙌

Now that this issue is closed, review the contribution record.

As a contributor, attribute any organization that helped you, or if you volunteered your own time.

Maintainers, credit people who helped resolve this issue.

Status: Fixed » Closed (fixed)

Automatically closed - issue fixed for 2 weeks with no activity.