search

gilbarbara / react-joyride

Create guided tours in your apps
https://react-joyride.com/
MIT License
6.73k stars 521 forks source link

Text inside card wiggles on button hover #1050

Closed camilovegag closed 1 month ago

camilovegag commented 1 month ago

🐛 Bug Report

bug

On Windows Chrome, when hovering over the skip or next button, the text wiggles up and down. This issue does not occur on macOS, so it's unclear if it's a problem on our end or related to the specific setup.

To Reproduce

Steps to reproduce the behavior:

  1. Open the application on Windows using Chrome.
  2. Hover over the skip or next button.

Expected behavior

When hovering over the skip or next button, the text should remain stable and not wiggle.

Link to repl or repo (highly encouraged)

Happening on our tool protocols.pluralresearch.org

Run npx envinfo --system --binaries --npmPackages react-joyride

Paste the results here:

  System:
    OS: Linux 5.10 Ubuntu 20.04.6 LTS (Focal Fossa)
    CPU: (8) x64 11th Gen Intel(R) Core(TM) i7-1165G7 @ 2.80GHz
    Memory: 5.81 GB / 7.62 GB
    Container: Yes
    Shell: 5.0.17 - /bin/bash
  Binaries:
    Node: 20.14.0 - /usr/bin/node
    npm: 10.8.1 - /usr/bin/npm
    pnpm: 9.4.0 - /mnt/c/Users/beneb/AppData/Roaming/npm/pnpm
  npmPackages:
    react-joyride: ^2.8.2 => 2.8.2
gilbarbara commented 1 month ago

Hey @camilovegag

Most likely, it's a problem with your app since no one ever complained about this. Maybe some global style for the buttons?

camilovegag commented 1 month ago

Hey @camilovegag

Most likely, it's a problem with your app since no one ever complained about this.

Maybe some global style for the buttons?

Thanks for replying, will look into it, the weird thing is that only happened on a windows chrome setup, does no happen on my mac chromium one

gilbarbara commented 1 month ago

It's really weird that it only happens on hover.

I don't think the user stylesheet for Chrome would be different between platforms. However, the always-visible scrollbar on Windows could cause some unrelated UI issues. Try inspecting the buttons and forcing the hover status to see if it triggers the same problem and if the style changes.