question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Failing AXE tests

See original GitHub issue

I used the tool axe to scan this autocomplete and got the following errors.

    Expected page to pass Axe accessibility tests.
    Violations found:
    Rule: "aria-input-field-name" (ARIA input fields have an accessible name)
    Help: https://dequeuniversity.com/rules/axe/3.3/aria-input-field-name?application=axe-puppeteer
    Affected Nodes:
      #amp-stories-font-family-picker-1__listbox
        Fix ANY of the following:
        - aria-label attribute does not exist or is empty
        - aria-labelledby attribute does not exist, references elements that do not exist or references elements that are empty
        - Element has no title attribute or the title attribute is empty
    
    Rule: "aria-required-children" (Certain ARIA roles must contain particular children)
    Help: https://dequeuniversity.com/rules/axe/3.3/aria-required-children?application=axe-puppeteer
    Affected Nodes:
      #amp-stories-font-family-picker-1__listbox
        Fix ANY of the following:
        - Required ARIA child role not present: option

Issue Analytics

  • State:open
  • Created 4 years ago
  • Comments:11 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
sussexrickcommented, Jun 28, 2021

@bentpr @vrojastpr Let’s use @JakeChampion’s package and create PRs there for any bugfix we do, rather than publish our own package to npm.

0reactions
sussexrickcommented, Jul 22, 2021

For anyone finding this, PR #500 fixes “aria-input-field-name” (ARIA input fields have an accessible name).

Read more comments on GitHub >

github_iconTop Results From Across the Web

Test accessibility with axe-core in Cypress - GitHub
When accessibility violations are detected, your test will fail and an entry titled "A11Y ERROR!" will be added to the command log for...
Read more >
Chapter 7.1 - Writing Accessibility Tests with Cypress Axe
How you can test a full page with Cypress-Axe. · Analyze the logs and error messages that we get so we can understand...
Read more >
How to Test Accessibility With Axe in Cypress - Cogworks
If this test fails, it means the list is structured in some other way. Both violations can cause problems for those who rely...
Read more >
Setting up Cypress with axe for accessibility - Tim Deschryver
Axe. Axe helps you to test the accessibility of your site. They have a range of tools in their arsenal: a browser extension,...
Read more >
Axe API Documentation - Deque Systems
Axe does not test hidden regions, such as inactive menus or modal windows. ... of a rule to return "Needs Review" rather than...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found