Problem/Motivation

For anonymous users, the javascript file admin-toolbar-wrapper.js gets loaded for some reason that I could figure out. That then issues the following error on the browser console:

Uncaught TypeError: doc.querySelector(...) is null
    attach https://www.example.com/core/modules/navigation/js/admin-toolbar-wrapper.js?v=10.4.0:71
    attach https://www.example.com/core/modules/navigation/js/admin-toolbar-wrapper.js?v=10.4.0:158
    attachBehaviors https://www.example.com/core/misc/drupal.js?v=10.4.0:166
    attachBehaviors https://www.example.com/core/misc/drupal.js?v=10.4.0:162
    <anonymous> https://www.example.com/core/misc/drupal.init.js?v=10.4.0:32
    listener https://www.example.com/core/misc/drupal.init.js?v=10.4.0:20

This is due to the following code:

              doc.querySelector('.admin-toolbar').dispatchEvent(
                new CustomEvent(SIDEBAR_CONTENT_EVENT, {
                  detail: {
                    state: newState,
                  },
                }),
              );

Proposed resolution

Check for .admin-toolbar being present.

CommentFileSizeAuthor
#6 drupal-3496541-6.patch2.72 KBgrimreaper

Issue fork drupal-3496541

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:

About issue forks

Comments

jurgenhaas created an issue. See original summary.

jurgenhaas opened merge request !10737

jurgenhaas’s picture

jurgenhaas
he/him
Primary language German
Location Gottmadingen
commented
Status: Active » Needs review
finnsky’s picture

finnsky commented

Thank you for fix. Actually it is interesting why toolbar js loaded for anonymous.

jurgenhaas’s picture

jurgenhaas
he/him
Primary language German
Location Gottmadingen
commented

Actually it is interesting why toolbar js loaded for anonymous.

Yeah, that caught me by surprise too. I was trying to determine where this is coming from, but I wasn't able to find out. It looks like it comes from the NavigationLayout, however, that shouldn't be touched either.

grimreaper’s picture

grimreaper
Primary language French
Location France 🇫🇷
commented
Status: Needs review » Reviewed & tested by the community
StatusFileSize
new drupal-3496541-6.patch2.72 KB

Hi,

Thanks for the fix! I have the same problem on 10.4.

Here is a patch from the MR for Composer usage until it is merged.

finnsky’s picture

finnsky commented

It still seems to me that in this task it is much more important to understand why the script is loaded in the wrong place than to fix the script directly. This is also a bug and a much more serious bug.

@grimreaper,
Maybe you have steps to reproduce? A list of third-party modules and some other details?

grimreaper’s picture

grimreaper
Primary language French
Location France 🇫🇷
commented

I found my culprit...

https://git.drupalcode.org/project/navigation_extra_tools/-/blob/1.1.x/n...

/**
 * Implements hook_page_attachments().
 */
function navigation_extra_tools_page_attachments(&$variables) {
  $variables['#attached']['library'][] = 'navigation_extra_tools/icon';
}

No check at all if the navigation is present or not.

I will create an issue on this project.

larowlan’s picture

larowlan
Location 🇦🇺🏝.au GMT+10
commented
Status: Reviewed & tested by the community » Needs review

Left one comment on the MR, thanks

jurgenhaas’s picture

jurgenhaas
he/him
Primary language German
Location Gottmadingen
commented
Related issues: +#3497060: Add library only if needed

@grimreaper thanks for the tip in #8, turns out it was the same issue here. Linking to #3497060: Add library only if needed for others who may come along here.

Even if this is certainly an issue in contrib, the safeguard in the js file still seems to make sense.

smustgrave’s picture

smustgrave commented
Status: Needs review » Reviewed & tested by the community

Feedback appears to be addressed

nod_ closed merge request !10737

nod_’s picture

nod_
Primary language French
Location Lille
commented
Title: admin-toolbar-wrapper: Uncaught TypeError: doc.querySelector(...) is null » Error when navigation JS is loaded for anonymous users
Version: 11.x-dev » 10.5.x-dev
Status: Reviewed & tested by the community » Fixed

Committed and pushed 554b7c600ad to 11.x and b5ccec7567d to 11.1.x and 07ae29edb49 to 10.5.x. Thanks!

  • nod_ committed 07ae29ed on 10.5.x 
    Issue #3496541 by jurgenhaas, grimreaper, larowlan: Error when...

  • nod_ committed b5ccec75 on 11.1.x 
    Issue #3496541 by jurgenhaas, grimreaper, larowlan: Error when...

  • nod_ committed 554b7c60 on 11.x 
    Issue #3496541 by jurgenhaas, grimreaper, larowlan: Error when...
nod_’s picture

nod_
Primary language French
Location Lille
commented
nod_’s picture

nod_
Primary language French
Location Lille
commented
Title: admin-toolbar-wrapper: Uncaught TypeError: doc.querySelector(...) is null » Error when navigation JS is loaded for anonymous users
Version: 11.x-dev » 10.5.x-dev
Status: Reviewed & tested by the community » Fixed

Status: Fixed » Closed (fixed)

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