Clicking on extra added toolbar tabs produces JS error

Created on 31 March 2022, about 2 years ago
Updated 27 April 2023, about 1 year ago

Problem/Motivation

Toolbar tabs added from for instance other contrib modules like Rebuild Cache Access or Geysir to the toolbar produce a JS error when clicking. This happens because of certain classes are not set on these and the referenced elements in the script cannot be targeted.

Uncaught TypeError: Cannot read properties of undefined (reading 'id')

Steps to reproduce

Click on the toolbar on any custom toolbar tab to produce the JS error:

Proposed resolution

Add extra checks to validate

var tray = $(e.target).nextAll(".toolbar-tray");

        // Toolbar tabs click.
        $(
          ".toolbar-tab>button,.toolbar-tab>a:not(.toolbar-icon-escape-admin,#toolbar-item-administration-search)"
        )
          .once("seedsToolbar")
          .click(function (e) {
            if ($(e.target).hasClass("trigger")) {
              e.preventDefault();
            }
            var tray = $(e.target).nextAll(".toolbar-tray");
            if ($(tray).hasClass("shown")) {
              closeMenu(tray);
            }
              else {
              // Setting a variable in session storage for persisting last menu link clicked in seed toolbar.
              sessionStorage.setItem("seedActiveToolBar", tray[0].id);
              openMenu(tray);
            }
          });
πŸ› Bug report
Status

Fixed

Version

2.0

Component

Code

Created by

πŸ‡§πŸ‡ͺBelgium johanvdr

Live updates comments and jobs are added and updated live.
Sign in to follow issues

Comments & Activities

Not all content is available!

It's likely this issue predates Contrib.social: some issue and comment data are missing.

Production build 0.69.0 2024