<p dir="auto">Again from the <a href="https://github.com/paypal/bootstrap-accessibility-plugin/#tab-panel">paypal/bootstrap-accessibility-plugin</a>, these changes should be added to the documentation and the JS plugin.</p>
<h3 dir="auto">Tab Panel</h3>
<ol dir="auto">
<li><del>Add ARIA roles like tablist, presentation, and tab for tabs UL, LI.</del></li>
<li>Add tabIndex, <del>aria-expanded</del>, aria-selected, <del>aria-controls</del> for tab.</li>
<li>Add ARIA roles of <del>tabpanel</del>, tabIndex, aria-hidden, and aria-labelledBy for tabPanel.</li>
<li>Add keydown event listener for the tab to work with keyboard.</li>
<li>Dynamically flip tabIndex, aria-selected, and <del>aria-expanded</del> for tab when it is activated and add aria-hidden to hide the previously visible tab.</li>
</ol>
<p dir="auto">Please see following demo image, when text is too short, popover's arrow should be correctly adjusted to point to the center of the label.</p>
<ul dir="auto">
<li>image<br>
<a href="http://cl.ly/image/0W38012y3K1H" rel="nofollow">http://cl.ly/image/0W38012y3K1H</a></li>
</ul>
<p dir="auto">I've created a simple fix for that, but it's doing from outside of the plugin, would be great if it's integrated into the plugin itself, please see it here:</p>
<ul dir="auto">
<li>sample code<br>
<a href="https://gist.github.com/coodoo/5667953">https://gist.github.com/coodoo/5667953</a></li>
</ul>