Plotly 3.0.0-rc.2 breaks the initial modebar hover efect #7335

Activity

1. Lexachoc commented on Jan 16, 2025

   

   Lexachoc

   on Jan 16, 2025

   ContributorAuthor

   More actions

   The document.querySelectorAll('#' + modeBarId + ' .modebar-btn') is NodeList [] on init until clicking on the icon in modebar.

   plotly.js/src/components/modebar/modebar.js

   Line 64 in 9010f78

   Lib.setStyleOnHover('#' + modeBarId + ' .modebar-btn', '.active', '.icon path', 'fill: ' + style.activecolor, 'fill: ' + style.color);
2. Lexachoc commented on Jan 17, 2025

   

   Lexachoc

   on Jan 17, 2025

   Last edited by Lexachoc

   ContributorAuthor

   More actions

   Also, the new introduced setStyleOnHover in v3.0.0-r2 also brings to another issue for the modebsr color and activecolor.

   When hovering, the color and activecolor are being set to the previous old ones! It will not affect when the colors are static color codes like "red" or "blue".

   When using CSS variables for the colors, it is noticeable to see that the old colors are being used in the hover listening event. (e.g., toggle a theme, I do update the uirevision and retrieve the latest CSS variable value from the document, but the hover listening event is always used the old value)

   My workaround is to remove the mouseenter and mouseleave events and re add again. But I think there should be a better way.

   See: https://github.com/plotly/plotly.js/pull/7109/files

   It would be nice to fix the old color issue along with this issue, as it is the same PR that the issue comes from.

   See: #7109
3. marthacryan

   closed this as completedin #7338on Jan 17, 2025