A set of additional TSLint rules used on some Agoda projects.
yarn add -D @agoda-com/tslint-rules
Change your tslint.json
file to extend the rules:
"extends": [
"tslint:recommended",
"tslint-react",
"@agoda-com/tslint-rules"
],
and explicity turn on desired rules (all are off by default)
Prints out a warning, that this function / method should not be used, and should get refactored if possible
A list of banned functions or methods in the following format:
- marking functions as not cool:
- just the name of the function:
"functionName"
- the name of the function in an array with one element:
["functionName"]
- an object in the following format:
{"name": "functionName", "message": "optional explanation message"}
- just the name of the function:
- marking methods as not cool:
- an array with the object name, method name and optional message:
["functionName", "methodName", "optional message"]
- an object in the following format:
{"name": ["objectName", "methodName"], "message": "optional message"}
- you can also ban deeply nested methods:
{"name": ["foo", "bar", "baz"]}
bansfoo.bar.baz()
- the first element can contain a wildcard (
*
) that matches everything.{"name": ["*", "forEach"]}
bans[].forEach(...)
,$(...).forEach(...)
,arr.forEach(...)
, etc.
- you can also ban deeply nested methods:
- an array with the object name, method name and optional message:
Example:
[].forEach(e => doSomething()); // -> not allowed
Example usage:
"do-not-use": [
true,
{name: ["*", "forEach"], message: "Please refactor and use regular loops instead"},
],
Prevents traversing upwards in directory structure when importing files, forcing the use of root relative imports instead.
Example:
import { MyComponent } from './MyComponent'; // -> allowed
import { MyComponent } from './Child/MyComponent'; // -> allowed
import { MyComponent } from 'components/MyComponent'; // -> allowed
import { MyComponent } from '../components/MyComponent'; // -> not allowed
Example usage:
"root-relative-imports": true,
Prints out a warning, that this CallExpression should not be used in the TEST files, and should get refactored if possible.
name of the call expression you want to ban in the test files.
- if that callExpression is a function, just simple give the function name.
- if that callExpression is a method, give use please write down the full path
"object.method"
warning message you would like to give to the particular callExpression.
Example:
//myFile.test.tsx
it('all elements are loaded correctly', (done) => {
const wrapper = mount(<SomeComponent {...someComponentParams} />);
// not allowed
setTimeout(
() => {
expect(...)
}, 0);
});
Example usage:
{
"disallowed-in-tests": [
true,
{"name": "setTimeout", "message": "no setTimeout allow in test files"}
]
}
Prints out a warning, that you should not be using mount
and toMatchSnapshot
in the same test case.
Example
//myFile.test.tsx
// not allowed
it('all elements are loaded correctly', () => {
const wrapper = mount(<SomeComponent {...someComponentParams} />);
expect(enzymeToJson(wrapper)).toMatchSnapshot();
});
// allowed
it('all elements are loaded correctly', () => {
const wrapper = shallow(<SomeComponent {...someComponentParams} />);
expect(enzymeToJson(wrapper)).toMatchSnapshot();
});
// allowed
it('all elements are loaded correctly', () => {
const wrapper = mount(<SomeComponent {...someComponentParams} />);
expect(wrapper.find(myComponent).length).toBe(1);;
});
Example usage:
"no-mount-and-snapshot": true,
Prints out a warning, that you should not be using tripple equals with null (and optionaly undefined). Supports auto fix.
Example
//myFile.test.tsx
// not allowed
const x = "" === null;
// not allowed
const x = "" !== null;
// allowed
const x = "" === undefined;
/**
* with option "no-undefined-check"
*/
// not allowed
const x = "" === undefined;
// not allowed
const x = "" !== undefined;
// not allowed
const x = "" == undefined;
// not allowed
const x = "" != undefined;
Example usage:
"no-triple-equals-null": [true, "no-undefined-check"]