Skip to content

[Bug]: Flash of outline when opening page/popover #25432

@NotWoods

Description

@NotWoods

Library

React Components / v9 (@fluentui/react-components)

System Info

System:
    OS: Windows 10 10.0.22621
    CPU: (20) x64 Intel(R) Core(TM) i9-10900K CPU @ 3.70GHz
    Memory: 96.31 GB / 127.71 GB
  Browsers:
    Edge: Spartan (44.22621.674.0), Chromium (106.0.1370.52)
    Internet Explorer: 11.0.22621.1

Are you reporting Accessibility issue?

no

Reproduction

https://codesandbox.io/s/3f3lf5?file=/example.tsx

Bug Description

Actual Behavior

When loading a page with a focusable button, or opening a popover with a focusable button, each button's outline appears for a moment before animating away. It also appears to animate layout.

FluentOutlineFlash

Expected Behavior

Except to not see outline at all until focus is reached. I noticed this bug in both 9.6.0 and 9.5.0.

Logs

No response

Requested priority

Normal

Products/sites affected

No response

Are you willing to submit a PR to fix?

no

Validations

  • Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
  • The provided reproduction is a minimal reproducible example of the bug.

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions