eslint-plugin-ember

Eslint plugin for Ember.js apps

Usage no npm install needed!

<script type="module">
  import eslintPluginEmber from 'https://cdn.skypack.dev/eslint-plugin-ember';
</script>

README

eslint-plugin-ember

NPM version NPM downloads CI

An ESlint plugin that provides set of rules for Ember Applications based on commonly known good practices.

❗️Requirements

πŸš€ Usage

1. Install plugin

yarn add --dev eslint-plugin-ember

Or

npm install --save-dev eslint-plugin-ember

2. Modify your .eslintrc.js

// .eslintrc.js
module.exports = {
  plugins: ['ember'],
  extends: [
    'eslint:recommended',
    'plugin:ember/recommended' // or other configuration
  ],
  rules: {
    // override rule settings here
    'ember/no-jquery': 'error'
  }
};

🧰 Configurations

Name Description
base contains no rules settings, but the basic eslint configuration suitable for any ember project. You can use it to configure rules as you wish.
βœ… recommended extends the base configuration by enabling the recommended rules.

🍟 Rules

Rules are grouped by category to help you understand their purpose. Each rule has emojis denoting:

  • What configuration it belongs to
  • πŸ”§ if some problems reported by the rule are automatically fixable by the --fix command line option
  • πŸ’‘ if some problems reported by the rule are manually fixable by editor suggestions

Components

Name Description βœ… πŸ”§ πŸ’‘
no-attrs-in-components disallow usage of this.attrs in components βœ…
no-attrs-snapshot disallow use of attrs snapshot in the didReceiveAttrs and didUpdateAttrs component hooks βœ…
no-classic-components enforce using Glimmer components βœ…
no-component-lifecycle-hooks disallow usage of "classic" ember component lifecycle hooks. Render modifiers or custom functional modifiers should be used instead. βœ…
no-on-calls-in-components disallow usage of on to call lifecycle hooks in components βœ…
require-tagless-components disallow using the wrapper element of a component βœ…

Computed Properties

Name Description βœ… πŸ”§ πŸ’‘
computed-property-getters enforce the consistent use of getters in computed properties
no-arrow-function-computed-properties disallow arrow functions in computed properties βœ…
no-assignment-of-untracked-properties-used-in-tracking-contexts disallow assignment of untracked properties that are used as computed property dependencies βœ… πŸ”§
no-computed-properties-in-native-classes disallow using computed properties in native classes βœ…
no-deeply-nested-dependent-keys-with-each disallow usage of deeply-nested computed property dependent keys with @each βœ…
no-duplicate-dependent-keys disallow repeating computed property dependent keys βœ… πŸ”§
no-incorrect-computed-macros disallow incorrect usage of computed property macros βœ… πŸ”§
no-invalid-dependent-keys disallow invalid dependent keys in computed properties βœ… πŸ”§
no-side-effects disallow unexpected side effects in computed properties βœ…
no-volatile-computed-properties disallow volatile computed properties βœ…
require-computed-macros require using computed property macros when possible βœ… πŸ”§
require-computed-property-dependencies require dependencies to be declared statically in computed properties βœ… πŸ”§
require-return-from-computed disallow missing return statements in computed properties βœ…
use-brace-expansion enforce usage of brace expansion in computed property dependent keys βœ…

Controllers

Name Description βœ… πŸ”§ πŸ’‘
alias-model-in-controller enforce aliasing model in controllers
avoid-using-needs-in-controllers disallow using needs in controllers βœ…
no-controllers disallow non-essential controllers

Deprecations

Name Description βœ… πŸ”§ πŸ’‘
closure-actions enforce usage of closure actions βœ…
new-module-imports enforce using "New Module Imports" from Ember RFC #176 βœ…
no-function-prototype-extensions disallow usage of Ember's function prototype extensions βœ…
no-mixins disallow the usage of mixins βœ…
no-new-mixins disallow the creation of new mixins βœ…
no-observers disallow usage of observers βœ…
no-old-shims disallow usage of old shims for modules βœ… πŸ”§
no-string-prototype-extensions disallow usage of String prototype extensions βœ…

Ember Data

Name Description βœ… πŸ”§ πŸ’‘
no-empty-attrs disallow usage of empty attributes in Ember Data models
use-ember-data-rfc-395-imports enforce usage of @ember-data/ package imports instead ember-data βœ… πŸ”§

Ember Object

Name Description βœ… πŸ”§ πŸ’‘
avoid-leaking-state-in-ember-objects disallow state leakage βœ…
no-get-with-default disallow usage of the Ember's getWithDefault function βœ… πŸ”§
no-get require using ES5 getters instead of Ember's get / getProperties functions βœ… πŸ”§
no-proxies disallow using array or object proxies
no-try-invoke disallow usage of the Ember's tryInvoke util βœ…
require-super-in-lifecycle-hooks require super to be called in lifecycle hooks βœ… πŸ”§
use-ember-get-and-set enforce usage of Ember.get and Ember.set πŸ”§

Ember Octane

Name Description βœ… πŸ”§ πŸ’‘
classic-decorator-hooks enforce using correct hooks for both classic and non-classic classes βœ…
classic-decorator-no-classic-methods disallow usage of classic APIs such as get/set in classes that aren't explicitly decorated with @classic βœ…
no-actions-hash disallow the actions hash in components, controllers, and routes βœ…
no-classic-classes disallow "classic" classes in favor of native JS classes βœ…
no-ember-super-in-es-classes disallow use of this._super in ES class methods βœ… πŸ”§
no-empty-glimmer-component-classes disallow empty backing classes for Glimmer components βœ…

jQuery

Name Description βœ… πŸ”§ πŸ’‘
jquery-ember-run disallow usage of jQuery without an Ember run loop βœ…
no-global-jquery disallow usage of global jQuery object βœ…
no-jquery disallow any usage of jQuery βœ…

Miscellaneous

Name Description βœ… πŸ”§ πŸ’‘
named-functions-in-promises enforce usage of named functions in promises
no-html-safe disallow the use of htmlSafe
no-incorrect-calls-with-inline-anonymous-functions disallow inline anonymous functions as arguments to debounce, once, and scheduleOnce βœ…
no-invalid-debug-function-arguments disallow usages of Ember's assert() / warn() / deprecate() functions that have the arguments passed in the wrong order. βœ…
no-restricted-property-modifications disallow modifying the specified properties πŸ”§
require-fetch-import enforce explicit import for fetch()

Routes

Name Description βœ… πŸ”§ πŸ’‘
no-capital-letters-in-routes disallow routes with uppercased letters in router.js βœ…
no-controller-access-in-routes disallow routes from accessing the controller outside of setupController/resetController βœ…
no-private-routing-service disallow injecting the private routing service βœ…
no-shadow-route-definition enforce no route path definition shadowing βœ…
no-unnecessary-index-route disallow unnecessary index route definition
no-unnecessary-route-path-option disallow unnecessary usage of the route path option βœ… πŸ”§
route-path-style enforce usage of kebab-case (instead of snake_case or camelCase) in route paths πŸ’‘
routes-segments-snake-case enforce usage of snake_cased dynamic segments in routes βœ…

Services

Name Description βœ… πŸ”§ πŸ’‘
no-implicit-service-injection-argument disallow omitting the injected service name argument πŸ”§
no-restricted-service-injections disallow injecting certain services under certain paths
no-unnecessary-service-injection-argument disallow unnecessary argument when injecting services πŸ”§
no-unused-services disallow unused service injections (see rule doc for limitations) πŸ’‘

Stylistic Issues

Name Description βœ… πŸ”§ πŸ’‘
order-in-components enforce proper order of properties in components πŸ”§
order-in-controllers enforce proper order of properties in controllers πŸ”§
order-in-models enforce proper order of properties in models πŸ”§
order-in-routes enforce proper order of properties in routes πŸ”§

Testing

Name Description βœ… πŸ”§ πŸ’‘
no-current-route-name disallow usage of the currentRouteName() test helper
no-ember-testing-in-module-scope disallow use of Ember.testing in module scope βœ…
no-invalid-test-waiters disallow incorrect usage of test waiter APIs βœ…
no-legacy-test-waiters disallow the use of the legacy test waiter APIs βœ…
no-noop-setup-on-error-in-before disallows using no-op setupOnerror in before or beforeEach βœ… πŸ”§
no-pause-test disallow usage of the pauseTest helper in tests βœ…
no-replace-test-comments disallow 'Replace this with your real tests' comments in test files
no-restricted-resolver-tests disallow the use of patterns that use the restricted resolver in tests βœ…
no-settled-after-test-helper disallow usage of await settled() right after test helper that calls it internally βœ… πŸ”§
no-test-and-then disallow usage of the andThen test wait helper βœ…
no-test-import-export disallow importing of "-test.js" in a test file and exporting from a test file βœ…
no-test-module-for disallow usage of moduleFor, moduleForComponent, etc βœ…
no-test-support-import disallow importing of "test-support" files in production code. βœ…
no-test-this-render disallow usage of the this.render in tests, recommending to use @ember/test-helpers' render instead. βœ…
prefer-ember-test-helpers enforce usage of @ember/test-helpers methods over native window methods βœ…
require-valid-css-selector-in-test-helpers disallow using invalid CSS selectors in test helpers βœ… πŸ”§

For the simplified list of rules, go here.

🍻 Contribution Guide

If you have any suggestions, ideas, or problems, feel free to create an issue, but first please make sure your question does not repeat previous ones.

Creating a New Rule

  • Create an issue with a description of the proposed rule
  • Create files for the new rule:
    • lib/rules/new-rule.js (implementation, see no-proxies for an example)
    • docs/rules/new-rule.md (documentation, start from the template -- raw, rendered)
    • tests/lib/rules/new-rule.js (tests, see no-proxies for an example)
  • Run yarn update to automatically update the README and other files (and re-run this if you change the rule name or description)
  • Make sure your changes will pass CI by running:
    • yarn test
    • yarn lint (yarn lint:js --fix can fix many errors)
  • Create a PR and link the created issue in the description

Note that new rules should not immediately be added to the recommended configuration, as we only consider such breaking changes during major version updates.

πŸ”“ License

See the LICENSE file for license rights and limitations (MIT).