ember-cli / ember-cli/eslint-plugin-ember
Checking for misspelled/non-existing attributes in component
- Dominant language
- JavaScript
- Stars
- 263
- Forks
- 214
- Avg merge
- 30m
- Merged PRs (30d)
- 5
Description
Hi, I have a scenario in my mind that happens to me time to time, but I'm not sure if it's possible to make a liner for this. Before writing any code, I would like to discuss it with you.
Let's say there is an component `user-input` with property `value` and `maxLength`.
```js
//user-input.js
export default Component.extend({
vlaue: null,
maxLength: null,
})
// template.hbs
//... whatever, doesn't matter
```
I can use this component easily like this
```hbs
{{user-input value="Some name" maxLength=10}}
```
so far so good, but what if I misspell property `maxLength`?
```hbs
{{user-input value="Some name" maxLenthg=10}}
```
or what if I refactor property `maxLength` to be just `max` but I didn't catch all usages in template?
Sure, I could write a test for this, but writing a test just that value is passed along is pretty annoying. That's why I would like to write a simple ESLint rule that would check if all attributes that are set on certain component are also declared as attributes within the component.
The examples from above would fire an issue
```
// Misspelled property name
- component {{user-input}} doesn't have maxLenthg attribute
// After renaming maxLength to max
- component {{user-input}} doesn't have maxLength attribute
```
Is it possible to check this with ESLint?
Thank you,
Ondrej
Contributor guide
No contributing guide indexed for this repository
Assessment
This issue has not been assessed yet.