@mrhenry/stylelint-mrhenry-attribute-selector-no-unknown

Disallow unknown attribute selectors.

/* valid, the `name` attribute is allowed on button elements. */
button[name] {}

/* valid, the `name` attribute is not a global attribute, but used without a type selector. */
[name] {}

/* invalid, the `href` attribute is not allowed on button elements. */
button[href] {}

/* valid, the `data-foo` attribute has a `data-*` prefix. */
[data-foo] {}

/* invalid, `foo` attribute doesn't exist. */
[foo] {}

Warns when attribute selectors are used that are not allowed on the given element.

While it is valid and allowed to use any attribute name on any element, it is not recommended to do so.

It is preferable to use the data-* attribute for custom attributes.

Usage

npm install --save-dev @mrhenry/stylelint-mrhenry-attribute-selector-no-unknown

// stylelint.config.js
module.exports = {
	plugins: [
		"@mrhenry/stylelint-mrhenry-attribute-selector-no-unknown",
	],
	rules: {
		"@mrhenry/stylelint-mrhenry-attribute-selector-no-unknown": true,
	},
}