get-focusables

Get focusable or tabbable elements within a DOM node

Versions

The package includes versions for ES6+ and ES5, both as an ESM module (browser-compatible) and a CJS module (npm-compatible).

Here's the included file variants:

| | CJS | ESM | importing |
| --- | -------- | --------- | -------------------------------------------------------- |
| ES6 | index.js | index.mjs | const getFocusableElements = require('get-focusables') |
| ES5 | es5.js | es5.mjs | import getFocusableElements from 'get-focusables' |

Each version gives you the getFocusableElements function.

get-focusables is written in ES6 syntax and packaged node-style.

It is converted to ES5/ESM for wider distribution.

The default is therefore the ES6 CJS variant index.js.

> NOTE

> In order to get a non-default version, you will need to tell your bundler to use index.mjs/es5.js/es5.mjs instead of index.js.

> For webpack, that's { resolve: { alias: { 'get-focusables': 'get-focusables/es5.mjs } } }'

API

#### Table of Contents

- getFocusableElements
- Parameters
- getFocusableElements.asArray
- Parameters
- NodeListDummy
- Properties

$3

Retrieves all focusable descendents of the given DOM element.

#### Parameters

- context Element The DOM Element in which to look for focusable elements (optional, default document)
- tabbable boolean Restrict to tabbable elements (optional, default true)

Returns (NodeList \| NodeListDummy)

$3

Same as getFocusableElements but returns an Array

#### Parameters

- context Element The DOM Element in which to look for focusable elements (optional, default document)
- tabbable boolean Restrict to tabbable elements (optional, default true)

Returns Array

$3

The NodeListDummy is an object with a length property of 0.
This ensures that the result of getFocusableElements can always be used and checked for length.
That makes checks for a truthy/falsy return value unnecessary.

Type: Object

#### Properties

- length number always 0