Docs accessibility issues - Orange-OpenSource/Orange-Boosted-Bootstrap GitHub Wiki

On main, pa11y-ci is configured to ignore a few things.

Here's a comprehensive list of ignored rules and elements, to discuss:

  1. Orange brand: The color-contrast rule is ignored, since designers should already check the color accessibility of every component before releasing it. Furthermore this rule seems to raise many false positive and according to our a11y expert, it seems easier to check manually if there is no regression manually rather than automatically check.
  2. iframe is flagged since it raises an error by default.
Show more
Errors in http://localhost:9001/docs/5.2/helpers/ratio/:
 • Frames should be tested with axe-core (https://dequeuniversity.com/rules/axe/4.5/frame-tested?application=axeAPI)
   (html > body > div:nth-child(6) > main > div:nth-child(3) > div:nth-child(7) > div:nth-child(1) > div > iframe)
   <iframe src="https://www.youtube.com/embed/zpOULjyy-n8?rel=0" title="YouTube video" allowfullscreen=""></iframe>
  1. #text-decoration + p + div a.text-decoration-none is flagged since it raises an error because we present this class on a link.
Show more
Errors in http://localhost:9001/docs/5.2/utilities/text/:
 • Links must be distinguishable without relying on color (https://dequeuniversity.com/rules/axe/4.5/link-in-text-block?application=axeAPI)
   (html > body > div:nth-child(6) > main > div:nth-child(3) > div:nth-child(40) > div:nth-child(1) > a)
   <a href="#" class="text-decoration-none">This link has its text decorati...</a>
  1. .accordion-collapse is flagged since it raises an error since we use an aria-labelledby on a <div> without role.
Show more

This should be removed depending on https://github.com/twbs/bootstrap/issues/37591 results.

  1. #offcanvas, #offcanvasDark, #offcanvasResponsive, #bdSidebar are flagged since we use an aria-labelledby on a <div> without role.
Show more

These should be removed once https://github.com/twbs/bootstrap/discussions/37571 is resolved.

Errors in http://localhost:9001/docs/5.2/utilities/text/:
 • Links must be distinguishable without relying on color (https://dequeuniversity.com/rules/axe/4.5/link-in-text-block?application=axeAPI)
   (html > body > div:nth-child(6) > main > div:nth-child(3) > div:nth-child(40) > div:nth-child(1) > a)
   <a href="#" class="text-decoration-none">This link has its text decorati...</a>
  1. TODO for .overflow-y-scroll, .overflow-y-auto, .overflow-x-scroll, .overflow-x-auto, .table-responsive

  2. fieldset.star-rating[disabled] is flagged because of a pa11y error (see a11y explanation)

Show more
Errors in http://localhost:9001/docs/5.3/forms/checks-radios/:

 • ARIA hidden element must not contain focusable elements
   (https://dequeuniversity.com/rules/axe/4.2/aria-hidden-focus?application=axeAPI)

   (html > body > div:nth-child(6) > main > div:nth-child(3) >
   div:nth-child(65) > div:nth-child(1) > form > fieldset)

   <fieldset class="star-rating" disabled="" aria-hidden="true"> <legend
   class="visually-hi...</fieldset>

Enhancement idea

To maybe fine-tune our criteria, pa11y's wiki has a comprehensive list of ignorable rules.

⚠️ **GitHub.com Fallback** ⚠️