Namibian Pyjama Merchant

    eslint-plugin-amo

    1.21.0 • Public • Published

    eslint-plugin-amo

    CircleCI npm version

    ESLint plugin for AMO.

    Installation

    You'll first need to install ESLint:

    $ npm i eslint --save-dev
    

    Next, install eslint-plugin-amo:

    $ npm install eslint-plugin-amo --save-dev
    

    Note: If you installed ESLint globally (using the -g flag) then you must also install eslint-plugin-amo globally.

    Usage

    Add amo to the plugins section of your .eslintrc configuration file. You can omit the eslint-plugin- prefix:

    {
      "plugins": ["amo"]
    }

    Then configure the rules you want to use under the rules section.

    {
      "rules": {
        "amo/rule-name": 2
      }
    }

    Alternatively, you can use the recommended preset to get reasonable defaults:

    {
      "extends": ["plugin:amo/recommended"]
    }

    TypeScript

    You can use the typescript preset to get reasonable defaults (it includes the recommended rules) as well as TypeScript specific rules:

    {
      "extends": ["plugin:amo/typescript"]
    }

    Rules

    dangerously-set-inner-html

    Ensure dangerouslySetInnerHTML is used on elements that permit flow content:

    // BAD
    <p dangerouslySetInnerHTML={sanitizeUserHTML(content)} />
    
    // GOOD
    <div dangerouslySetInnerHTML={sanitizeUserHTML(content)} />

    describe-with-filename

    Ensure the top-level describe block has __filename as description:

    // BAD
    describe('foo', () => {});
    
    // GOOD
    describe(__filename, () => {});

    🔧 Use the ESLint --fix option on the command line to automatically fixes problems reported by this rule.

    💡 We enforce this rule because of the following issue: https://github.com/mozilla/addons-frontend/issues/2928.

    i18n-no-tagged-templates

    Ensure no template literal tags are passed to i18n methods:

    // BAD
    i18n.gettext(tag`translated string`);
    
    // GOOD
    i18n.gettext('hello');

    🔧 Use the ESLint --fix option on the command line to automatically fixes problems reported by this rule.

    💡 We enforce this rule because of the following issue: https://github.com/mozilla/addons-frontend/issues/2108.

    no-sinon-assert-called-if-called-with

    Ensure sinon.assert.called() is absent when sinon.assert.calledWith() is used:

    // BAD
    it('description', () => {
      sinon.assert.called(stub);
      sinon.assert.calledWith(stub, params);
    });
    
    // GOOD
    it('description', () => {
      sinon.assert.calledWith(stub, params);
    });

    💡 We enforce this rule because of the following issue: https://github.com/mozilla/addons-frontend/issues/2437.

    one-top-level-describe-per-test

    Ensure there is a single top-level describe block per test file:

    // BAD
    describe('foo', () => {});
    describe('bar', () => {});
    
    // GOOD
    describe(__filename, () => {
      describe('foo', () => {});
      describe('bar', () => {});
    });

    only-log-strings

    Ensure we do not log full objects:

    // BAD
    log.info('response:', response);
    
    // GOOD
    log.info('this is a log message');
    log.debug(oneLine`A very long string message`);
    _log.warn(`request ID: ${requestId}`);

    📐 This rule can be configured with the following options:

    Name Type Description
    methods array A list of logger methods, e.g., info or debug.
    objects array A list of logger objects, e.g., log or console.

    💡 We enforce this rule because of the following issue: https://github.com/mozilla/addons-frontend/issues/6512.

    only-tsx-files

    Enforce .tsx file extensions (definition files are ignored by this rule):

    • ⛔️ src/api/index.ts
    • src/api/index.tsx

    💡 We enforce this rule because of the following issue: https://github.com/mozilla/addons-code-manager/issues/75.

    redux-app-state

    Ensure the AppState Flow type is used on state arguments:

    // BAD
    const mapStateToProps = (state: Object) => {};
    
    // GOOD
    const mapStateToProps = (state: AppState) => {};

    💡 We enforce this rule because of the following issue: https://github.com/mozilla/addons-frontend/issues/4058.

    sort-destructured-props

    Ensure destructured props are sorted:

    // BAD
    const { a, _c, b, Component, ...otherProps } = this.props;
    
    // GOOD
    const { Component, _c, a, b, ...otherProps } = this.props;

    🔧 Use the ESLint --fix option on the command line to automatically fixes problems reported by this rule.

    ⚠️ This rule is not part of the recommended preset.

    with-router-hoc-first

    Ensures the withRouter HOC is the first in compose():

    // BAD
    compose(
      connect(mapStateToProps),
      withRouter
    )(MyComponent);
    
    // GOOD
    compose(
      withRouter,
      connect(mapStateToProps)
    )(MyComponent);

    Contributing

    Install the project dependencies:

    npm install
    

    Run the test suite:

    npm test
    

    New rules can be added with the npm run new-rule command:

    npm run new-rule
    

    This command will ask a few questions and generate the source and test files.

    The "Rules" documentation section is automatically generated with:

    npm run build-doc
    

    For further information, please see the CONTRIBUTING.md file.

    License

    eslint-plugin-amo is released under the Mozilla Public License Version 2.0. See the bundled LICENSE file for details.

    Install

    npm i eslint-plugin-amo

    DownloadsWeekly Downloads

    198

    Version

    1.21.0

    License

    MPL-2.0

    Unpacked Size

    67 kB

    Total Files

    33

    Last publish

    Collaborators

    • addons-robot