Rule Proposal: no-invalid-attribute-name #1373
Description
Please describe what the rule should do:
no-invalid-attribute-name should disallow invalid attribute names for elements in the <template> tag.
What category should the rule belong to?
[ ] Enforces code style (layout)
[X] Warns about a potential error (problem)
[ ] Suggests an alternate way of doing something (suggestion)
[ ] Other (please specify:)
Provide 2-3 code examples that this rule should warn about:
<template>
<div>
<p v-if="condition" 0abc>
{{ content }}
</p>
</div>
</template>Here the linter should warn about the attribute 0abc, which is invalid and will cause a runtime error when vue attempts to insert it onto the dom element
<template>
<div>
<p v-if="condition" -->
{{ content }}
</p>
</div>
</template>Here the linter should warn about the attribute --, which is invalid and will cause a runtime error when vue attempts to insert it onto the dom element
Additional context
My team discovered this issue when a rogue 0 snuck its way through PR-review and onto an element behind a somewhat rare v-if condition. A linting rule like this would have immediately caught the problem.