adevinta / spark

✨ Simple, Modular & Accessible UI Components for your React Applications
https://sparkui.vercel.app
MIT License
49 stars 16 forks source link

[Snackbar] press enter or space on safari does not trigger action button #2249

Open elisa-hery opened 2 weeks ago

elisa-hery commented 2 weeks ago

Description

GIVEN I open a snackbar with action button or close button on safari WHEN I navigate with keyboard to the action button AND I press enter or space THEN the snackbar should be dismissed but nothing happens

https://github.com/adevinta/spark/assets/142396647/89f87d69-e6e0-45f8-bf4b-934dad1e60cd

Steps to reproduce

  1. Go to https://sparkui.vercel.app/iframe.html?id=components-snackbar--action&viewMode=story on safari
  2. with keyboard navigation open snackbar with action button
  3. with keyboard navigation try to trigger "undo" button
  4. See error

Spark Component and Version

snackbar - last version (not related to previous fix)

Browser

Safari Version 17.4.1

Operating System

Additional Information

No response

acd02 commented 2 weeks ago

👋 , Cannot reproduce on my end

Powerplex commented 1 week ago

I can reproduce and I isolated the issue. It seems to be a Safari bug related to a combination of styles on an html button. Here you can see the outline is not visible on Safari vs Chrome, I will investigate:

https://github.com/adevinta/spark/assets/2033710/632daf66-22dc-43f2-931e-837192e431a0