Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Tabs accessibility: missing aria roles & attributes #1118

Closed
ygatesoupe opened this issue Dec 6, 2016 · 1 comment
Closed

Tabs accessibility: missing aria roles & attributes #1118

ygatesoupe opened this issue Dec 6, 2016 · 1 comment

Comments

@ygatesoupe
Copy link
Contributor

ygatesoupe commented Dec 6, 2016

Tab heading <a class="nav-link"> is missing role="tab", aria-expanded and aria-controls

Tab content misses the aria-expanded attribute but yet has role="tabpanel" and aria-labelledby (which is great).

<ngb-tabset>
    <ul role="tablist" class="nav nav-tabs">
      <li class="nav-item">
        <a class="nav-link active" href="" id="ngb-tab-0">
          Simple
        </a>
      </li>
    </ul>
    <div class="tab-content">
        <div class="tab-pane active" role="tabpanel" aria-labelledby="ngb-tab-0">
            <p>Raw denim you probably haven't heard of them jean shorts Austin. Nesciunt tofu stumptown aliqua, retro synth
      master cleanse. Mustache cliche tempor, williamsburg carles vegan helvetica. Reprehenderit butcher retro keffiyeh
      dreamcatcher synth. Cosby sweater eu banh mi, qui irure terry richardson ex squid. Aliquip placeat salvia cillum
      iphone. Seitan aliquip quis cardigan american apparel, butcher voluptate nisi qui.</p>
        </div>
    </div>
  </ngb-tabset>

Bootstrap implementation

@pkozlowski-opensource
Copy link
Member

Thnx for brining this up. Would you mind sending us a PR with updates to the tabset component? Thnx!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants