search

facebook / react

The library for web and native user interfaces.
https://react.dev
MIT License
227.54k stars 46.42k forks source link

autoFocus polyfill deviates from HTML autofocus global attribute spec #23231

Open kate-hall opened 2 years ago

kate-hall commented 2 years ago

Based on this comment: https://github.com/facebook/react/issues/11851#issuecomment-351672131, it appears autoFocus is meant to bring a consistent behavior to match HTML's autofocus.

https://html.spec.whatwg.org/multipage/interaction.html#the-autofocus-attribute

The above spec outlines that the first element with autofocus found in the DOM should be the one focused, and the others discarded ("flush autofocus candidates" steps 5.11.1 through 5.11.3).

However, the behavior of React's autoFocus polyfill is to set focus to the last element in the DOM with the attribute.

Ideally React's implementation should match the spec, behavior-wise.

FunctionDJ commented 2 years ago

I've also been having issues with the polyfill in situations where the native autofocus="true" works as expected. However in my case (a modal with react-bulma), React's autoFocus polyfil doesn't work at all and the focus remains where it was before opening the modal.