title: aria-* attributes are not valid or misspelled
body: <p>I was generally testing Accessibility of a website using Lighthouse in Chrome Audits.</p>
  
  <p>I stumbled upon this warning:</p>
  
  <blockquote>
    <p>aria-* attributes are not valid or misspelled.</p>
  </blockquote>
  
  <p>this is the failing element:</p>
  
  <pre><code>&lt;a class="issue-title muted-link" href="#" data-bi-name="issue-expander" aria-role="button" aria-expanded="false" aria-controls="issue-26732-body issue-26732-comments issue-26732-reactions issue-26732-reactions-menu" aria-label="Toggle issue"&gt;
  </code></pre>
  
  <p>This is the link in case anyone is interested.
  <a href="https://docs.microsoft.com/en-us/azure/load-balancer/load-balancer-custom-probe-overview#feedback" rel="nofollow noreferrer">Azure load balancer Feedback Section</a></p>
  
  <p>To me it seems like the aria-* names and values are valid.</p>
  
  <ul>
  <li>aria-role = "button" seems to be correct.</li>
  <li>aria-expanded = "false" seems to be correct.</li>
  <li>aria-label seems to be correct</li>
  <li>aria-controls = "..." seems to contain a list of ids, all these ids are present in the DOM ( though i am not sure, if it the accessibility check should fail if they are not present in the DOM and added dynamically )</li>
  </ul>
  
  <p>What can be the reason for this to fail ?</p>