#no-selector-as-dom-name

#Configuration

import { defineConfig, unicornPlugin } from '@rslint/core';

export default defineConfig([
  unicornPlugin.configs.recommended,
  {
    rules: {
      'unicorn/no-selector-as-dom-name': 'error',
    },
  },
]);

#Rule details

DOM APIs such as getElementById(), getElementsByClassName(), and classList methods accept raw IDs and class names. This rule reports arguments that start with a CSS selector prefix.

The rule can remove a leading # from a simple ID passed to getElementById() or a leading . from a simple class name passed to a class-name API. It also fixes templates with one substitution immediately after the prefix. It reports complex selectors, mismatched prefixes, and escaped prefixes without an edit.

Examples of incorrect code for this rule

document.getElementById('#app');
document.getElementsByClassName('.active');
element.classList.add('.active');

Examples of correct code for this rule

document.getElementById('app');
document.getElementsByClassName('active');
element.classList.add('active');
document.querySelector('#app');

#Options

This rule has no options.

#References

• Unicorn rule documentation
• Upstream implementation