feat: add new rule no-duplicate-keyframe-selectors

[snitin315]

Prerequisites checklist

• I have read the contributing guidelines.

What is the purpose of this pull request?

Add new rule no-duplicate-keyframe-selectors.

What changes did you make? (Give an overview)

Examples of incorrect code for this rule:

/* eslint css/no-duplicate-keyframe-selectors: "error" */

@keyframes test {
	0% {
		opacity: 0;
	}

	0% {
		opacity: 1;
	}
}

@keyframes test {
	from {
		opacity: 0;
	}

	from {
		opacity: 1;
	}
}

@keyframes test {
	from {
		opacity: 0;
	}

	from {
		opacity: 1;
	}
}

Examples of correct code for this rule:

/* eslint css/no-duplicate-keyframe-selectors: "error" */

@keyframes test {
	0% {
		opacity: 0;
	}

	100% {
		opacity: 1;
	}
}

@keyframes test {
	from {
		opacity: 0;
	}

	to {
		opacity: 1;
	}
}

Related Issues

Fix #141

Is there anything you'd like reviewers to focus on?

[snitin315]

Added this test.css for local testing purposes, similar to the eslint repo

[nzakas]

@snitin315 can you check the merge conflicts?

[snitin315]

#143 (comment)

[snitin315]

@nzakas resolved.

[nzakas]

can we use extends here instead?

[nzakas]

This method is traversing the at-rule itself instead of letting the rule do so.

It would be more efficient to do "Atrule[name=keyframes]", "Atrule[name=keyframes]:exit" and then look for the selectors in between.

See https://github.com/eslint/css/blob/main/src/rules/use-layers.js as an example.