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
Issue fork admin_toolbar-3564892
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
Comment #2
dydave commentedChanges introduced in issue:
#2873228: Toolbar menu accessible and navigable with keyboard
with commit:
https://git.drupalcode.org/project/admin_toolbar/-/commit/fdf0b1fcaed426...
See also: #2630724: Consider changes to link title parameter to avoid tooltip visual conflict
Comment #5
dydave commentedI 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...
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! 😊