ember/no-invalid-dependent-keys

💼 This rule is enabled in the ✅ recommended config.

🔧 This rule is automatically fixable by the --fix CLI option.

Dependent keys used for computed properties have to be valid.

Rule Details

This rule aims to avoid invalid dependent keys in computed properties.

Currently implemented checks:

Unbalanced open and closed braces. These can be hard to track for complex computed properties and are usually unchecked since the expressions are passed as Strings.
Unnecessary braces
Invalid position of @each or []
Leading or trailing periods

Examples of incorrect code for this rule:

export default Component.extend({
  // Unbalanced braces:
  fullName: computed('user.{firstName,lastName', {
    // Code
  })
});

export default Component.extend({
  // Unnecessary braces:
  userId: computed('user.{id}', {
    // Code
  })
});

export default Component.extend({
  // Terminal `@each`:
  items: computed('arr.@each', {
    // Code
  })
});

export default Component.extend({
  // `[]` in the middle:
  items: computed('arr.[].id', {
    // Code
  })
});

export default Component.extend({
  // Leading period:
  userId: computed('.user.id', {
    // Code
  })
});

export default Component.extend({
  // Space:
  userId: computed('user .id', {
    // Code
  })
});

Examples of correct code for this rule:

export default Component.extend({
  fullName: computed('user.{firstName,lastName}', {
    // Code
  })
});

export default Component.extend({
  userId: computed('user.id', {
    // Code
  })
});

export default Component.extend({
  items: computed('arr.[]', {
    // Code
  })
});

export default Component.extend({
  items: computed('arr.@each.id', {
    // Code
  })
});