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

Add default gatherer replacement doc example #16108

Open
Westbrook opened this issue Jul 11, 2024 · 3 comments
Open

Add default gatherer replacement doc example #16108

Westbrook opened this issue Jul 11, 2024 · 3 comments
Assignees

Comments

@Westbrook
Copy link

Summary

As seen in dequelabs/axe-core#4259 there are a number of important accessibility APIs that axe-core does not currently, and may not for a while, cover, like roles applies via elementInternals. The means that it is easy on an element that is give a role in this manner to receive this output:

❌ `aria-prohibited-attr` failure for `minScore` assertion (Elements use prohibited ARIA attributes: https://dequeuniversity.com/rules/axe/4.9/aria-prohibited-attr )
Expected >= 0.9, but found 0

Other than moving aria-prohibited-attr at large to a "warn" is there more nuanced configuartion that can be applied to prevent this false negative? For instances, some integrations of axe-core allow for ignoredTags to be listed or ignoredRules. For my cases, I think I really need a ignoredRulesByTag sort of thing, which I'm not sure is actually possible at the axe-core level, but am seeing what's possible.

@connorjclark
Copy link
Collaborator

https://github.com/dequelabs/axe-core/blob/develop/lib/checks/aria/aria-prohibited-attr-evaluate.js

The check uses the standards object, which can be overriden via axe.configure({standards}) to provide your own role.

On the Lighthouse side, we don't have any way to pass options to gatherers (mentioned in #10247), so the only way to utilize your own axe configuration today is to create a custom Lighthouse config with your own Accessibility gatherer. I don't know if we have an example of what that would look like - @adamraine do we?

@Westbrook
Copy link
Author

Oooh, this is quite useful! An example as to where I might be able to inject that would be super help. Many thanks, in advance 🙇🏼

@adamraine
Copy link
Member

I don't know if we have an example of what that would look like - @adamraine do we?

We don't have an example of replacing a default gatherer with a custom one, although such an example would be useful for use cases like this.

Here is a quick example config file that replaces the gatherer with one that throws an error:

import {Gatherer} from 'lighthouse';

class CustomAccessibility extends Gatherer {
  meta = {
    supportedModes: ['navigation'],
  };

  getArtifact() {
    throw new Error('Test');
  }
}

/** @type {import('lighthouse').Config} */
const config = {
  extends: 'lighthouse:default',
  artifacts: [
    {id: 'Accessibility', gatherer: CustomAccessibility},
  ],
};

export default config;

@adamraine adamraine changed the title axe-core configuration options Add default gatherer replacement doc example Jul 12, 2024
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

5 participants