IE 11 doesn't focus on span with tabindex

Question

Setup:

We have an angular 5.x webapp which features a tree-component. It's basically a <ul>-List with a roving tabindex for keyboard navigation.
The HTML is a little more complex due to the layout of the tree-component and it features some recursiveness.

Problem:

We noticed a weird behavior in Internet Explorer when testing the TAB-focus. In the code-example below, you can see the <span> in line 8 has a tabindex="0" and should therefore be focusable via TAB-Key. The other nodes should not be focusable at this point. Now only in IE 11 the element is absolutely not focusable via keynavigation. All other browsers that were tested (Chrome, Edge, Firefox) handle the task just fine.

Question: Why is IE 11 not focussing the span with tabindex="0" ?

Example HTML for an angular component that reproduces the Issue:

<div id="hostDivForTree">
<ul class="subtree">
    <li class="item ng-star-inserted" >
        <a class="toggleLink ng-star-inserted">
            <i class="icon arrow"></i>
        </a>
        <a disabled="false" class="nodeName expanded" id="treeIndex_0" data-tag="none">
            <span tabindex="0" class="label">Marketing</span>
        </a>
        <div class="collapse ng-star-inserted" aria-expanded="true" aria-hidden="false" style="height: auto; overflow: visible; display: block;">
            <ul class="subtree">
                <li class="item ng-star-inserted">
                    <a disabled="false" class="nodeName leaf" id="treeIndex_0_0" data-tag="good">
                        <span tabindex="-1" class="label">Level 1</span>
                    </a>
                </li>
                <li class="item ng-star-inserted" >
                    <a disabled="false" class="nodeName leaf" id="treeIndex_0_1" data-tag="none">
                        <span tabindex="-1" class="label">Level 2</span>
                    </a>
                </li>
            </ul>
        </div>
    </li>
    <!-- ... -->
    <!-- Here go further li - items like the one before - its recursive -->     
    <!-- ... -->
</ul>

Answer 1

The reason is probably that your span elements reside inside <a> tags.

Check caniuse.com footnote 2:

<a> elements are never keyboard-focusable, even if they have tabindex="0".

https://caniuse.com/#search=tabindex

Also note that disabled="false" does not do what you might expect it to do. The mere presence of a disabled-attribute means that it is disabled, regardless of the value you assign to it (aside from false not being a valid value, only disabled is a valid value).