Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[Switch] In FF and Safari, Switch can have "double focus ring" #10824

Open
2 of 6 tasks
macandcheese opened this issue Nov 21, 2024 · 1 comment
Open
2 of 6 tasks

[Switch] In FF and Safari, Switch can have "double focus ring" #10824

macandcheese opened this issue Nov 21, 2024 · 1 comment
Labels
0 - new New issues that need assignment. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. Calcite (design) Issues logged by Calcite designers. calcite-components Issues specific to the @esri/calcite-components package. estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - low Issue is non core or affecting less that 10% of people using the library

Comments

@macandcheese
Copy link
Contributor

macandcheese commented Nov 21, 2024

Check existing issues

Actual Behavior

On MacOS, in Safari or FF, you can "tab back to" a selected Switch and it will receive focus. Chrome is not affected.

Safari:
Screenshot 2024-11-21 at 10 14 18 AM

FF:
Screenshot 2024-11-21 at 10 14 03 AM

Expected Behavior

I'd expect there to be a single focus outline.

Reproduction Sample

https://codepen.io/mac_and_cheese/pen/mdNZNEv?editors=100

Reproduction Steps

  1. In Safari or FF - Open Codepen
  2. Click to check / focus Switch
  3. Tab off switch
  4. Shift tab back to switch
  5. Notice double focus
  6. Repeat in Chrome and observe no issue

Reproduction Version

2.13.2

Relevant Info

Maybe related? #8617

Regression?

No response

Priority impact

impact - p3 - not time sensitive

Impact

No response

Calcite package

  • @esri/calcite-components
  • @esri/calcite-components-react
  • @esri/calcite-design-tokens
  • @esri/calcite-ui-icons
  • @esri/eslint-plugin-calcite-components

Esri team

Calcite (design)

@macandcheese macandcheese added bug Bug reports for broken functionality. Issues should include a reproduction of the bug. 0 - new New issues that need assignment. needs triage Planning workflow - pending design/dev review. labels Nov 21, 2024
@github-actions github-actions bot added Calcite (design) Issues logged by Calcite designers. calcite-components Issues specific to the @esri/calcite-components package. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive labels Nov 21, 2024
@geospatialem
Copy link
Member

Tested across Windows browsers, and this is also occurring in Firefox (but not Edge or Chrome).

image

@geospatialem geospatialem added p - low Issue is non core or affecting less that 10% of people using the library estimate - 2 Small fix or update, may require updates to tests. needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. and removed needs triage Planning workflow - pending design/dev review. labels Dec 18, 2024
@DitwanP DitwanP removed the needs milestone Planning workflow - pending milestone assignment, has priority and/or estimate. label Jan 3, 2025
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
0 - new New issues that need assignment. bug Bug reports for broken functionality. Issues should include a reproduction of the bug. Calcite (design) Issues logged by Calcite designers. calcite-components Issues specific to the @esri/calcite-components package. estimate - 2 Small fix or update, may require updates to tests. impact - p3 - not time sensitive User set priority impact status of p3 - not time sensitive p - low Issue is non core or affecting less that 10% of people using the library
Projects
None yet
Development

No branches or pull requests

3 participants