Showing 10 of 10 total issues
Function karmaConfig
has 72 lines of code (exceeds 25 allowed). Consider refactoring. Open
module.exports = function karmaConfig(config) {
config.set({
colors: true,
logLevel: config.LOG_INFO,
autoWatch: false,
Expected 'this' to be used by class method 'compile'. Open
compile() {
- Read upRead up
- Exclude checks
Enforce that class methods utilize this
(class-methods-use-this)
If a class method does not use this
, it can safely be made a static function.
It's possible to have a class method which doesn't use this
, such as:
class A {
constructor() {
this.a = "hi";
}
print() {
console.log(this.a);
}
sayHi() {
console.log("hi");
}
}
let a = new A();
a.sayHi(); // => "hi"
In the example above, the sayHi
method doesn't use this
, so we can make it a static method:
class A {
constructor() {
this.a = "hi";
}
print() {
console.log(this.a);
}
static sayHi() {
console.log("hi");
}
}
A.sayHi(); // => "hi"
Also note in the above examples that the code calling the function on an instance of the class (let a = new A(); a.sayHi();
) changes to calling it on the class itself (A.sayHi();
).
Rule Details
This rule is aimed to flag class methods that do not use this
.
Examples of incorrect code for this rule:
/*eslint class-methods-use-this: "error"*/
/*eslint-env es6*/
class A {
foo() {
console.log("Hello World"); /*error Expected 'this' to be used by class method 'foo'.*/
}
}
Examples of correct code for this rule:
/*eslint class-methods-use-this: "error"*/
/*eslint-env es6*/
class A {
foo() {
this.bar = "Hello World"; // OK, this is used
}
}
class A {
constructor() {
// OK. constructor is exempt
}
}
class A {
static foo() {
// OK. static methods aren't expected to use this.
}
}
Options
Exceptions
"class-methods-use-this": [<enabled>, { "exceptMethods": [<...exceptions>] }]</enabled>
The exceptMethods
option allows you to pass an array of method names for which you would like to ignore warnings.
Examples of incorrect code for this rule when used without exceptMethods:
/*eslint class-methods-use-this: "error"*/
class A {
foo() {
}
}
Examples of correct code for this rule when used with exceptMethods:
/*eslint class-methods-use-this: ["error", { "exceptMethods": ["foo"] }] */
class A {
foo() {
}
}
Source: http://eslint.org/docs/rules/
Missing trailing comma. Open
<div class="container" stringify-html>${expected}</div>`
- Read upRead up
- Exclude checks
require or disallow trailing commas (comma-dangle)
Trailing commas in object literals are valid according to the ECMAScript 5 (and ECMAScript 3!) spec. However, IE8 (when not in IE8 document mode) and below will throw an error when it encounters trailing commas in JavaScript.
var foo = {
bar: "baz",
qux: "quux",
};
Trailing commas simplify adding and removing items to objects and arrays, since only the lines you are modifying must be touched. Another argument in favor of trailing commas is that it improves the clarity of diffs when an item is added or removed from an object or array:
Less clear:
var foo = {
- bar: "baz",
- qux: "quux"
+ bar: "baz"
};
More clear:
var foo = {
bar: "baz",
- qux: "quux",
};
Rule Details
This rule enforces consistent use of trailing commas in object and array literals.
Options
This rule has a string option or an object option:
{
"comma-dangle": ["error", "never"],
// or
"comma-dangle": ["error", {
"arrays": "never",
"objects": "never",
"imports": "never",
"exports": "never",
"functions": "ignore",
}]
}
-
"never"
(default) disallows trailing commas -
"always"
requires trailing commas -
"always-multiline"
requires trailing commas when the last element or property is in a different line than the closing]
or}
and disallows trailing commas when the last element or property is on the same line as the closing]
or}
-
"only-multiline"
allows (but does not require) trailing commas when the last element or property is in a different line than the closing]
or}
and disallows trailing commas when the last element or property is on the same line as the closing]
or}
Trailing commas in function declarations and function calls are valid syntax since ECMAScript 2017; however, the string option does not check these situations for backwards compatibility.
You can also use an object option to configure this rule for each type of syntax.
Each of the following options can be set to "never"
, "always"
, "always-multiline"
, "only-multiline"
, or "ignore"
.
The default for each option is "never"
unless otherwise specified.
-
arrays
is for array literals and array patterns of destructuring. (e.g.let [a,] = [1,];
) -
objects
is for object literals and object patterns of destructuring. (e.g.let {a,} = {a: 1};
) -
imports
is for import declarations of ES Modules. (e.g.import {a,} from "foo";
) -
exports
is for export declarations of ES Modules. (e.g.export {a,};
) -
functions
is for function declarations and function calls. (e.g.(function(a,){ })(b,);
)
functions
is set to"ignore"
by default for consistency with the string option.
never
Examples of incorrect code for this rule with the default "never"
option:
/*eslint comma-dangle: ["error", "never"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var arr = [1,2,];
foo({
bar: "baz",
qux: "quux",
});
Examples of correct code for this rule with the default "never"
option:
/*eslint comma-dangle: ["error", "never"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var arr = [1,2];
foo({
bar: "baz",
qux: "quux"
});
always
Examples of incorrect code for this rule with the "always"
option:
/*eslint comma-dangle: ["error", "always"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var arr = [1,2];
foo({
bar: "baz",
qux: "quux"
});
Examples of correct code for this rule with the "always"
option:
/*eslint comma-dangle: ["error", "always"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var arr = [1,2,];
foo({
bar: "baz",
qux: "quux",
});
always-multiline
Examples of incorrect code for this rule with the "always-multiline"
option:
/*eslint comma-dangle: ["error", "always-multiline"]*/
var foo = {
bar: "baz",
qux: "quux"
};
var foo = { bar: "baz", qux: "quux", };
var arr = [1,2,];
var arr = [1,
2,];
var arr = [
1,
2
];
foo({
bar: "baz",
qux: "quux"
});
Examples of correct code for this rule with the "always-multiline"
option:
/*eslint comma-dangle: ["error", "always-multiline"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];
var arr = [1,
2];
var arr = [
1,
2,
];
foo({
bar: "baz",
qux: "quux",
});
only-multiline
Examples of incorrect code for this rule with the "only-multiline"
option:
/*eslint comma-dangle: ["error", "only-multiline"]*/
var foo = { bar: "baz", qux: "quux", };
var arr = [1,2,];
var arr = [1,
2,];
Examples of correct code for this rule with the "only-multiline"
option:
/*eslint comma-dangle: ["error", "only-multiline"]*/
var foo = {
bar: "baz",
qux: "quux",
};
var foo = {
bar: "baz",
qux: "quux"
};
var foo = {bar: "baz", qux: "quux"};
var arr = [1,2];
var arr = [1,
2];
var arr = [
1,
2,
];
var arr = [
1,
2
];
foo({
bar: "baz",
qux: "quux",
});
foo({
bar: "baz",
qux: "quux"
});
functions
Examples of incorrect code for this rule with the {"functions": "never"}
option:
/*eslint comma-dangle: ["error", {"functions": "never"}]*/
function foo(a, b,) {
}
foo(a, b,);
new foo(a, b,);
Examples of correct code for this rule with the {"functions": "never"}
option:
/*eslint comma-dangle: ["error", {"functions": "never"}]*/
function foo(a, b) {
}
foo(a, b);
new foo(a, b);
Examples of incorrect code for this rule with the {"functions": "always"}
option:
/*eslint comma-dangle: ["error", {"functions": "always"}]*/
function foo(a, b) {
}
foo(a, b);
new foo(a, b);
Examples of correct code for this rule with the {"functions": "always"}
option:
/*eslint comma-dangle: ["error", {"functions": "always"}]*/
function foo(a, b,) {
}
foo(a, b,);
new foo(a, b,);
When Not To Use It
You can turn this rule off if you are not concerned with dangling commas. Source: http://eslint.org/docs/rules/
Unnecessary return statement. Open
return;
- Read upRead up
- Exclude checks
Disallow redundant return statements (no-useless-return)
A return;
statement with nothing after it is redundant, and has no effect on the runtime behavior of a function. This can be confusing, so it's better to disallow these redundant statements.
Rule Details
This rule aims to report redundant return
statements.
Examples of incorrect code for this rule:
/* eslint no-useless-return: "error" */
function foo() { return; }
function foo() {
doSomething();
return;
}
function foo() {
if (condition) {
bar();
return;
} else {
baz();
}
}
function foo() {
switch (bar) {
case 1:
doSomething();
default:
doSomethingElse();
return;
}
}
Examples of correct code for this rule:
/* eslint no-useless-return: "error" */
function foo() { return 5; }
function foo() {
return doSomething();
}
function foo() {
if (condition) {
bar();
return;
} else {
baz();
}
qux();
}
function foo() {
switch (bar) {
case 1:
doSomething();
return;
default:
doSomethingElse();
}
}
function foo() {
for (const foo of bar) {
return;
}
}
When Not To Use It
If you don't care about disallowing redundant return statements, you can turn off this rule. Source: http://eslint.org/docs/rules/
Unexpected function expression. Open
beforeEach(function initializeAngularModule() {
- Read upRead up
- Exclude checks
Suggest using arrow functions as callbacks. (prefer-arrow-callback)
Arrow functions are suited to callbacks, because:
-
this
keywords in arrow functions bind to the upper scope's. - The notation of the arrow function is shorter than function expression's.
Rule Details
This rule is aimed to flag usage of function expressions in an argument list.
The following patterns are considered problems:
/*eslint prefer-arrow-callback: "error"*/
foo(function(a) { return a; });
foo(function() { return this.a; }.bind(this));
The following patterns are not considered problems:
/*eslint prefer-arrow-callback: "error"*/
/*eslint-env es6*/
foo(a => a);
foo(function*() { yield; });
// this is not a callback.
var foo = function foo(a) { return a; };
// using `this` without `.bind(this)`.
foo(function() { return this.a; });
// recursively.
foo(function bar(n) { return n && n + bar(n - 1); });
Options
This rule takes one optional argument, an object which is an options object.
allowNamedFunctions
This is a boolean
option and it is false
by default. When set to true
, the rule doesn't warn on named functions used as callbacks.
Examples of correct code for the { "allowNamedFunctions": true }
option:
/*eslint prefer-arrow-callback: ["error", { "allowNamedFunctions": true }]*/
foo(function bar() {});
allowUnboundThis
This is a boolean
option and it is true
by default. When set to false
, this option allows the use of this
without restriction and checks for dynamically assigned this
values such as when using Array.prototype.map
with a context
argument. Normally, the rule will flag the use of this
whenever a function does not use bind()
to specify the value of this
constantly.
Examples of incorrect code for the { "allowUnboundThis": false }
option:
/*eslint prefer-arrow-callback: ["error", { "allowUnboundThis": false }]*/
/*eslint-env es6*/
foo(function() { this.a; });
foo(function() { (() => this); });
someArray.map(function (itm) { return this.doSomething(itm); }, someObject);
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about function expressions in an argument list, you can safely disable this rule. Source: http://eslint.org/docs/rules/
Expected parentheses around arrow function argument having a body with curly braces. Open
directives.forEach(directive => {
- Read upRead up
- Exclude checks
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
- The
"as-needed", { "requireForBlockBody": true }
rule is directly inspired by the Airbnb JS Style Guide. Source: http://eslint.org/docs/rules/
Expected empty line after import statement not followed by another import. Open
import StringifyHTML from './stringify-html.directive';
- Read upRead up
- Exclude checks
For more information visit Source: http://eslint.org/docs/rules/
Expected 'this' to be used by class method 'link'. Open
link() {
- Read upRead up
- Exclude checks
Enforce that class methods utilize this
(class-methods-use-this)
If a class method does not use this
, it can safely be made a static function.
It's possible to have a class method which doesn't use this
, such as:
class A {
constructor() {
this.a = "hi";
}
print() {
console.log(this.a);
}
sayHi() {
console.log("hi");
}
}
let a = new A();
a.sayHi(); // => "hi"
In the example above, the sayHi
method doesn't use this
, so we can make it a static method:
class A {
constructor() {
this.a = "hi";
}
print() {
console.log(this.a);
}
static sayHi() {
console.log("hi");
}
}
A.sayHi(); // => "hi"
Also note in the above examples that the code calling the function on an instance of the class (let a = new A(); a.sayHi();
) changes to calling it on the class itself (A.sayHi();
).
Rule Details
This rule is aimed to flag class methods that do not use this
.
Examples of incorrect code for this rule:
/*eslint class-methods-use-this: "error"*/
/*eslint-env es6*/
class A {
foo() {
console.log("Hello World"); /*error Expected 'this' to be used by class method 'foo'.*/
}
}
Examples of correct code for this rule:
/*eslint class-methods-use-this: "error"*/
/*eslint-env es6*/
class A {
foo() {
this.bar = "Hello World"; // OK, this is used
}
}
class A {
constructor() {
// OK. constructor is exempt
}
}
class A {
static foo() {
// OK. static methods aren't expected to use this.
}
}
Options
Exceptions
"class-methods-use-this": [<enabled>, { "exceptMethods": [<...exceptions>] }]</enabled>
The exceptMethods
option allows you to pass an array of method names for which you would like to ignore warnings.
Examples of incorrect code for this rule when used without exceptMethods:
/*eslint class-methods-use-this: "error"*/
class A {
foo() {
}
}
Examples of correct code for this rule when used with exceptMethods:
/*eslint class-methods-use-this: ["error", { "exceptMethods": ["foo"] }] */
class A {
foo() {
}
}
Source: http://eslint.org/docs/rules/
Unexpected function expression. Open
describe('Unit: Stringify HTML directive', function StringifyHTMLTests() {
- Read upRead up
- Exclude checks
Suggest using arrow functions as callbacks. (prefer-arrow-callback)
Arrow functions are suited to callbacks, because:
-
this
keywords in arrow functions bind to the upper scope's. - The notation of the arrow function is shorter than function expression's.
Rule Details
This rule is aimed to flag usage of function expressions in an argument list.
The following patterns are considered problems:
/*eslint prefer-arrow-callback: "error"*/
foo(function(a) { return a; });
foo(function() { return this.a; }.bind(this));
The following patterns are not considered problems:
/*eslint prefer-arrow-callback: "error"*/
/*eslint-env es6*/
foo(a => a);
foo(function*() { yield; });
// this is not a callback.
var foo = function foo(a) { return a; };
// using `this` without `.bind(this)`.
foo(function() { return this.a; });
// recursively.
foo(function bar(n) { return n && n + bar(n - 1); });
Options
This rule takes one optional argument, an object which is an options object.
allowNamedFunctions
This is a boolean
option and it is false
by default. When set to true
, the rule doesn't warn on named functions used as callbacks.
Examples of correct code for the { "allowNamedFunctions": true }
option:
/*eslint prefer-arrow-callback: ["error", { "allowNamedFunctions": true }]*/
foo(function bar() {});
allowUnboundThis
This is a boolean
option and it is true
by default. When set to false
, this option allows the use of this
without restriction and checks for dynamically assigned this
values such as when using Array.prototype.map
with a context
argument. Normally, the rule will flag the use of this
whenever a function does not use bind()
to specify the value of this
constantly.
Examples of incorrect code for the { "allowUnboundThis": false }
option:
/*eslint prefer-arrow-callback: ["error", { "allowUnboundThis": false }]*/
/*eslint-env es6*/
foo(function() { this.a; });
foo(function() { (() => this); });
someArray.map(function (itm) { return this.doSomething(itm); }, someObject);
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about function expressions in an argument list, you can safely disable this rule. Source: http://eslint.org/docs/rules/
Unexpected function expression. Open
it('Should stringify innerHTML', angular.mock.inject(function shouldStringifyInnerHTML() {
- Read upRead up
- Exclude checks
Suggest using arrow functions as callbacks. (prefer-arrow-callback)
Arrow functions are suited to callbacks, because:
-
this
keywords in arrow functions bind to the upper scope's. - The notation of the arrow function is shorter than function expression's.
Rule Details
This rule is aimed to flag usage of function expressions in an argument list.
The following patterns are considered problems:
/*eslint prefer-arrow-callback: "error"*/
foo(function(a) { return a; });
foo(function() { return this.a; }.bind(this));
The following patterns are not considered problems:
/*eslint prefer-arrow-callback: "error"*/
/*eslint-env es6*/
foo(a => a);
foo(function*() { yield; });
// this is not a callback.
var foo = function foo(a) { return a; };
// using `this` without `.bind(this)`.
foo(function() { return this.a; });
// recursively.
foo(function bar(n) { return n && n + bar(n - 1); });
Options
This rule takes one optional argument, an object which is an options object.
allowNamedFunctions
This is a boolean
option and it is false
by default. When set to true
, the rule doesn't warn on named functions used as callbacks.
Examples of correct code for the { "allowNamedFunctions": true }
option:
/*eslint prefer-arrow-callback: ["error", { "allowNamedFunctions": true }]*/
foo(function bar() {});
allowUnboundThis
This is a boolean
option and it is true
by default. When set to false
, this option allows the use of this
without restriction and checks for dynamically assigned this
values such as when using Array.prototype.map
with a context
argument. Normally, the rule will flag the use of this
whenever a function does not use bind()
to specify the value of this
constantly.
Examples of incorrect code for the { "allowUnboundThis": false }
option:
/*eslint prefer-arrow-callback: ["error", { "allowUnboundThis": false }]*/
/*eslint-env es6*/
foo(function() { this.a; });
foo(function() { (() => this); });
someArray.map(function (itm) { return this.doSomething(itm); }, someObject);
When Not To Use It
This rule should not be used in ES3/5 environments.
In ES2015 (ES6) or later, if you don't want to be notified about function expressions in an argument list, you can safely disable this rule. Source: http://eslint.org/docs/rules/