Problem/Motivation

This is a follow-up to #3564229: Admin Toolbar Search: Refactor admin_toolbar_search.js, where ESLINT errors were fixed for the file 'admin_toolbar_search.js', leaving the only remaining reported errors in file 'admin_toolbar.js', see latest build on 3.x:
https://git.drupalcode.org/project/admin_toolbar/-/pipelines/694830
With the errors listed in the job:
https://git.drupalcode.org/project/admin_toolbar/-/jobs/7781424#L48

Steps to reproduce

Create a new build pipeline on 3.x at:
https://git.drupalcode.org/project/admin_toolbar/-/pipelines/new

Proposed resolution

Fix all reported ESLINT validation errors:
Use the command locally with the --fix flag, to fix automatically as many errors as possible.
Fix manually remaining errors.

Avoid making changes to the existing logic and just keep the current code with JQuery.

The JS code could be refactored and rewritten with Vanilla JS in a separate issue.
This issue should be focused on just getting the ESLINT job to pass.

Remaining tasks

User interface changes

API changes

Data model changes

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

dydave created an issue. See original summary.

  • dydave committed 0a397e4f on 3.x
    Issue #3564892 by dydave: Fixed eslint validation errors in '...
dydave’s picture

Status: Active » Fixed

I have been working for some time on rewriting the file 'admin_toolbar.js' with Vanilla JS and was able to make significant progress.

But it's probably less risky for now, before creating a new stable release, to just fix the ESLINT errors and keep the existing logic with jQuery.

Mostly the file seems to do two things:
1 - Remove the 'title' attributes from menu links to prevent conflicts with the menu dropdown, introduced in issue:
#2630724: Consider changes to link title parameter to avoid tooltip visual conflict
The way this was implemented could probably be improved, with a bit less radical method, avoiding to removing the title attribute completely.
We could maybe try wrapping links inner text with a span tag, with an empty title attribute:
<span title="">
which would allow keeping title attributes and just prevent the display of tooltips.
But this would most likely need a specific ticket, to be discussed in more details.

2 - Provide a very basic keyboard navigation, introduced in:
#2873228: Toolbar menu accessible and navigable with keyboard
The existing logic with jQuery was kept unchanged for now.
Refactoring with Vanilla JS should probably also be addressed in a separate issue.

Otherwise: removed the two last blocks of jQuery code at:
https://git.drupalcode.org/project/admin_toolbar/-/blob/3.6.2/js/admin_t...

      $('.toolbar-menu:first-child > .menu-item', context).on('hover', function () {
        $(this, 'a').css("background: #fff;");
      });

      $('ul:not(.toolbar-menu)', context).on({
        mousemove: function () {
          $('li.menu-item--expanded').removeClass('hover-intent');
        },
        hover: function () {
          $('li.menu-item--expanded').removeClass('hover-intent');
        }
      });

Since I was unable to really test these pieces of code.

Added changes to the file 'admin_toolbar_search.js', based on the feature discussed at #3564229-7: Admin Toolbar Search: Refactor admin_toolbar_search.js.

Overall, these changes should be very localized and any potential impacts would only be around the keyboard navigation.
Therefore, since these changes seemed rather safe and all the jobs and tests passed 🟢, I went ahead and merged the changes above at #4. 🥳

The build pipelines are finally coming back green 🟢, without any warnings.

A follow-up task was created to address the points above:
#3564895: Improve admin_toolbar.js
so we could come back to these changes at a later point.

Marking issue as Fixed, for now.

Feel free to let us know if you encounter any issues with the latest code changes or would have any questions on the module in general, we would surely be glad to help.
Thanks in advance! 😊

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.