Modal: Elements with tabindex="-1" get focused

[Sixtisam]

When opening a modal, the documentation says the first focusable element is focused (if there is no ngbAutofocus marker). But when I assign tabindex="-1" to the first focusable element, it is still focused.

Link to StackBlitz reproduction: https://stackblitz.com/edit/angular-aoqoet
The expection here is, that instead of the close button, the date field gets focused. But if you check with document.activeElement, the close button is still focused

Versions of Angular, ng-bootstrap and Bootstrap:

Angular: 6.1.9

ng-bootstrap: 3.3.0, but is not yet fixed in master branch

Bootstrap: 4.1.3

I inspected the code and found the place, where the bug occurs:
File: src/util/focus-trap.ts
Line: 6-9

Today it is
const FOCUSABLE_ELEMENTS_SELECTOR = [ 'a[href]', 'button:not([disabled])', 'input:not([disabled]):not([type="hidden"])', 'select:not([disabled])', 'textarea:not([disabled])', '[contenteditable]', '[tabindex]:not([tabindex="-1"])' ].join(', ');

should be like this (note the :not([tabindex="-1"])) after each selector

var FOCUSABLE_ELEMENTS_SELECTOR = [ 'a[href]:not([tabindex="-1"])', 'button:not([disabled]):not([tabindex="-1"])', 'input:not([disabled]):not([type="hidden"]):not([tabindex="-1"])', 'select:not([disabled]):not([tabindex="-1"])', 'textarea:not([disabled]):not([tabindex="-1"])', '[contenteditable]:not([tabindex="-1"])', '[tabindex]:not([tabindex="-1"])' ].join(', ');

[pkozlowski-opensource]

@benouat would you mind having a look at this one? I'm not sure if we can just add tabindex="-1" as suggested by @Sixtisam since it could be set dynamically (unless the tabindex property is reflected as an attribute, of course).

[benouat]

I will have a look asap. I am not in favour of hardcoding the tabindex="-1" everywhere. What I will do, or anyone willing to open a PR for that, is to perform a check right after executing the querySelectorAll to filter out the returned collection.