perf: passive event listener for focus visible (#27568)

Issue number: resolves #27566

---------

<!-- Please do not submit updates to dependencies unless it fixes an
issue. -->

<!-- Please try to limit your pull request to one type (bugfix, feature,
etc). Submit multiple pull requests if needed. -->

## What is the current behavior?
<!-- Please describe the current behavior that you are modifying. -->

The `touchstart` listener for focus visible is not marked as passive.
This causes a browser delay in case `touchstart` calls
`ev.preventDefault()`. However, we are not doing that in this block of
code.

## What is the new behavior?
<!-- Please describe the behavior or changes that are being added by
this PR. -->

- Added `passive: true` to the `touchstart` listener to avoid the
browser delay.

Note that this is only needed for touch and wheel events which is why I
only modified `touchstart`:
https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener

## Does this introduce a breaking change?

- [ ] Yes
- [x] No

<!-- If this introduces a breaking change, please describe the impact
and migration path for existing applications below. -->


## Other information

<!-- Any other information that is important to this PR such as
screenshots of how the component looks before and after the change. -->
This commit is contained in:
Liam DeBeasi
2023-05-30 11:50:29 -04:00
committed by GitHub
parent 2ce00cf292
commit e54bf142c3

View File

@@ -59,7 +59,7 @@ export const startFocusVisible = (rootEl?: HTMLElement) => {
ref.addEventListener('keydown', onKeydown);
ref.addEventListener('focusin', onFocusin);
ref.addEventListener('focusout', onFocusout);
ref.addEventListener('touchstart', pointerDown);
ref.addEventListener('touchstart', pointerDown, { passive: true });
ref.addEventListener('mousedown', pointerDown);
const destroy = () => {