tomchentw/medium-editor-tc-mention

View on GitHub

Showing 88 of 88 total issues

Function hidePanel has a Cognitive Complexity of 24 (exceeds 5 allowed). Consider refactoring.
Open

  hidePanel(isArrowTowardsLeft) {
    this.mentionPanel.classList.remove(`medium-editor-mention-panel-active`);
    const extraActivePanelClassName = this.extraActivePanelClassName || this.extraActiveClassName;

    if (extraActivePanelClassName) {
Severity: Minor
Found in src/index.js - About 3 hrs to fix

Cognitive Complexity

Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

A method's cognitive complexity is based on a few simple rules:

  • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
  • Code is considered more complex for each "break in the linear flow of the code"
  • Code is considered more complex when "flow breaking structures are nested"

Further reading

File index.js has 267 lines of code (exceeds 250 allowed). Consider refactoring.
Open

import {
  default as MediumEditor,
} from "medium-editor";

function last(text) {
Severity: Minor
Found in src/index.js - About 2 hrs to fix

    Function hidePanel has 47 lines of code (exceeds 25 allowed). Consider refactoring.
    Open

      hidePanel(isArrowTowardsLeft) {
        this.mentionPanel.classList.remove(`medium-editor-mention-panel-active`);
        const extraActivePanelClassName = this.extraActivePanelClassName || this.extraActiveClassName;
    
        if (extraActivePanelClassName) {
    Severity: Minor
    Found in src/index.js - About 1 hr to fix

      Line 85 exceeds the maximum line length of 100.
      Open

                <p>Ours was the marsh country, down by the river, within, as the river wound, twenty miles of the sea. My first most vivid and broad impression of the identity of things seems to me to have been gained on a memorable raw afternoon towards evening. At such a time I found out for certain that this bleak place overgrown with nettles was the churchyard; and that Philip Pirrip, late of this parish, and also Georgiana wife of the above, were dead and buried; and that Alexander, Bartholomew, Abraham, Tobias, and Roger, infant children of the aforesaid, were also dead and buried; and that the dark flat wilderness beyond the churchyard, intersected with dikes and mounds and gates, with scattered cattle feeding on it, was the marshes; and that the low leaden line beyond was the river; and that the distant savage lair from which the wind was rushing was the sea; and that the small bundle of shivers growing afraid of it all and beginning to cry, was Pip.</p>
      Severity: Minor
      Found in examples/gh-pages/src/ReactRoot.js by eslint

      enforce a maximum line length (max-len)

      Very long lines of code in any language can be difficult to read. In order to aid in readability and maintainability many coders have developed a convention to limit lines of code to X number of characters (traditionally 80 characters).

      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" }; // very long

      Rule Details

      This rule enforces a maximum line length to increase code readability and maintainability. The length of a line is defined as the number of Unicode characters in the line.

      Options

      This rule has a number or object option:

      • "code" (default 80) enforces a maximum line length
      • "tabWidth" (default 4) specifies the character width for tab characters
      • "comments" enforces a maximum line length for comments; defaults to value of code
      • "ignorePattern" ignores lines matching a regular expression; can only match a single line and need to be double escaped when written in YAML or JSON
      • "ignoreComments": true ignores all trailing comments and comments on their own line
      • "ignoreTrailingComments": true ignores only trailing comments
      • "ignoreUrls": true ignores lines that contain a URL
      • "ignoreStrings": true ignores lines that contain a double-quoted or single-quoted string
      • "ignoreTemplateLiterals": true ignores lines that contain a template literal
      • "ignoreRegExpLiterals": true ignores lines that contain a RegExp literal

      code

      Examples of incorrect code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" };

      Examples of correct code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = {
        "bar": "This is a bar.",
        "baz": { "qux": "This is a qux" },
        "easier": "to read"
      };

      tabWidth

      Examples of incorrect code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" } };

      Examples of correct code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = {
      \t  \t  \t  \t  "bar": "This is a bar.",
      \t  \t  \t  \t  "baz": { "qux": "This is a qux" }
      \t  \t  };

      comments

      Examples of incorrect code for this rule with the { "comments": 65 } option:

      /*eslint max-len: ["error", { "comments": 65 }]*/
      
      /**
       * This is a comment that violates the maximum line length we have specified
      **/

      ignoreComments

      Examples of correct code for this rule with the { "ignoreComments": true } option:

      /*eslint max-len: ["error", { "ignoreComments": true }]*/
      
      /**
       * This is a really really really really really really really really really long comment
      **/

      ignoreTrailingComments

      Examples of correct code for this rule with the { "ignoreTrailingComments": true } option:

      /*eslint max-len: ["error", { "ignoreTrailingComments": true }]*/
      
      var foo = 'bar'; // This is a really really really really really really really long comment

      ignoreUrls

      Examples of correct code for this rule with the { "ignoreUrls": true } option:

      /*eslint max-len: ["error", { "ignoreUrls": true }]*/
      
      var url = 'https://www.example.com/really/really/really/really/really/really/really/long';

      ignoreStrings

      Examples of correct code for this rule with the { "ignoreStrings": true } option:

      /*eslint max-len: ["error", { "ignoreStrings": true }]*/
      
      var longString = 'this is a really really really really really long string!';

      ignoreTemplateLiterals

      Examples of correct code for this rule with the { "ignoreTemplateLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreTemplateLiterals": true }]*/
      
      var longTemplateLiteral = `this is a really really really really really long template literal!`;

      ignoreRegExpLiterals

      Examples of correct code for this rule with the { "ignoreRegExpLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreRegExpLiterals": true }]*/
      
      var longRegExpLiteral = /this is a really really really really really long regular expression!/;

      ignorePattern

      Examples of correct code for this rule with the { "ignorePattern": true } option:

      /*eslint max-len: ["error", { "ignorePattern": "^\\s*var\\s.+=\\s*require\\s*\\(/" }]*/
      
      var dep = require('really/really/really/really/really/really/really/really/long/module');

      Related Rules

      • [complexity](complexity.md)
      • [max-depth](max-depth.md)
      • [max-nested-callbacks](max-nested-callbacks.md)
      • [max-params](max-params.md)
      • [max-statements](max-statements.md) Source: http://eslint.org/docs/rules/

      Line 84 exceeds the maximum line length of 100.
      Open

                <p>I give Pirrip as my father’s family name, on the authority of his tombstone and my sister,—Mrs. Joe Gargery, who married the blacksmith. As I never saw my father or my mother, and never saw any likeness of either of them (for their days were long before the days of photographs), my first fancies regarding what they were like were unreasonably derived from their tombstones. The shape of the letters on my father’s, gave me an odd idea that he was a square, stout, dark man, with curly black hair. From the character and turn of the inscription, “Also Georgiana Wife of the Above,” I drew a childish conclusion that my mother was freckled and sickly. To five little stone lozenges, each about a foot and a half long, which were arranged in a neat row beside their grave, and were sacred to the memory of five little brothers of mine,—who gave up trying to get a living, exceedingly early in that universal struggle,—I am indebted for a belief I religiously entertained that they had all been born on their backs with their hands in their trousers-pockets, and had never taken them out in this state of existence.</p>
      Severity: Minor
      Found in examples/gh-pages/src/ReactRoot.js by eslint

      enforce a maximum line length (max-len)

      Very long lines of code in any language can be difficult to read. In order to aid in readability and maintainability many coders have developed a convention to limit lines of code to X number of characters (traditionally 80 characters).

      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" }; // very long

      Rule Details

      This rule enforces a maximum line length to increase code readability and maintainability. The length of a line is defined as the number of Unicode characters in the line.

      Options

      This rule has a number or object option:

      • "code" (default 80) enforces a maximum line length
      • "tabWidth" (default 4) specifies the character width for tab characters
      • "comments" enforces a maximum line length for comments; defaults to value of code
      • "ignorePattern" ignores lines matching a regular expression; can only match a single line and need to be double escaped when written in YAML or JSON
      • "ignoreComments": true ignores all trailing comments and comments on their own line
      • "ignoreTrailingComments": true ignores only trailing comments
      • "ignoreUrls": true ignores lines that contain a URL
      • "ignoreStrings": true ignores lines that contain a double-quoted or single-quoted string
      • "ignoreTemplateLiterals": true ignores lines that contain a template literal
      • "ignoreRegExpLiterals": true ignores lines that contain a RegExp literal

      code

      Examples of incorrect code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" }, "difficult": "to read" };

      Examples of correct code for this rule with the default { "code": 80 } option:

      /*eslint max-len: ["error", 80]*/
      
      var foo = {
        "bar": "This is a bar.",
        "baz": { "qux": "This is a qux" },
        "easier": "to read"
      };

      tabWidth

      Examples of incorrect code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = { "bar": "This is a bar.", "baz": { "qux": "This is a qux" } };

      Examples of correct code for this rule with the default { "tabWidth": 4 } option:

      /*eslint max-len: ["error", 80, 4]*/
      
      \t  \t  var foo = {
      \t  \t  \t  \t  "bar": "This is a bar.",
      \t  \t  \t  \t  "baz": { "qux": "This is a qux" }
      \t  \t  };

      comments

      Examples of incorrect code for this rule with the { "comments": 65 } option:

      /*eslint max-len: ["error", { "comments": 65 }]*/
      
      /**
       * This is a comment that violates the maximum line length we have specified
      **/

      ignoreComments

      Examples of correct code for this rule with the { "ignoreComments": true } option:

      /*eslint max-len: ["error", { "ignoreComments": true }]*/
      
      /**
       * This is a really really really really really really really really really long comment
      **/

      ignoreTrailingComments

      Examples of correct code for this rule with the { "ignoreTrailingComments": true } option:

      /*eslint max-len: ["error", { "ignoreTrailingComments": true }]*/
      
      var foo = 'bar'; // This is a really really really really really really really long comment

      ignoreUrls

      Examples of correct code for this rule with the { "ignoreUrls": true } option:

      /*eslint max-len: ["error", { "ignoreUrls": true }]*/
      
      var url = 'https://www.example.com/really/really/really/really/really/really/really/long';

      ignoreStrings

      Examples of correct code for this rule with the { "ignoreStrings": true } option:

      /*eslint max-len: ["error", { "ignoreStrings": true }]*/
      
      var longString = 'this is a really really really really really long string!';

      ignoreTemplateLiterals

      Examples of correct code for this rule with the { "ignoreTemplateLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreTemplateLiterals": true }]*/
      
      var longTemplateLiteral = `this is a really really really really really long template literal!`;

      ignoreRegExpLiterals

      Examples of correct code for this rule with the { "ignoreRegExpLiterals": true } option:

      /*eslint max-len: ["error", { "ignoreRegExpLiterals": true }]*/
      
      var longRegExpLiteral = /this is a really really really really really long regular expression!/;

      ignorePattern

      Examples of correct code for this rule with the { "ignorePattern": true } option:

      /*eslint max-len: ["error", { "ignorePattern": "^\\s*var\\s.+=\\s*require\\s*\\(/" }]*/
      
      var dep = require('really/really/really/really/really/really/really/really/long/module');

      Related Rules

      • [complexity](complexity.md)
      • [max-depth](max-depth.md)
      • [max-nested-callbacks](max-nested-callbacks.md)
      • [max-params](max-params.md)
      • [max-statements](max-statements.md) Source: http://eslint.org/docs/rules/

      Function componentDidMount has 32 lines of code (exceeds 25 allowed). Consider refactoring.
      Open

        componentDidMount () {
          const MediumEditor = require("medium-editor");
          const { TCMention } = require("medium-editor-tc-mention");
      
          this.editor = new MediumEditor(this.refs.editable, {
      Severity: Minor
      Found in examples/gh-pages/src/ReactRoot.js - About 1 hr to fix

        Function wrapWordInMentionAt has 30 lines of code (exceeds 25 allowed). Consider refactoring.
        Open

          wrapWordInMentionAt() {
            const selection = this.document.getSelection();
            if (!selection.rangeCount) {
              return;
            }
        Severity: Minor
        Found in src/index.js - About 1 hr to fix

          Function getWordFromSelection has 27 lines of code (exceeds 25 allowed). Consider refactoring.
          Open

            getWordFromSelection(target, initialDiff) {
              const {
                startContainer,
                startOffset,
                endContainer,
          Severity: Minor
          Found in src/index.js - About 1 hr to fix

            Function getWordFromSelection has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring.
            Open

              getWordFromSelection(target, initialDiff) {
                const {
                  startContainer,
                  startOffset,
                  endContainer,
            Severity: Minor
            Found in src/index.js - About 25 mins to fix

            Cognitive Complexity

            Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

            A method's cognitive complexity is based on a few simple rules:

            • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
            • Code is considered more complex for each "break in the linear flow of the code"
            • Code is considered more complex when "flow breaking structures are nested"

            Further reading

            Function wrapWordInMentionAt has a Cognitive Complexity of 6 (exceeds 5 allowed). Consider refactoring.
            Open

              wrapWordInMentionAt() {
                const selection = this.document.getSelection();
                if (!selection.rangeCount) {
                  return;
                }
            Severity: Minor
            Found in src/index.js - About 25 mins to fix

            Cognitive Complexity

            Cognitive Complexity is a measure of how difficult a unit of code is to intuitively understand. Unlike Cyclomatic Complexity, which determines how difficult your code will be to test, Cognitive Complexity tells you how difficult your code will be to read and comprehend.

            A method's cognitive complexity is based on a few simple rules:

            • Code is not considered more complex when it uses shorthand that the language provides for collapsing multiple statements into one
            • Code is considered more complex for each "break in the linear flow of the code"
            • Code is considered more complex when "flow breaking structures are nested"

            Further reading

            Use default import syntax to import 'ReactDOM'.
            Open

            import {default as ReactDOM} from "react-dom";
            Severity: Minor
            Found in examples/gh-pages/src/client.js by eslint

            For more information visit Source: http://eslint.org/docs/rules/

            Strings must use backtick.
            Open

                const { TCMention } = require("medium-editor-tc-mention");
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            enforce the consistent use of either backticks, double, or single quotes (quotes)

            JavaScript allows you to define strings in one of three ways: double quotes, single quotes, and backticks (as of ECMAScript 6). For example:

            /*eslint-env es6*/
            
            var double = "double";
            var single = 'single';
            var backtick = `backtick`;    // ES6 only

            Each of these lines creates a string and, in some cases, can be used interchangeably. The choice of how to define strings in a codebase is a stylistic one outside of template literals (which allow embedded of expressions to be interpreted).

            Many codebases require strings to be defined in a consistent manner.

            Rule Details

            This rule enforces the consistent use of either backticks, double, or single quotes.

            Options

            This rule has two options, a string option and an object option.

            String option:

            • "double" (default) requires the use of double quotes wherever possible
            • "single" requires the use of single quotes wherever possible
            • "backtick" requires the use of backticks wherever possible

            Object option:

            • "avoidEscape": true allows strings to use single-quotes or double-quotes so long as the string contains a quote that would have to be escaped otherwise
            • "allowTemplateLiterals": true allows strings to use backticks

            Deprecated: The object property avoid-escape is deprecated; please use the object property avoidEscape instead.

            double

            Examples of incorrect code for this rule with the default "double" option:

            /*eslint quotes: ["error", "double"]*/
            
            var single = 'single';
            var unescaped = 'a string containing "double" quotes';

            Examples of correct code for this rule with the default "double" option:

            /*eslint quotes: ["error", "double"]*/
            /*eslint-env es6*/
            
            var double = "double";
            var backtick = `back\ntick`;  // backticks are allowed due to newline
            var backtick = tag`backtick`; // backticks are allowed due to tag

            single

            Examples of incorrect code for this rule with the "single" option:

            /*eslint quotes: ["error", "single"]*/
            
            var double = "double";
            var unescaped = "a string containing 'single' quotes";

            Examples of correct code for this rule with the "single" option:

            /*eslint quotes: ["error", "single"]*/
            /*eslint-env es6*/
            
            var single = 'single';
            var backtick = `back${x}tick`; // backticks are allowed due to substitution

            backticks

            Examples of incorrect code for this rule with the "backtick" option:

            /*eslint quotes: ["error", "backtick"]*/
            
            var single = 'single';
            var double = "double";
            var unescaped = 'a string containing `backticks`';

            Examples of correct code for this rule with the "backtick" option:

            /*eslint quotes: ["error", "backtick"]*/
            /*eslint-env es6*/
            
            var backtick = `backtick`;

            avoidEscape

            Examples of additional correct code for this rule with the "double", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "double", { "avoidEscape": true }]*/
            
            var single = 'a string containing "double" quotes';

            Examples of additional correct code for this rule with the "single", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "single", { "avoidEscape": true }]*/
            
            var double = "a string containing 'single' quotes";

            Examples of additional correct code for this rule with the "backtick", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "backtick", { "avoidEscape": true }]*/
            
            var double = "a string containing `backtick` quotes"

            allowTemplateLiterals

            Examples of additional correct code for this rule with the "double", { "allowTemplateLiterals": true } options:

            /*eslint quotes: ["error", "double", { "allowTemplateLiterals": true }]*/
            
            var double = "double";
            var double = `double`;

            Examples of additional correct code for this rule with the "single", { "allowTemplateLiterals": true } options:

            /*eslint quotes: ["error", "single", { "allowTemplateLiterals": true }]*/
            
            var single = 'single';
            var single = `single`;

            When Not To Use It

            If you do not need consistency in your string styles, you can safely disable this rule. Source: http://eslint.org/docs/rules/

            Expected method shorthand.
            Open

                      destroyPanelContent: function (panelEl) {
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            Require Object Literal Shorthand Syntax (object-shorthand)

            EcmaScript 6 provides a concise form for defining object literal methods and properties. This syntax can make defining complex object literals much cleaner.

            Here are a few common examples using the ES5 syntax:

            // properties
            var foo = {
                x: x,
                y: y,
                z: z,
            };
            
            // methods
            var foo = {
                a: function() {},
                b: function() {}
            };

            Now here are ES6 equivalents:

            /*eslint-env es6*/
            
            // properties
            var foo = {x, y, z};
            
            // methods
            var foo = {
                a() {},
                b() {}
            };

            Rule Details

            This rule enforces the use of the shorthand syntax. This applies to all methods (including generators) defined in object literals and any properties defined where the key name matches name of the assigned variable.

            Each of the following properties would warn:

            /*eslint object-shorthand: "error"*/
            /*eslint-env es6*/
            
            var foo = {
                w: function() {},
                x: function *() {},
                [y]: function() {},
                z: z
            };

            In that case the expected syntax would have been:

            /*eslint object-shorthand: "error"*/
            /*eslint-env es6*/
            
            var foo = {
                w() {},
                *x() {},
                [y]() {},
                z
            };

            This rule does not flag arrow functions inside of object literals. The following will not warn:

            /*eslint object-shorthand: "error"*/
            /*eslint-env es6*/
            
            var foo = {
                x: (y) => y
            };

            Options

            The rule takes an option which specifies when it should be applied. It can be set to one of the following values:

            • "always" (default) expects that the shorthand will be used whenever possible.
            • "methods" ensures the method shorthand is used (also applies to generators).
            • "properties" ensures the property shorthand is used (where the key and variable name match).
            • "never" ensures that no property or method shorthand is used in any object literal.
            • "consistent" ensures that either all shorthand or all longform will be used in an object literal.
            • "consistent-as-needed" ensures that either all shorthand or all longform will be used in an object literal, but ensures all shorthand whenever possible.

            You can set the option in configuration like this:

            {
                "object-shorthand": ["error", "always"]
            }

            Additionally, the rule takes an optional object configuration:

            • "avoidQuotes": true indicates that longform syntax is preferred whenever the object key is a string literal (default: false). Note that this option can only be enabled when the string option is set to "always", "methods", or "properties".
            • "ignoreConstructors": true can be used to prevent the rule from reporting errors for constructor functions. (By default, the rule treats constructors the same way as other functions.) Note that this option can only be enabled when the string option is set to "always" or "methods".
            • "avoidExplicitReturnArrows": true indicates that methods are preferred over explicit-return arrow functions for function properties. (By default, the rule allows either of these.) Note that this option can only be enabled when the string option is set to "always" or "methods".

            avoidQuotes

            {
                "object-shorthand": ["error", "always", { "avoidQuotes": true }]
            }

            Example of incorrect code for this rule with the "always", { "avoidQuotes": true } option:

            /*eslint object-shorthand: ["error", "always", { "avoidQuotes": true }]*/
            /*eslint-env es6*/
            
            var foo = {
                "bar-baz"() {}
            };

            Example of correct code for this rule with the "always", { "avoidQuotes": true } option:

            /*eslint object-shorthand: ["error", "always", { "avoidQuotes": true }]*/
            /*eslint-env es6*/
            
            var foo = {
                "bar-baz": function() {},
                "qux": qux
            };

            ignoreConstructors

            {
                "object-shorthand": ["error", "always", { "ignoreConstructors": true }]
            }

            Example of correct code for this rule with the "always", { "ignoreConstructors": true } option:

            /*eslint object-shorthand: ["error", "always", { "ignoreConstructors": true }]*/
            /*eslint-env es6*/
            
            var foo = {
                ConstructorFunction: function() {}
            };

            avoidExplicitReturnArrows

            {
                "object-shorthand": ["error", "always", { "avoidExplicitReturnArrows": true }]
            }

            Example of incorrect code for this rule with the "always", { "avoidExplicitReturnArrows": true } option:

            /*eslint object-shorthand: ["error", "always", { "avoidExplicitReturnArrows": true }]*/
            /*eslint-env es6*/
            
            var foo = {
              foo: (bar, baz) => {
                return bar + baz;
              },
            
              qux: (foobar) => {
                return foobar * 2;
              }
            };

            Example of correct code for this rule with the "always", { "avoidExplicitReturnArrows": true } option:

            /*eslint object-shorthand: ["error", "always", { "avoidExplicitReturnArrows": true }]*/
            /*eslint-env es6*/
            
            var foo = {
              foo(bar, baz) {
                return bar + baz;
              },
            
              qux: foobar => foobar * 2
            };

            Example of incorrect code for this rule with the "consistent" option:

            /*eslint object-shorthand: [2, "consistent"]*/
            /*eslint-env es6*/
            
            var foo = {
                a,
                b: "foo",
            };

            Examples of correct code for this rule with the "consistent" option:

            /*eslint object-shorthand: [2, "consistent"]*/
            /*eslint-env es6*/
            
            var foo = {
                a: a,
                b: "foo"
            };
            
            var bar = {
                a,
                b,
            };

            Example of incorrect code with the "consistent-as-needed" option, which is very similar to "consistent":

            /*eslint object-shorthand: [2, "consistent-as-needed"]*/
            /*eslint-env es6*/
            
            var foo = {
                a: a,
                b: b,
            };

            When Not To Use It

            Anyone not yet in an ES6 environment would not want to apply this rule. Others may find the terseness of the shorthand syntax harder to read and may not want to encourage it with this rule.

            Further Reading

            Object initializer - MDN Source: http://eslint.org/docs/rules/

            Strings must use backtick.
            Open

                      activeTriggerList: ["#", "@"]
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            enforce the consistent use of either backticks, double, or single quotes (quotes)

            JavaScript allows you to define strings in one of three ways: double quotes, single quotes, and backticks (as of ECMAScript 6). For example:

            /*eslint-env es6*/
            
            var double = "double";
            var single = 'single';
            var backtick = `backtick`;    // ES6 only

            Each of these lines creates a string and, in some cases, can be used interchangeably. The choice of how to define strings in a codebase is a stylistic one outside of template literals (which allow embedded of expressions to be interpreted).

            Many codebases require strings to be defined in a consistent manner.

            Rule Details

            This rule enforces the consistent use of either backticks, double, or single quotes.

            Options

            This rule has two options, a string option and an object option.

            String option:

            • "double" (default) requires the use of double quotes wherever possible
            • "single" requires the use of single quotes wherever possible
            • "backtick" requires the use of backticks wherever possible

            Object option:

            • "avoidEscape": true allows strings to use single-quotes or double-quotes so long as the string contains a quote that would have to be escaped otherwise
            • "allowTemplateLiterals": true allows strings to use backticks

            Deprecated: The object property avoid-escape is deprecated; please use the object property avoidEscape instead.

            double

            Examples of incorrect code for this rule with the default "double" option:

            /*eslint quotes: ["error", "double"]*/
            
            var single = 'single';
            var unescaped = 'a string containing "double" quotes';

            Examples of correct code for this rule with the default "double" option:

            /*eslint quotes: ["error", "double"]*/
            /*eslint-env es6*/
            
            var double = "double";
            var backtick = `back\ntick`;  // backticks are allowed due to newline
            var backtick = tag`backtick`; // backticks are allowed due to tag

            single

            Examples of incorrect code for this rule with the "single" option:

            /*eslint quotes: ["error", "single"]*/
            
            var double = "double";
            var unescaped = "a string containing 'single' quotes";

            Examples of correct code for this rule with the "single" option:

            /*eslint quotes: ["error", "single"]*/
            /*eslint-env es6*/
            
            var single = 'single';
            var backtick = `back${x}tick`; // backticks are allowed due to substitution

            backticks

            Examples of incorrect code for this rule with the "backtick" option:

            /*eslint quotes: ["error", "backtick"]*/
            
            var single = 'single';
            var double = "double";
            var unescaped = 'a string containing `backticks`';

            Examples of correct code for this rule with the "backtick" option:

            /*eslint quotes: ["error", "backtick"]*/
            /*eslint-env es6*/
            
            var backtick = `backtick`;

            avoidEscape

            Examples of additional correct code for this rule with the "double", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "double", { "avoidEscape": true }]*/
            
            var single = 'a string containing "double" quotes';

            Examples of additional correct code for this rule with the "single", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "single", { "avoidEscape": true }]*/
            
            var double = "a string containing 'single' quotes";

            Examples of additional correct code for this rule with the "backtick", { "avoidEscape": true } options:

            /*eslint quotes: ["error", "backtick", { "avoidEscape": true }]*/
            
            var double = "a string containing `backtick` quotes"

            allowTemplateLiterals

            Examples of additional correct code for this rule with the "double", { "allowTemplateLiterals": true } options:

            /*eslint quotes: ["error", "double", { "allowTemplateLiterals": true }]*/
            
            var double = "double";
            var double = `double`;

            Examples of additional correct code for this rule with the "single", { "allowTemplateLiterals": true } options:

            /*eslint quotes: ["error", "single", { "allowTemplateLiterals": true }]*/
            
            var single = 'single';
            var single = `single`;

            When Not To Use It

            If you do not need consistency in your string styles, you can safely disable this rule. Source: http://eslint.org/docs/rules/

            Unexpected console statement.
            Open

                  console.log(`editableInput: `, event);
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            disallow the use of console (no-console)

            In JavaScript that is designed to be executed in the browser, it's considered a best practice to avoid using methods on console. Such messages are considered to be for debugging purposes and therefore not suitable to ship to the client. In general, calls using console should be stripped before being pushed to production.

            console.log("Made it here.");
            console.error("That shouldn't have happened.");

            Rule Details

            This rule disallows calls to methods of the console object.

            Examples of incorrect code for this rule:

            /*eslint no-console: "error"*/
            
            console.log("Log a debug level message.");
            console.warn("Log a warn level message.");
            console.error("Log an error level message.");

            Examples of correct code for this rule:

            /*eslint no-console: "error"*/
            
            // custom console
            Console.log("Hello world!");

            Options

            This rule has an object option for exceptions:

            • "allow" has an array of strings which are allowed methods of the console object

            Examples of additional correct code for this rule with a sample { "allow": ["warn", "error"] } option:

            /*eslint no-console: ["error", { allow: ["warn", "error"] }] */
            
            console.warn("Log a warn level message.");
            console.error("Log an error level message.");

            When Not To Use It

            If you're using Node.js, however, console is used to output information to the user and so is not strictly used for debugging purposes. If you are developing for Node.js then you most likely do not want this rule enabled.

            Related Rules

            Use default import syntax to import 'React'.
            Open

              default as React,

            For more information visit Source: http://eslint.org/docs/rules/

            Expected parentheses around arrow function argument having a body with curly braces.
            Open

                this.editor.subscribe(`editableInput`, event => {
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            Require parens in arrow function arguments (arrow-parens)

            Arrow functions can omit parentheses when they have exactly one parameter. In all other cases the parameter(s) must be wrapped in parentheses. This rule enforces the consistent use of parentheses in arrow functions.

            Rule Details

            This rule enforces parentheses around arrow function parameters regardless of arity. For example:

            /*eslint-env es6*/
            
            // Bad
            a => {}
            
            // Good
            (a) => {}

            Following this style will help you find arrow functions (=>) which may be mistakenly included in a condition when a comparison such as >= was the intent.

            /*eslint-env es6*/
            
            // Bad
            if (a => 2) {
            }
            
            // Good
            if (a >= 2) {
            }

            The rule can also be configured to discourage the use of parens when they are not required:

            /*eslint-env es6*/
            
            // Bad
            (a) => {}
            
            // Good
            a => {}

            Options

            This rule has a string option and an object one.

            String options are:

            • "always" (default) requires parens around arguments in all cases.
            • "as-needed" allows omitting parens when there is only one argument.

            Object properties for variants of the "as-needed" option:

            • "requireForBlockBody": true modifies the as-needed rule in order to require parens if the function body is in an instructions block (surrounded by braces).

            always

            Examples of incorrect code for this rule with the default "always" option:

            /*eslint arrow-parens: ["error", "always"]*/
            /*eslint-env es6*/
            
            a => {};
            a => a;
            a => {'\n'};
            a.then(foo => {});
            a.then(foo => a);
            a(foo => { if (true) {} });

            Examples of correct code for this rule with the default "always" option:

            /*eslint arrow-parens: ["error", "always"]*/
            /*eslint-env es6*/
            
            () => {};
            (a) => {};
            (a) => a;
            (a) => {'\n'}
            a.then((foo) => {});
            a.then((foo) => { if (true) {} });

            If Statements

            One of benefits of this option is that it prevents the incorrect use of arrow functions in conditionals:

            /*eslint-env es6*/
            
            var a = 1;
            var b = 2;
            // ...
            if (a => b) {
             console.log('bigger');
            } else {
             console.log('smaller');
            }
            // outputs 'bigger', not smaller as expected

            The contents of the if statement is an arrow function, not a comparison.

            If the arrow function is intentional, it should be wrapped in parens to remove ambiguity.

            /*eslint-env es6*/
            
            var a = 1;
            var b = 0;
            // ...
            if ((a) => b) {
             console.log('truthy value returned');
            } else {
             console.log('falsey value returned');
            }
            // outputs 'truthy value returned'

            The following is another example of this behavior:

            /*eslint-env es6*/
            
            var a = 1, b = 2, c = 3, d = 4;
            var f = a => b ? c: d;
            // f = ?

            f is an arrow function which takes a as an argument and returns the result of b ? c: d.

            This should be rewritten like so:

            /*eslint-env es6*/
            
            var a = 1, b = 2, c = 3, d = 4;
            var f = (a) => b ? c: d;

            as-needed

            Examples of incorrect code for this rule with the "as-needed" option:

            /*eslint arrow-parens: ["error", "as-needed"]*/
            /*eslint-env es6*/
            
            (a) => {};
            (a) => a;
            (a) => {'\n'};
            a.then((foo) => {});
            a.then((foo) => a);
            a((foo) => { if (true) {} });

            Examples of correct code for this rule with the "as-needed" option:

            /*eslint arrow-parens: ["error", "as-needed"]*/
            /*eslint-env es6*/
            
            () => {};
            a => {};
            a => a;
            a => {'\n'};
            a.then(foo => {});
            a.then(foo => { if (true) {} });
            (a, b, c) => a;
            (a = 10) => a;
            ([a, b]) => a;
            ({a, b}) => a;

            requireForBlockBody

            Examples of incorrect code for the { "requireForBlockBody": true } option:

            /*eslint arrow-parens: [2, "as-needed", { "requireForBlockBody": true }]*/
            /*eslint-env es6*/
            
            (a) => a;
            a => {};
            a => {'\n'};
            a.map((x) => x * x);
            a.map(x => {
              return x * x;
            });
            a.then(foo => {});

            Examples of correct code for the { "requireForBlockBody": true } option:

            /*eslint arrow-parens: [2, "as-needed", { "requireForBlockBody": true }]*/
            /*eslint-env es6*/
            
            (a) => {};
            (a) => {'\n'};
            a => ({});
            () => {};
            a => a;
            a.then((foo) => {});
            a.then((foo) => { if (true) {} });
            a((foo) => { if (true) {} });
            (a, b, c) => a;
            (a = 10) => a;
            ([a, b]) => a;
            ({a, b}) => a;

            Further Reading

            Unexpected space before function parentheses.
            Open

              render () {
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            Require or disallow a space before function parenthesis (space-before-function-paren)

            When formatting a function, whitespace is allowed between the function name or function keyword and the opening paren. Named functions also require a space between the function keyword and the function name, but anonymous functions require no whitespace. For example:

            function withoutSpace(x) {
                // ...
            }
            
            function withSpace (x) {
                // ...
            }
            
            var anonymousWithoutSpace = function() {};
            
            var anonymousWithSpace = function () {};

            Style guides may require a space after the function keyword for anonymous functions, while others specify no whitespace. Similarly, the space after a function name may or may not be required.

            Rule Details

            This rule aims to enforce consistent spacing before function parentheses and as such, will warn whenever whitespace doesn't match the preferences specified.

            Options

            This rule has a string option or an object option:

            {
                "space-before-function-paren": ["error", "always"],
                // or
                "space-before-function-paren": ["error", {
                    "anonymous": "always",
                    "named": "always",
                    "asyncArrow": "ignore"
                }],
            }
            • always (default) requires a space followed by the ( of arguments.
            • never disallows any space followed by the ( of arguments.

            The string option does not check async arrow function expressions for backward compatibility.

            You can also use a separate option for each type of function. Each of the following options can be set to "always", "never", or "ignore". Default is "always" basically.

            • anonymous is for anonymous function expressions (e.g. function () {}).
            • named is for named function expressions (e.g. function foo () {}).
            • asyncArrow is for async arrow function expressions (e.g. async () => {}). asyncArrow is set to "ignore" by default for backwards compatibility.

            "always"

            Examples of incorrect code for this rule with the default "always" option:

            /*eslint space-before-function-paren: "error"*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            var bar = function foo() {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };

            Examples of correct code for this rule with the default "always" option:

            /*eslint space-before-function-paren: "error"*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            var bar = function foo () {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };
            
            // async arrow function expressions are ignored by default.
            var foo = async () => 1
            var foo = async() => 1

            "never"

            Examples of incorrect code for this rule with the "never" option:

            /*eslint space-before-function-paren: ["error", "never"]*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            var bar = function foo () {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };

            Examples of correct code for this rule with the "never" option:

            /*eslint space-before-function-paren: ["error", "never"]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            var bar = function foo() {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };
            
            // async arrow function expressions are ignored by default.
            var foo = async () => 1
            var foo = async() => 1

            {"anonymous": "always", "named": "never", "asyncArrow": "always"}

            Examples of incorrect code for this rule with the {"anonymous": "always", "named": "never", "asyncArrow": "always"} option:

            /*eslint space-before-function-paren: ["error", {"anonymous": "always", "named": "never", "asyncArrow": "always"}]*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };
            
            var foo = async(a) => await a

            Examples of correct code for this rule with the {"anonymous": "always", "named": "never", "asyncArrow": "always"} option:

            /*eslint space-before-function-paren: ["error", {"anonymous": "always", "named": "never", "asyncArrow": "always"}]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };
            
            var foo = async (a) => await a

            {"anonymous": "never", "named": "always"}

            Examples of incorrect code for this rule with the {"anonymous": "never", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "never", "named": "always" }]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            var bar = function () {
                // ...
            };
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };

            Examples of correct code for this rule with the {"anonymous": "never", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "never", "named": "always" }]*/
            /*eslint-env es6*/
            
            function foo () {
                // ...
            }
            
            var bar = function() {
                // ...
            };
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };

            {"anonymous": "ignore", "named": "always"}

            Examples of incorrect code for this rule with the {"anonymous": "ignore", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "ignore", "named": "always" }]*/
            /*eslint-env es6*/
            
            function foo() {
                // ...
            }
            
            class Foo {
                constructor() {
                    // ...
                }
            }
            
            var foo = {
                bar() {
                    // ...
                }
            };

            Examples of correct code for this rule with the {"anonymous": "ignore", "named": "always"} option:

            /*eslint space-before-function-paren: ["error", { "anonymous": "ignore", "named": "always" }]*/
            /*eslint-env es6*/
            
            var bar = function() {
                // ...
            };
            
            var bar = function () {
                // ...
            };
            
            function foo () {
                // ...
            }
            
            class Foo {
                constructor () {
                    // ...
                }
            }
            
            var foo = {
                bar () {
                    // ...
                }
            };

            When Not To Use It

            You can turn this rule off if you are not concerned with the consistency of spacing before function parenthesis.

            Related Rules

            Using string literals in ref attributes is deprecated.
            Open

                    <div className="editable" ref="editable">
            Severity: Minor
            Found in examples/gh-pages/src/ReactRoot.js by eslint

            For more information visit Source: http://eslint.org/docs/rules/

            Use default import syntax to import 'webpack'.
            Open

              default as webpack,

            For more information visit Source: http://eslint.org/docs/rules/

            Severity
            Category
            Status
            Source
            Language