Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Feature request: prevent autofocus on focusable element and skip to next focusable element with a data- attribute

See original GitHub issue

In my application I have tooltips like this:

Which according to WCAG should be focusable - however having a tooltip focused and shown whenever a dialog is opened is a pretty strange behaviour.

It would be nice if I could “blacklist” the element, possibly by adding a data-attribute (maybe something like data-no-autofocus, so that focus-trap would focus the next element instead when a dialog is opened.

Issue Analytics

State:
Created 2 years ago
Comments:5 (3 by maintainers)

Top GitHub Comments

1reaction

theKasheycommented, May 1, 2022

Now(react-focus-lock@2.9.0) one can control autofocus behavior by setting data-no-autofocus on an element or container - https://github.com/theKashey/focus-lock#declarative-control That should let you control autofocus behavior as desired.

0reactions

theKasheycommented, May 11, 2022

:yay:. thank you for pointing on the idea as well as the implementation. From some point of view - that’s all your doing.

Top Results From Across the Web

Focus Next Element In Tab Index - javascript - Stack Overflow

An element that is not focusable has a tabindex of "-1". Then you just need to know the rules for tab stops: tabIndex="1"...

Focusing: focus/blur - The Modern JavaScript Tutorial

Any element becomes focusable if it has tabindex . The value of the attribute is the order number of the element when Tab...

Web Accessibility: Aria, Focus, Focus Management - Telerik

To achieve focus management, we use a couple of awesome attributes. Like tabindex and ARIA, so let's talk about these elements.

autofocus - HTML: HyperText Markup Language | MDN

The autofocus global attribute is a Boolean attribute indicating that an element should be focused on page load, or when the <dialog> that...

Understanding Flutter's keyboard focus system

The canRequestFocus attribute, unsurprisingly, controls whether or not the focus node that this Focus widget manages can be used to request focus. If...