Summary: | jQuery upgrade broke search button hover effect | ||
---|---|---|---|
Product: | Koha | Reporter: | Owen Leonard <oleonard> |
Component: | Templates | Assignee: | Owen Leonard <oleonard> |
Status: | CLOSED FIXED | QA Contact: | Testopia <testopia> |
Severity: | trivial | ||
Priority: | P5 - low | CC: | arthur.suzuki, lucas, testopia |
Version: | Main | ||
Hardware: | All | ||
OS: | All | ||
Change sponsored?: | --- | Patch complexity: | Trivial patch |
Documentation contact: | Documentation submission: | ||
Text to go in the release notes: | Version(s) released in: |
22.11.00, 22.05.08
|
|
Bug Depends on: | 29155 | ||
Bug Blocks: | |||
Attachments: |
Gif showing the intended behavior
Bug 31653: Correct event names passed to jQuery on() function Bug 31653: Correct event names passed to jQuery on() function Bug 31653: Correct event names passed to jQuery on() function Bug 31653: Correct event names passed to jQuery on() function |
Created attachment 141087 [details] [review] Bug 31653: Correct event names passed to jQuery on() function This patch replaces the obsolete .on("hover") with .on("mouseenter mouseleave"). This will allow the code to work again following the last jQuery upgrade. See Bug 20217 for discussion of the original implementation: https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=20217#c14 To test, apply the patch and go to the staff interface. Hover your mouse over the "Search" link in the header menu. The adjacent dropdown menu button should have its hover state triggered. Created attachment 141088 [details] [review] Bug 31653: Correct event names passed to jQuery on() function This patch replaces the obsolete .on("hover") with .on("mouseenter mouseleave"). This will allow the code to work again following the last jQuery upgrade. See Bug 20217 for discussion of the original implementation: https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=20217#c14 To test, apply the patch and go to the staff interface. Hover your mouse over the "Search" link in the header menu. The adjacent dropdown menu button should have its hover state triggered. Signed-off-by: David Nind <david@davidnind.com> Trivial fix, works as expected. Created attachment 141089 [details] [review] Bug 31653: Correct event names passed to jQuery on() function This patch replaces the obsolete .on("hover") with .on("mouseenter mouseleave"). This will allow the code to work again following the last jQuery upgrade. See Bug 20217 for discussion of the original implementation: https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=20217#c14 To test, apply the patch and go to the staff interface. Hover your mouse over the "Search" link in the header menu. The adjacent dropdown menu button should have its hover state triggered. Signed-off-by: David Nind <david@davidnind.com> Created attachment 141090 [details] [review] Bug 31653: Correct event names passed to jQuery on() function This patch replaces the obsolete .on("hover") with .on("mouseenter mouseleave"). This will allow the code to work again following the last jQuery upgrade. See Bug 20217 for discussion of the original implementation: https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=20217#c14 To test, apply the patch and go to the staff interface. Hover your mouse over the "Search" link in the header menu. The adjacent dropdown menu button should have its hover state triggered. Signed-off-by: David Nind <david@davidnind.com> Signed-off-by: Lucas Gass <lucas@bywatersolutions.com> Pushed to master for 22.11. Nice work everyone, thanks! Backported to 22.05.x for upcoming 22.05.08 release depends on 29155 and new jQuery version. not relevant to 21.11. |
Created attachment 141083 [details] Gif showing the intended behavior When we upgrade jQuery I missed an instance of deprecated code: "hover" is no longer an alias for "mouseenter mouseleave" when used with on(). Instead of... $("a").on("hover", function... ...we must use... $("a").on("mouseenter mouseleave", function... This change broken the hover action which is supposed to be triggered when the user's mouse interacts with the "Search" button in the header menu. See attached gif.