t.find(...).filter(...).sort is not a function in findFocusable($element) (foundation.util.keyboard.js)
- Dominant language
- JavaScript
- Stars
- 29.8k
- Forks
- 5.4k
- Avg merge
- 25m
- Merged PRs (30d)
- 1
Description
## Context
findFocusable() implements a chain of jQuery methods. Sadly it does not care for the case, that the chain returns null, so that .sort can't be called on it.
This happens, if no item in $element.find() matches the given conditions.
> t.find(...).filter(...).sort is not a function
```
// Functions pulled out to be referenceable from internals
function findFocusable($element) {
if(!$element) {return false; }
return $element.find('a[href], area[href], input:not([disabled]), select:not([disabled]), textarea:not([disabled]), button:not([disabled]), iframe, object, embed, *[tabindex], *[contenteditable]').filter(function() {
if (!$(this).is(':visible') || $(this).attr('tabindex') < 0) { return false; } //only have visible elements and those that have a tabindex greater or equal 0
return true;
})
.sort( function( a, b ) {
if ($(a).attr('tabindex') === $(b).attr('tabindex')) {
return 0;
}
let aTabIndex = parseInt($(a).attr('tabindex'), 10),
bTabIndex = parseInt($(b).attr('tabindex'), 10);
// Undefined is treated the same as 0
if (typeof $(a).attr('tabindex') === 'undefined' && bTabIndex > 0) {
return 1;
}
if (typeof $(b).attr('tabindex') === 'undefined' && aTabIndex > 0) {
return -1;
}
if (aTabIndex === 0 && bTabIndex > 0) {
return 1;
}
if (bTabIndex === 0 && aTabIndex > 0) {
return -1;
}
if (aTabIndex < bTabIndex) {
return -1;
}
if (aTabIndex > bTabIndex) {
return 1;
}
});
}
```
(foundation.util.keyboard.js)
## What should happen?
`.sort()` should not be called on null
...
## What happens instead?
`.sort()` is called on null
...
## Possible Solution
Add an empty check before calling .sort() on the result of find().filter().
...
## Test Case and/or Steps to Reproduce (for bugs)
Test Case:
How to reproduce:
1.
2.
3.
## Context
...
## Your Environment
- Foundation version(s) used:
- Browser(s) name and version(s):
- Device, Operating System and version:
- Link to your project:
## Checklist
- [ ] I have read and follow the CONTRIBUTING.md document.
- [ ] There are no other issues similar to this one.
- [ ] The issue title and template are correctly filled.
Contributor guide
Research direction
Read foundation.util.keyboard.js and inspect findFocusable(), especially the find/filter chain when no elements match. Confirm the fix by exercising an element with no focusable descendants and verify it returns without calling sort or throwing.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript
- Domain
- frontend
- Issue type
- Bug
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Activity status
- Stale
- Clarity
- Clearly specified
- Newbie friendliness
- 55/100