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.

Rules options CSS selector ignored

See original GitHub issue

Expectation: Only run rule against elements matching value of selector key. In sample config code below ‘scrollable-region-focusable’ is where the issue occurs.

Actual: selector key of rule options is ignored.

Motivation: Broken functionality. Looking to limit which elements are tested on a per rule basis.


axe-core version: 3.3.1
axe-webdriver, extension or other integration version: 2.3.0

Browser and Assistive Technology versions

For Tooling issues:
- Node version: 10.16.2
- Platform:  Mac
rules: {
        bypass: { enabled: false },
        'landmark-one-main': { enabled: false },
        region: { enabled: false },
        'page-has-heading-one': { enabled: false },
        'html-has-lang': { enabled: false },
        'scrollable-region-focusable': {
          'selector': ":not([class*='dropdown_length-'])"
        }
      }

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Reactions:2
  • Comments:9 (4 by maintainers)

github_iconTop GitHub Comments

1reaction
strakercommented, Nov 25, 2020

It looks like you are trying to pass this config in through axe.run, is that correct? The axe.run config only supports enabling/disabling rules. If you wish to configure more about a particular rule, you will need to go through axe.configure and override the rules selector there:

axe.configure({
  rules: [
      {
         id: 'scrollable-region-focusable',
         selector: '*:not([class*="dropdown_length-"])'
      }
  ]
});

If doing this for automated testing, you can configure the rule before the test and then reset the config afterwards using axe.reset().

0reactions
WilcoFierscommented, Jan 7, 2021

I think we have a sufficient solution. Going to close the issue.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Why are my CSS properties being overridden/ignored?
Basically id have the priority on class which the priority on tags(p,li,ul, h1...). To override the rule, just make sure you have the...
Read more >
Specificity - CSS: Cascading Style Sheets - MDN Web Docs
The specificity algorithm calculates the weight of a CSS selector to determine which rule from competing CSS declarations gets applied to an ...
Read more >
not - CSS-Tricks
The :not() property in CSS is a negation pseudo class and accepts a simple selector or a selector list as an argument.
Read more >
How to Troubleshoot CSS Not Working - WPForms
Two brackets: There must be an opening curly bracket ({) right after the CSS selector and at the end of the property and...
Read more >
Ignoring code - Stylelint
You can temporarily turn off rules using special comments in your CSS. ... stylelint-disable selector-max-id, declaration-no-important */
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