UNPKG

58 kBMarkdownView Raw
1# tslint-microsoft-contrib
2
3[![npm version](https://badge.fury.io/js/tslint-microsoft-contrib.svg)](https://badge.fury.io/js/tslint-microsoft-contrib)
4[![Downloads](https://img.shields.io/npm/dm/tslint-microsoft-contrib.svg)](https://npmjs.org/package/tslint-microsoft-contrib)
5[![Build Status](https://travis-ci.org/Microsoft/tslint-microsoft-contrib.svg?branch=master)](https://travis-ci.org/Microsoft/tslint-microsoft-contrib)
6[![Join the chat at https://gitter.im/Microsoft/tslint-microsoft-contrib](https://badges.gitter.im/Join%20Chat.svg)](https://gitter.im/Microsoft/tslint-microsoft-contrib?utm_source=badge&utm_medium=badge&utm_campaign=pr-badge&utm_content=badge)
7
8A set of [TSLint](https://github.com/palantir/tslint) rules used on some Microsoft projects.
9
10## Installation
11
12```shell
13npm install tslint-microsoft-contrib --save-dev
14```
15
16## TSLint and corresponding tslint-microsoft-contrib version
17
18| TSLint version | tslint-microsoft-contrib version |
19| -------------- | ----------------------------------------------------- |
20| **>= 5.x** | 5.x and 6.x (supporting TypeScript 2.3.x, >=2.4, 3.x) |
21| **>= 4.x** | 4.x (supporting TypeScript 2.1.x) |
22| **>= 3.2.x** | 2.x |
23| **3.1.x** | unsupported |
24| **3.0.x** | unsupported |
25| **2.x** | 1.x |
26
27## Configuration
28
29Add `"node_modules/tslint-microsoft-contrib"` under your `"rulesDirectory"` configuration to inform TSLint it should look under this package for additional rules in your `tslint.json`:
30
31```json
32{
33 "rulesDirectory": ["node_modules/tslint-microsoft-contrib"],
34 "rules": {
35 // ...
36 }
37}
38```
39
40### Which Rules Should I Turn On?
41
42There certainly are a lot of options!
43
44If you extend from one of the following configurations, `rulesDirectory` will have `node_modules/tslint-microsoft-contrib` included for you.
45
46> Please note, some of the default ruleset rules require the `--project` TSLint option.
47
48#### Recommended
49
50To start, you can enable our stable "recommended" defaults that come with tslint-microsoft-contrib ([recommended.json](./configs/recommended.json)) by adding `"tslint-microsoft-contrib/recommended"` under `"extends"` in your `tslint.json`:
51
52```json
53{
54 "extends": ["tslint-microsoft-contrib/recommended"]
55 // ...
56}
57```
58
59These rules will not be added to in minor or patch releases, but will be in major releases.
60
61#### Latest
62
63To run with the latest and greatest rules ([latest.json](./configs/latest.json)), extend from `tslint-microsoft-contrib/latest`:
64
65```json
66{
67 "extends": ["tslint-microsoft-contrib/latest"]
68 // ...
69}
70```
71
72These rules will not be added to in patch releases, but will be in minor releases.
73
74#### Legacy
75
76The old "recommended" ruleset that ships by extending `tslint-microsoft-contrib` itself contains a list of rules that includes core TSLint rules.
77
78To start, you can enable our recommended defaults ([recommended.json](./configs/recommended.json)) by adding just `"tslint-microsoft-contrib"` under `"extends"` in your `tslint.json`:
79
80```json
81{
82 "extends": ["tslint-microsoft-contrib"]
83 // ...
84}
85```
86
87**This ruleset is considered legacy**; it is generally preferable to extend from the 'recommended' or 'latest' rulesets.
88We recommend you instead explicitly include `tslint:recommended`, `tslint:latest`, or `tslint:all` in your `tslint.json` rather than enable core rules through this configuration.
89
90In the next major version of TSLint, this will instead be an alias for `"tslint-microsoft-contrib/recommended"`.
91
92### Overriding Configurations
93
94You can [disable rules](https://palantir.github.io/tslint/usage/rule-flags) you don't find useful.
95
96If you rely on version ranges in your dependencies then you may find that new rules being added to the product create violations and fail your build.
97We recommend you specify exact versions of lint libraries, including `tslint-microsoft-contrib`, in your `package.json`.
98
99### Supported Rules
100
101<table>
102 <thead>
103 <th>Rule Name</th>
104 <th>Description</th>
105 <th>Since</th>
106 </thead>
107 <tbody>
108 <tr>
109 <td>
110 <code>chai-prefer-contains-to-index-of</code>
111 </td>
112 <td>
113 Avoid Chai assertions that invoke indexOf and compare for a -1 result.
114 It is better to use the chai .contain() assertion API instead because the failure message will be clearer if the test fails.
115 </td>
116 <td>2.0.10</td>
117 </tr>
118 <tr>
119 <td>
120 <code>chai-vague-errors</code>
121 </td>
122 <td>
123 Avoid Chai assertions that result in vague errors.
124 For example, asserting <code>expect(something).to.be.true</code> will result in the failure message "Expected true received false".
125 This is a vague error message that does not reveal the underlying problem.
126 It is especially vague in TypeScript because stack trace line numbers often do not match the source code.
127 A better pattern to follow is the xUnit Patterns <a href="http://xunitpatterns.com/Assertion%20Message.htm">Assertion Message</a> pattern.
128 The previous code sample could be better written as <code>expect(something).to.equal(true, 'expected something to have occurred');</code>
129 </td>
130 <td>1.0</td>
131 </tr>
132 <tr>
133 <td>
134 <code>export-name</code>
135 </td>
136 <td>
137 The name of the exported module must match the filename of the source file.
138 This is case-insensitive by default but ignores file extension.
139 It can be configured to be case-insensitive or to allow names matching a regex.
140 For example, to allow names that differ only in case and an exported name like myChartOptions, then configure the rule like this: <code>"export-name": [true, { "ignore-case": true, "allow": ["myChartOptions"] }]</code>.
141 You can also just give a list of allowed names, like <code>"export-name": [true, "myChartOptions"]</code>.
142 </td>
143 <td>0.0.3</td>
144 </tr>
145 <tr>
146 <td>
147 <code>function-name</code>
148 </td>
149 <td>
150 Applies a naming convention to function names and method names.
151 You can configure the naming convention by passing parameters.
152 Please note, the private-method-regex does take precedence over the static-method-regex, so a private static method must match the private-method-regex.
153 The default values are:
154 <code>
155 [ true, {
156 "method-regex": "^[a-z][\\w\\d]+$",
157 "private-method-regex": "^[a-z][\\w\\d]+$",
158 "protected-method-regex": "^[a-z][\\w\\d]+$",
159 "static-method-regex": "^[A-Z_\\d]+$",
160 "function-regex": "^[a-z][\\w\\d]+$"
161 } ]
162 </code>
163 This rule has some overlap with the [tslint variable-name rule](https://palantir.github.io/tslint/rules/variable-name/); however, the rule here is more configurable.
164 </td>
165 <td>2.0.7, 2.0.14</td>
166 </tr>
167 <tr>
168 <td>
169 <code>import-name</code>
170 </td>
171 <td>
172 The name of the imported module must match the name of the thing being imported. For special characters (<code>-</code>, <code>.</code>, <code>_</code>) remove them and make the following character uppercase.
173 For example, it is valid to name imported modules the same as the module name: <code>import Service = require('x/y/z/Service')</code> and <code>import Service from 'x/y/z/Service'</code>.
174 But it is invalid to change the name being imported, such as: <code>import MyCoolService = require('x/y/z/Service')</code> and <code>import MyCoolService from 'x/y/z/Service'</code>.
175 When containing special characters such as <code>import $$ from 'my-awesome_library';</code> the corresponding configuration would look like <code>'import-name': [true, { 'myAwesomeLibrary': '$$' }]</code>.
176 Since version 2.0.9 it is possible to configure this rule with a list of exceptions.
177 For example, to allow <code>underscore</code> to be imported as <code>_</code>, add this configuration: <code>'import-name': [ true, { 'underscore': '_' }]</code>
178 </td>
179 <td>2.0.5</td>
180 </tr>
181 <tr>
182 <td>
183 <code>informative-docs</code>
184 </td>
185 <td>
186 Enforces that comments do more than just reiterate names of objects.
187 Either be informative with comments or don't include a comment.
188 You can override the default list of "useless" words ignored by the comment checker like <code>"informative-docs": [true, { "useless-words": ["a", "an", "the", "text" ] } ]</code>.
189 You can indicate words as synonyms (aliases) of each other like <code>"informative-docs": [true, { "aliases": { text: ["emoji", "smiley"] } ]</code>.
190 </td>
191 <td>6.0.0-beta</td>
192 </tr>
193 <tr>
194 <td>
195 <code>insecure-random</code>
196 </td>
197 <td>
198 Do not use insecure sources for random bytes.
199 Use a secure random number generator instead.
200 Bans all uses of <code>Math.random</code> and <code>crypto.pseudoRandomBytes</code>.
201 Better alternatives are <code>crypto.randomBytes</code> and <code>window.crypto.getRandomValues</code>.
202 <br />
203 References:
204 <ul>
205 <li><a href="https://cwe.mitre.org/data/definitions/330.html">CWE 330</a></li>
206 <li><a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Math/random">MDN Math.random</a></li>
207 <li><a href="https://nodejs.org/api/crypto.html#crypto_crypto_randombytes_size_callback"><code>Node.js crypto.randomBytes()</code></a></li>
208 <li><a href-"https://developer.mozilla.org/en-US/docs/Web/API/window.crypto.getRandomValues"><code>window.crypto.getRandomValues()</code></a></li>
209 </ul>
210 </td>
211 <td>2.0.11</td>
212 </tr>
213 <tr>
214 <td>
215 <code>jquery-deferred-must-complete</code>
216 </td>
217 <td>
218 When a JQuery Deferred instance is created, then either <code>reject()</code> or <code>resolve()</code> must be called on it within all code branches in the scope.
219 For more examples see the <a href="https://github.com/Microsoft/tslint-microsoft-contrib/issues/26">feature request</a>.
220 </td>
221 <td>1.0</td>
222 </tr>
223 <tr>
224 <td>
225 <code>max-func-body-length</code>
226 </td>
227 <td>
228 Avoid long functions.
229 The line count of a function body must not exceed the value configured within this rule's options.
230 <br />
231 You can set up a general max function body length applied for every function/method/arrow function e.g. <code>[true, 30]</code> or set different maximum length for every type e.g. <code>[true, { "func-body-length": 10 , "func-expression-body-length": 10 , "arrow-body-length": 5, "method-body-length": 15, "ctor-body-length": 5 }]</code>.
232 To specify a function name whose parameters you can ignore for this rule, pass a regular expression as a string(this can be useful for Mocha users to ignore the <code>describe()</code> function).
233 Since version 2.0.9, you can also ignore single- and multi-line comments from the total function length, eg. <code>[true, <code>{ "ignore-comments": true }]</code>.
234 </td>
235 <td>2.0.3</td>
236 </tr>
237 <tr>
238 <td>
239 <code>missing-jsdoc</code>
240 </td>
241 <td>
242 Deprecated - This rule can be replaced with TSLint's <code>file-header</code> rule.
243 All files must have a top level [JSDoc](http://usejsdoc.org/) comment.
244 A JSDoc comment starts with /** (not one more or one less asterisk) and a JSDoc at the 'top-level' appears without leading spaces.
245 Trailing spaces are acceptable but not recommended
246 </td>
247 <td>1.0</td>
248 </tr>
249 <tr>
250 <td>
251 <code>missing-optional-annotation</code>
252 </td>
253 <td>
254 Deprecated - This rule is now enforced by the TypeScript compiler.
255 A parameter that follows one or more parameters marked as optional is not itself marked optional.
256 </td>
257 <td>0.0.1</td>
258 </tr>
259 <tr>
260 <td>
261 <code>mocha-avoid-only</code>
262 </td>
263 <td>
264 Do not invoke Mocha's <code>describe.only</code>, <code>it.only</code>, or <code>context.only</code> functions.
265 These functions are useful ways to run a single unit test or a single test case during your build, but please be careful to not push these methods calls to your version control repository because it will turn off any of the other tests.
266 </td>
267 <td>1.0</td>
268 </tr>
269 <tr>
270 <td>
271 <code>mocha-no-side-effect-code</code>
272 </td>
273 <td>
274 All test logic in a Mocha test case should be within Mocha lifecycle method and not defined statically to execute when the module loads.
275 Put all assignments and initialization statements in a <code>before()</code>, <code>beforeEach()</code>, <code>beforeAll()</code>, <code>after()</code>, <code>afterEach()</code>, <code>afterAll()</code>, or <code>it()</code> function.
276 Code executed outside of these lifecycle methods can throw exceptions before the test runner is initialized and can result in errors or even test runner crashes.
277 This rule can be configured with a regex to ignore certain initializations.
278 For example, to ignore any calls to <code>RestDataFactory</code> configure the rule with: <code>[true, { ignore: '^RestDataFactory\\..*' }]</code>
279 </td>
280 <td>2.0.10</td>
281 </tr>
282 <tr>
283 <td>
284 <code>mocha-unneeded-done</code>
285 </td>
286 <td>
287 A function declares a MochaDone parameter but only resolves it synchronously in the main function.
288 The MochaDone parameter can be safely removed from the parameter list.
289 </td>
290 <td>2.0.10</td>
291 </tr>
292 <tr>
293 <td>
294 <code>no-backbone-get-set-outside-model</code>
295 </td>
296 <td>
297 Avoid using <code>model.get('x')</code> and <code>model.set('x', value)</code> Backbone accessors outside of the owning model.
298 This breaks type safety and you should define getters and setters for your attributes instead.
299 </td>
300 <td>1.0</td>
301 </tr>
302 <tr>
303 <td>
304 <code>no-banned-terms</code>
305 </td>
306 <td>
307 Do not use banned terms:
308 <ul>
309 <li><a href="https://msdn.microsoft.com/library/7t96kt3h(v=vs.94).aspx">caller</a></li>
310 <li><a href="https://msdn.microsoft.com/library/334e1zza(v=vs.94).aspx">callee</a></li>
311 <li><a href="https://msdn.microsoft.com/library/12k71sw7(v=vs.94).aspx">eval</a></li>
312 <li><a href="https://msdn.microsoft.com/library/he95z461(v=vs.94).aspx">arguments</a>
313 </ul>
314 These terms refer to functions or properties that should not be used, so it is best practice to simply avoid them.
315 </td>
316 <td>0.0.1</td>
317 </tr>
318 <tr>
319 <td>
320 <code>no-constant-condition</code>
321 </td>
322 <td>
323 Do not use constant expressions in conditions.
324 Similar to the [ESLint no-constant-condition](https://eslint.org/docs/rules/no-constant-condition) rule.
325 Since version 2.0.14, this rule accepts a parameter called <code>checkLoops</code> which defaults to true.
326 If set to false then loops are not checked for conditionals.
327 For example, disable loop checking with <code>[ true, { 'checkLoops': false } ]</code>.
328 </td>
329 <td>1.0, 2.0.14</td>
330 </tr>
331 <tr>
332 <td>
333 <code>no-control-regex</code>
334 </td>
335 <td>Do not use control characters in regular expressions . Similar to the [ESLint no-control-regex](https://eslint.org/docs/rules/no-control-regex) rule</td>
336 <td>1.0</td>
337 </tr>
338 <tr>
339 <td>
340 <code>no-cookies</code>
341 </td>
342 <td>Do not use cookies.</td>
343 <td>0.0.1</td>
344 </tr>
345 <tr>
346 <td>
347 <code>no-delete-expression</code>
348 </td>
349 <td>
350 Do not delete expressions.
351 Only properties should be deleted.
352 </td>
353 <td>0.0.2</td>
354 </tr>
355 <tr>
356 <td>
357 <code>no-disable-auto-sanitization</code>
358 </td>
359 <td>
360 Do not disable auto-sanitization of HTML because this opens up your page to an XSS attack.
361 Specifically, do not use the <a href="https://msdn.microsoft.com/en-us/library/windows/apps/hh767331.aspx">execUnsafeLocalFunction</a> or <a href="https://msdn.microsoft.com/en-us/library/windows/apps/br211696.aspx">setInnerHTMLUnsafe</a> functions.
362 </td>
363 <td>0.0.1</td>
364 </tr>
365 <tr>
366 <td>
367 <code>no-document-domain</code>
368 </td>
369 <td>
370 Do not write to <code>document.domain</code>.
371 Scripts setting document.domain to any value should be validated to ensure that the value is on a list of allowed sites.
372 Also, if your site deals with PII in any way then document.domain must not be set to a top-level domain (for example, live.com) but only to an appropriate subdomain (for example, billing.live.com).
373 If you are absolutely sure that you want to set document.domain then add a tslint suppression comment for the line.
374 For more information see the [Phase 4 Verification page of the Microsoft SDL](https://msdn.microsoft.com/en-us/library/cc307418.aspx).
375 </td>
376 <td>2.0.3</td>
377 </tr>
378 <tr>
379 <td>
380 <code>no-document-write</code>
381 </td>
382 <td>Do not use document.write</td>
383 <td>0.0.1</td>
384 </tr>
385 <tr>
386 <td>
387 <code>no-duplicate-case</code>
388 </td>
389 <td>
390 Deprecated - This rule can be replaced with TSLint's no-duplicate-switch-case.
391 Do not use duplicate case labels in switch statements.
392 Similar to the <a href="https://eslint.org/docs/rules/no-duplicate-case.html">ESLint no-duplicate-case</a> rule.
393 </td>
394 <td>1.0</td>
395 </tr>
396 <tr>
397 <td>
398 <code>no-duplicate-parameter-names</code>
399 </td>
400 <td>
401 Deprecated - This rule is now enforced by the TypeScript compiler.
402 Do not write functions or methods with duplicate parameter names.
403 </td>
404 <td>0.0.1</td>
405 </tr>
406 <tr>
407 <td>
408 <code>no-empty-interfaces</code>
409 </td>
410 <td>
411 Deprecated - This rule can be replaced with TSLint's no-empty-interface.
412 Do not use empty interfaces.
413 They are compile-time only artifacts and they serve no useful purpose.
414 </td>
415 <td>1.0</td>
416 </tr>
417 <tr>
418 <td>
419 <code>no-empty-line-after-opening-brace</code>
420 </td>
421 <td>Avoid an empty line after an opening brace.</td>
422 <td>2.0.6</td>
423 </tr>
424 <tr>
425 <td>
426 <code>no-exec-script</code>
427 </td>
428 <td>Do not use the execScript functions</td>
429 <td>0.0.1</td>
430 </tr>
431 <tr>
432 <td>
433 <code>no-for-in</code>
434 </td>
435 <td>
436 Avoid use of for-in statements.
437 They can be replaced by Object.keys.
438 </td>
439 <td>1.0</td>
440 </tr>
441 <tr>
442 <td>
443 <code>no-function-constructor-with-string-args</code>
444 </td>
445 <td>
446 Deprecated - This rule is in the TSLint product as <code>function-constructor</code>.
447 Do not use the version of the Function constructor that accepts a string argument to define the body of the function.
448 </td>
449 <td>0.0.1</td>
450 </tr>
451 <tr>
452 <td>
453 <code>no-function-expression</code>
454 </td>
455 <td>
456 Do not use function expressions; use arrow functions (lambdas) instead.
457 In general, lambdas are simpler to use and avoid the confusion about what the 'this' references points to.
458 Function expressions that contain a 'this' reference are allowed and will not create a failure.
459 </td>
460 <td>1.0</td>
461 </tr>
462 <tr>
463 <td>
464 <code>no-http-string</code>
465 </td>
466 <td>
467 Do not use strings that start with 'http:'.
468 URL strings should start with 'https:'.
469 Http strings can be a security problem and indicator that your software may suffer from cookie-stealing attacks.
470 Since version 1.0, this rule takes a list of regular expressions as a parameter.
471 Any string matching that regular expression will be ignored.
472 For example, to allow http connections to example.com and examples.com, configure your rule like this: <code>"no-http-string": [true, "http://www.example.com/?.*", "http://www.examples.com/?.*"]</code>.
473 </td>
474 <td>0.0.3</td>
475 </tr>
476 <tr>
477 <td>
478 <code>no-increment-decrement</code>
479 </td>
480 <td>
481 Deprecated - This rule is in the TSLint product as <code>increment-decrement</code>.
482 Avoid use of increment and decrement operators particularly as part of complicated expressions.
483 </td>
484 <td>0.0.1</td>
485 </tr>
486 <tr>
487 <td>
488 <code>no-inner-html</code>
489 </td>
490 <td>
491 Do not write values to innerHTML, outerHTML, or set HTML using the JQuery html() function.
492 Writing values to innerHTML can expose your website to XSS injection attacks.
493 All strings must be escaped before being rendered to the page.
494 </td>
495 <td>2.0.4</td>
496 </tr>
497 <tr>
498 <td>
499 <code>no-invalid-regexp</code>
500 </td>
501 <td>
502 Do not use invalid regular expression strings in the RegExp constructor.
503 Similar to the <a href="https://eslint.org/docs/rules/no-invalid-regexp.html">ESLint no-invalid-regexp</a> rule.
504 </td>
505 <td>1.0</td>
506 </tr>
507 <tr>
508 <td>
509 <code>no-jquery-raw-elements</code>
510 </td>
511 <td>
512 Do not create HTML elements using JQuery and string concatenation.
513 It is error prone and can hide subtle defects.
514 Instead use the JQuery element API.
515 </td>
516 <td>2.0.8</td>
517 </tr>
518 <tr>
519 <td>
520 <code>no-missing-visibility-modifiers</code>
521 </td>
522 <td>
523 Deprecated - This rule is in the TSLint product as <code>member-access</code>.
524 Class members (both fields and methods) should have visibility modifiers specified.
525 The Principle of Least Visibility guides us to prefer private methods and fields when possible.
526 If a developer forgets to add a modifier then TypeScript assumes the element should be public, which is the wrong default choice.
527 </td>
528 <td>1.0</td>
529 </tr>
530 <tr>
531 <td>
532 <code>no-multiline-string</code>
533 </td>
534 <td>Do not declare multiline strings</td>
535 <td>0.0.1</td>
536 </tr>
537 <tr>
538 <td>
539 <code>no-multiple-var-decl</code>
540 </td>
541 <td>
542 Deprecated - This rule is now part of the base TSLint product as the rule named 'one-variable-per-declaration'.
543 Do not use comma separated variable declarations.
544 </td>
545 <td>1.0</td>
546 </tr>
547 <tr>
548 <td>
549 <code>no-octal-literal</code>
550 </td>
551 <td>Do not use octal literals or escaped octal sequences.</td>
552 <td>0.0.1</td>
553 </tr>
554 <tr>
555 <td>
556 <code>no-regex-spaces</code>
557 </td>
558 <td>
559 Do not use multiple spaces in a regular expression literal.
560 Similar to the <a href="https://eslint.org/docs/rules/no-regex-spaces.html">ESLint no-regex-spaces</a> rule.
561 </td>
562 <td>1.0</td>
563 </tr>
564 <tr>
565 <td>
566 <code>no-relative-imports</code>
567 </td>
568 <td>
569 Do not use relative paths when importing external modules or ES6 import declarations.
570 The advantages of removing all relative paths from imports is that:
571 <ul>
572 <li>The import name will be consistent across all files and subdirectories so searching for usages is much easier.</li>
573 <li>Moving source files to different folders will not require you to edit your import statements.</li>
574 <li>3) It will be possible to copy and paste import lines between files regardless of the file location.</li>
575 <li>4) version control diffs will be simplified by having overall fewer edits to the import lines.</li>
576 </ul>
577 Option <code>allow-siblings</code> can be passed to allow relative imports for files in the same or nested folders.
578 <br />
579 Note: we don't often recommend this rule.
580 See <a href="https://github.com/Microsoft/tslint-microsoft-contrib/issues/435">#435</a> for discussion.
581 </td>
582 <td>2.0.5</td>
583 </tr>
584 <tr>
585 <td>
586 <code>no-reserved-keywords</code>
587 </td>
588 <td>
589 Deprecated - This rule can be replaced with TSLint's variable-name.
590 Do not use reserved keywords as names of local variables, fields, functions, or other identifiers.
591 Since version 2.0.9 this rule accepts a parameter called <code>allow-quoted-properties</code>.
592 If true, interface properties in quotes will be ignored.
593 This can be a useful way to avoid verbose suppress-warning comments for generated d.ts files.
594 <br/>
595 This rule has some overlap with the <a href="https://palantir.github.io/tslint/rules/variable-name">tslint variable-name rule</a>; however, the rule here finds more keywords and more usages.
596 </td>
597 <td>0.0.1, 2.0.9</td>
598 </tr>
599 <tr>
600 <td>
601 <code>no-single-line-block-comment</code>
602 </td>
603 <td>
604 Avoid single line block comments and use single line comments instead.
605 Block comments do not nest properly and have no advantages over normal single-line comments.
606 </td>
607 <td>2.0.10</td>
608 </tr>
609 <tr>
610 <td>
611 <code>no-stateless-class</code>
612 </td>
613 <td>
614 Deprecated - This rule can be replaced with TSLint's no-unnecessary-class.
615 A stateless class represents a failure in the object oriented design of the system.
616 A class without state is better modeled as a module or given some state.
617 A stateless class is defined as a class with only static members and no parent class.
618 </td>
619 <td>2.0.4</td>
620 </tr>
621 <tr>
622 <td>
623 <code>no-string-based-set-immediate</code>
624 </td>
625 <td>
626 Do not use the version of setImmediate that accepts code as a string argument.
627 However, it is acceptable to use the version of setImmediate where a direct reference to a function is provided as the callback argument.
628 </td>
629 <td>0.0.1</td>
630 </tr>
631 <tr>
632 <td>
633 <code>no-string-based-set-interval</code>
634 </td>
635 <td>
636 Do not use the version of setInterval that accepts code as a string argument.
637 However, it is acceptable to use the version of setInterval where a direct reference to a function is provided as the callback argument.
638 </td>
639 <td>0.0.1</td>
640 </tr>
641 <tr>
642 <td>
643 <code>no-string-based-set-timeout</code>
644 </td>
645 <td>
646 Do not use the version of setTimeout that accepts code as a string argument.
647 However, it is acceptable to use the version of setTimeout where a direct reference to a function is provided as the callback argument.
648 </td>
649 <td>0.0.1</td>
650 </tr>
651 <tr>
652 <td>
653 <code>no-suspicious-comment</code>
654 </td>
655 <td>
656 Do not use suspicious comments, such as BUG, HACK, FIXME, LATER, LATER2, TODO.
657 We recommend that you run this rule before each release as a quality checkpoint.
658 Reference: <a href="https://cwe.mitre.org/data/definitions/546.html">CWE-546 Suspicious Comment</a>.
659 </td>
660 <td>2.0.11</td>
661 </tr>
662 <tr>
663 <td>
664 <code>no-typeof-undefined</code>
665 </td>
666 <td>
667 Do not use the idiom <code>typeof x === 'undefined'</code>.
668 You can safely use the simpler <code>x === undefined</code> or perhaps <code>x == null</code> if you want to check for either null or undefined.
669 </td>
670 <td>2.0.8</td>
671 </tr>
672 <tr>
673 <td>
674 <code>no-unexternalized-strings</code>
675 </td>
676 <td>
677 Ensures that double quoted strings are passed to a localize call to provide proper strings for different locales.
678 The rule can be configured using an object literal as documented in the <a href="https://github.com/Microsoft/tslint-microsoft-contrib/issues/95#issuecomment-173149989">feature request</a>.
679 </td>
680 <td>2.0.1</td>
681 </tr>
682 <tr>
683 <td>
684 <code>no-unnecessary-bind</code>
685 </td>
686 <td>
687 Deprecated - This rule is in the TSLint product as <code>unnecessary-bind</code>.
688 Do not bind 'this' as the context for a function literal or lambda expression.
689 If you bind 'this' as the context to a function literal, then you should just use a lambda without the bind.
690 If you bind 'this' as the context to a lambda, then you can remove the bind call because 'this' is already the context for lambdas.
691 Works for Underscore methods as well.
692 </td>
693 <td>1.0</td>
694 </tr>
695 <tr>
696 <td>
697 <code>no-unnecessary-field-initialization</code>
698 </td>
699 <td>
700 Do not unnecessarily initialize the fields of a class to values they already have.
701 For example, there is no need to explicitly set a field to <code>undefined</code> in the field's initialization or in the class' constructor.
702 Also, if a field is initialized to a constant value (null, a string, a boolean, or some number) then there is no need to reassign the field to this value within the class constructor.
703 </td>
704 <td>2.0.9</td>
705 </tr>
706 <tr>
707 <td>
708 <code>no-unnecessary-local-variable</code>
709 </td>
710 <td>
711 Do not declare a variable only to return it from the function on the next line.
712 It is always less code to simply return the expression that initializes the variable.
713 </td>
714 <td>2.0.4</td>
715 </tr>
716 <tr>
717 <td>
718 <code>no-unnecessary-override</code>
719 </td>
720 <td>
721 Do not write a method that only calls super() on the parent method with the same arguments.
722 You can safely remove methods like this and Javascript will correctly dispatch the method to the parent object.
723 </td>
724 <td>2.0.4</td>
725 </tr>
726 <tr>
727 <td>
728 <code>no-unnecessary-semicolons</code>
729 </td>
730 <td>Remove unnecessary semicolons.</td>
731 <td>0.0.1</td>
732 </tr>
733 <tr>
734 <td>
735 <code>no-unsupported-browser-code</code>
736 </td>
737 <td>
738 Avoid writing browser-specific code for unsupported browser versions.
739 Browser versions are specified in the rule configuration options, eg: <code>[true, [ "IE 11", "Firefox > 40", "Chrome >= 45" ] ]</code>.
740 Browser-specific blocks of code can then be designated with a single-line comment, like so: <code>// Browser specific: IE 10</code>, or with a jsdoc like this: <code>@browserspecific chrome 40</code>.</td>
741 <td>2.0.10</td>
742 </tr>
743 <tr>
744 <td>
745 <code>no-useless-files</code>
746 </td>
747 <td>
748 Avoid keeping files around that only contain commented out code, are completely empty, or only contain whitespace characters.
749 </td>
750 <td>4.0.2</td>
751 </tr>
752 <tr>
753 <td>
754 <code>no-var-self</code>
755 </td>
756 <td>
757 Deprecated - This rule can be replaced with TSLint's no-this-assignment.
758 Do not use <code>var self = this</code>; instead, manage scope with arrow functions/lambdas.
759 Self variables are a common practice in JavaScript but can be avoided in TypeScript.
760 By default the rule bans any assignments of the <code>this</code> reference.
761 If you want to enforce a naming convention or allow some usages then configure the rule with a regex.
762 By default the rule is configured with <code>(?!)</code> which matches nothing.
763 You can pass <code>^self$</code> to allow variables named self or pass <code>^(?!self$)</code> to allow anything other than self, for example.
764 </td>
765 <td>2.0.8</td>
766 </tr>
767 <tr>
768 <td>
769 <code>no-with-statement</code>
770 </td>
771 <td>
772 Do not use <code>with</code> statements.
773 Assign the item to a new variable instead.
774 </td>
775 <td>0.0.1</td>
776 </tr>
777 <tr>
778 <td>
779 <code>non-literal-fs-path</code>
780 </td>
781 <td>
782 Detect <code>fs</code> function calls with a non literal filepath.
783 For security reasons, it may be best to only pass string literals as filesystem paths.
784 Otherwise, it may be possible for an attacker to read and write arbitrary files on your system through path traversal attacks.
785 </td>
786 <td>6.0.0-beta</td>
787 </tr>
788 <tr>
789 <td>
790 <code>non-literal-require</code>
791 </td>
792 <td>
793 Detect <code>require()</code> function calls for something that is not a string literal.
794 For security reasons, it may be best to only <code>require()</code> string literals.
795 Otherwise, it may be possible for an attacker to somehow change the value and download arbitrary Javascript into your page.
796 </td>
797 <td>2.0.14</td>
798 </tr>
799 <tr>
800 <td>
801 <code>possible-timing-attack</code>
802 </td>
803 <td>
804 Avoid timing attacks by not making direct string comparisons to sensitive data.
805 Do not compare against variables named password, secret, api, apiKey, token, auth, pass, or hash.
806 For more info see [Using Node.js Event Loop for Timing Attacks](https://snyk.io/blog/node-js-timing-attack-ccc-ctf).
807 </td>
808 <td>2.0.11</td>
809 </tr>
810 <tr>
811 <td>
812 <code>prefer-array-literal</code>
813 </td>
814 <td>
815 Use array literal syntax when declaring or instantiating array types.
816 For example, prefer the Javascript form of <code>string[]</code> to the TypeScript form <code>Array&lt;string&gt;</code>.
817 Prefer <code>[]' to <code>new Array()</code>.
818 Prefer <code>[4, 5]' to <code>new Array(4, 5)</code>.
819 Prefer <code>[undefined, undefined]' to <code>new Array(2)</code>.
820 Since 2.0.10, this rule can be configured to allow Array type parameters.
821 To ignore type parameters, configure the rule with the values: <code>[ true, { 'allow-type-parameters': true } ]</code>.
822 <br />
823 This rule has some overlap with the <a href="https://palantir.github.io/tslint/rules/array-type">TSLint array-type rule</a>; however, the version here catches more instances.
824 </td>
825 <td>1.0, 2.0.10</td>
826 </tr>
827 <tr>
828 <td>
829 <code>prefer-type-cast</code>
830 </td>
831 <td>
832 Prefer the tradition type casts instead of the new 'as-cast' syntax.
833 For example, prefer <code>&lt;string&gt;myVariable</code> instead of <code>myVariable as string<code>.
834 Rule ignores any file ending in .tsx.
835 If you prefer the opposite and want to see the <code>as</code> type casts, then enable the tslint rule named 'no-angle-bracket-type-assertion'.
836 </td>
837 <td>2.0.4</td>
838 </tr>
839 <tr>
840 <td>
841 <code>promise-must-complete</code>
842 </td>
843 <td>
844 When a Promise instance is created, then either the reject() or resolve() parameter must be called on it within all code branches in the scope.
845 For more examples see the <a href="https://github.com/Microsoft/tslint-microsoft-contrib/issues/34">feature request</a>.
846 <br /><br />
847 This rule has some overlap with the <a href="https://palantir.github.io/tslint/rules/no-floating-promises">tslint no-floating-promises rule</a>, but they are substantially different.
848 </td>
849 <td>1.0</td>
850 </tr>
851 <tr>
852 <td>
853 <code>react-a11y-accessible-headings</code>
854 </td>
855 <td>
856 For accessibility of your website, there should be no more than 2 H1 heading elements, HTML heading elements must be concise, used for structuring information on the page and non-empty.
857 </td>
858 <td>6.0.0</td>
859 </tr>
860 <tr>
861 <td>
862 <code>react-a11y-anchors</code>
863 </td>
864 <td>
865 For accessibility of your website, anchor element link text should be at least 4 characters long.
866 Links with the same HREF should have the same link text.
867 Links that point to different HREFs should have different link text.
868 This can be relaxed to allow differences in cases using <code>ignore-case</code> option.
869 You can also allow differences in leading/trailing whitespace by adding <code>{"ignore-whitespace": "trim"}</code> option or all whitespace by adding <code>{"ignore-whitespace": "all"}</code> option.
870 Links with images and text content, the alt attribute should be unique to the text content or empty.
871 An an anchor element's href prop value must not be undefined, null, or just #.
872 <br />
873 References:
874 <ul>
875 <li><a href="http://oaa-accessibility.org/wcag20/rule/38">WCAG Rule 38: Link text should be as least four 4 characters long</a></li>
876 <li><a href="http://oaa-accessibility.org/wcag20/rule/39">WCAG Rule 39: Links with the same HREF should have the same link text</a></li>
877 <li><a href="http://oaa-accessibility.org/wcag20/rule/41">WCAG Rule 41: Links that point to different HREFs should have different link text</a></li>
878 <li><a href="http://oaa-accessibility.org/wcag20/rule/43">WCAG Rule 43: Links with images and text content, the alt attribute should be unique to the text content or empty</a></li>
879 </ul>
880 </td>
881 <td>2.0.11</td>
882 </tr>
883 <tr>
884 <td>
885 <code>react-a11y-aria-unsupported-elements</code>
886 </td>
887 <td>
888 For accessibility of your website, enforce that elements that do not support ARIA roles, states, and properties do not have those attributes.
889 </td>
890 <td>2.0.11</td>
891 </tr>
892 <tr>
893 <td>
894 <code>react-a11y-event-has-role</code>
895 </td>
896 <td>
897 For accessibility of your website, elements with event handlers must have explicit role or implicit role.
898 <br />
899 References:
900 <ul>
901 <li><a href="http://oaa-accessibility.org/wcag20/rule/94">WCAG Rule 94</a></li>
902 <li><a href="https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/ARIA_Techniques/Using_the_button_role">Using the button role</a></li>
903 </ul>
904 </td>
905 <td>2.0.11</td>
906 </tr>
907 <tr>
908 <td>
909 <code>react-a11y-iframes</code>
910 </td>
911 <td>
912 Enforce that iframe elements are not empty, have title, and are unique.
913 </td>
914 <td>6.1.0</td>
915 </tr>
916 <tr>
917 <td>
918 <code>react-a11y-image-button-has-alt</code>
919 </td>
920 <td>
921 For accessibility of your website, enforce that inputs element with <code>type="image"</code> must have non-empty alt attribute.
922 </td>
923 <td>2.0.11</td>
924 </tr>
925 <tr>
926 <td>
927 <code>react-a11y-img-has-alt</code>
928 </td>
929 <td>
930 Enforce that an <code>img</code> element contains the <code>alt</code> attribute or <code>role='presentation'</code> for a decorative image.
931 All images must have <code>alt</code> text to convey their purpose and meaning to screen reader users.
932 Besides, the <code>alt</code> attribute specifies an alternate text for an image, if the image cannot be displayed.
933 <br />
934 This rule accepts as a parameter a string array for tag names other than img to also check.
935 For example, if you use a custom tag named 'Image' then configure the rule with: <code>[true, ['Image']]</code>.
936 <br />
937 References:
938 <ul>
939 <li><a href="https://www.w3.org/TR/WCAG10/wai-pageauth.html#tech-text-equivalent">Web Content Accessibility Guidelines 1.0</a></li>
940 <li><a href="https://www.w3.org/TR/wai-aria/roles#presentation">ARIA Presentation Role</a></li>
941 <li><a href="http://oaa-accessibility.org/wcag20/rule/31">WCAG Rule 31: If an image has an alt or title attribute, it should not have a presentation role</a></li>
942 </ul>
943 </td>
944 <td>2.0.11</td>
945 </tr>
946 <tr>
947 <td>
948 <code>react-a11y-input-elements</code>
949 </td>
950 <td>
951 For accessibility of your website, HTML input boxes and text areas must include default, place-holding characters.
952 <br />
953 References:
954 <ul>
955 <li><a href="https://www.w3.org/TR/WAI-WEBCONTENT-TECHS/#tech-place-holders">WCAG 10.4</a></li>
956 <li><a href="https://www.w3.org/TR/WCAG10-HTML-TECHS/#forms-specific">WCAG 11.5</a></li>
957 </ul>
958 </td>
959 <td>6.0.0-beta</td>
960 </tr>
961 <tr>
962 <td>
963 <code>react-a11y-lang</code>
964 </td>
965 <td>
966 For accessibility of your website, HTML elements must have a lang attribute and the attribute must be a valid language code.
967 <br />
968 References:
969 <ul>
970 <li><a href="https://www.w3.org/TR/WCAG20-TECHS/H58.html">H58: Using language attributes to identify changes in the human language</a></li>
971 <li><a href="https://dequeuniversity.com/rules/axe/1.1/valid-lang">lang attribute must have a valid value</a></li>
972 <li><a href="https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes">List of ISO 639-1 codes</a></li>
973 </ul>
974 </td>
975 <td>2.0.11</td>
976 </tr>
977 <tr>
978 <td>
979 <code>react-a11y-meta</code>
980 </td>
981 <td>
982 For accessibility of your website, HTML meta elements must not have <code>http-equiv="refresh"</code>.
983 </td>
984 <td>2.0.11</td>
985 </tr>
986 <tr>
987 <td>
988 <code>react-a11y-no-onchange</code>
989 </td>
990 <td>
991 For accessibility of your website, enforce usage of onBlur over onChange on select menus.
992 References:
993 <ul>
994 <li><a href="http://cita.disability.uiuc.edu/html-best-practices/auto/onchange.php">OnChange Event Accessibility Issues</a></li>
995 <li><a href="https://www.w3.org/TR/WCAG10/wai-pageauth.html#gl-own-interface">Guideline 8. Ensure direct accessibility of embedded user interfaces.</a></li>
996 </ul>
997 </td>
998 <td>6.0.0-beta</td>
999 </tr>
1000 <tr>
1001 <td>
1002 <code>react-a11y-props</code>
1003 </td>
1004 <td>
1005 For accessibility of your website, enforce all <code>aria-*</code> attributes are valid.
1006 Elements cannot use an invalid <code>aria-*</code> attribute.
1007 This rule will fail if it finds an <code>aria-*</code> attribute that is not listed in <a href="https://www.w3.org/WAI/PF/aria/states_and_properties#state_prop_values">WAI-ARIA states and properties</a>.
1008 </td>
1009 <td>2.0.11</td>
1010 </tr>
1011 <tr>
1012 <td>
1013 <code>react-a11y-proptypes</code>
1014 </td>
1015 <td>
1016 For accessibility of your website, enforce the type of aria state and property values are correct.
1017 </td>
1018 <td>2.0.11</td>
1019 </tr>
1020 <tr>
1021 <td>
1022 <code>react-a11y-required</code>
1023 </td>
1024 <td>
1025 For accessibility of your website, enforce that required input elements have aria-required set to true.
1026 <br/>
1027 References:
1028 <ul>
1029 <li><a href="http://www.clarissapeterson.com/2012/11/html5-accessibility/">Acessibility in HTML5</a></li>
1030 </ul>
1031 </td>
1032 <td>6.0.0-beta</td>
1033 </tr>
1034 <tr>
1035 <td>
1036 <code>react-a11y-role</code>
1037 </td>
1038 <td>
1039 For accessibility of your website, elements with aria roles must use a **valid**, **non-abstract** aria role.
1040 A reference to role definitions can be found at [WAI-ARIA roles](https://www.w3.org/TR/wai-aria/roles#role_definitions).
1041 <br />
1042 References:
1043 <ul>
1044 <li><a href="http://oaa-accessibility.org/wcag20/rule/92">WCAG Rule 92: Role value must be valid</a></li>
1045 </ul>
1046 </td>
1047 <td>2.0.11</td>
1048 </tr>
1049 <tr>
1050 <td>
1051 <code>react-a11y-role-has-required-aria-props</code>
1052 </td>
1053 <td>
1054 For accessibility of your website, elements with aria roles must have all required attributes according to the role.
1055 <br />
1056 References:
1057 <ul>
1058 <li><a href="https://www.w3.org/TR/wai-aria/roles#role_definitions">ARIA Definition of Roles</a></li>
1059 <li><a href="http://oaa-accessibility.org/wcag20/rule/90">WCAG Rule 90: Required properties and states should be defined</a></li>
1060 <li><a href="http://oaa-accessibility.org/wcag20/rule/91">WCAG Rule 91: Required properties and states must not be empty</a></li>
1061 </ul>
1062 </td>
1063 <td>2.0.11</td>
1064 </tr>
1065 <tr>
1066 <td>
1067 <code>react-a11y-role-supports-aria-props</code>
1068 </td>
1069 <td>
1070 For accessibility of your website, enforce that elements with explicit or implicit roles defined contain only <code>aria-*</code> properties supported by that <code>role</code>.
1071 Many aria attributes (states and properties) can only be used on elements with particular roles.
1072 Some elements have implicit roles, such as <code>&lt;a href='hrefValue' /&gt;</code>, which will be resolved to <code>role='link'</code>.
1073 A reference for the implicit roles can be found at <a href="https://www.w3.org/TR/html-aria/#sec-strong-native-semantics">Default Implicit ARIA Semantics</a>.
1074 <br />
1075 References:
1076 <ul>
1077 <li><a href="http://oaa-accessibility.org/wcag20/rule/87">ARIA attributes can only be used with certain roles</a></li>
1078 <li><a href="http://oaa-accessibility.org/wcag20/rule/84">Check aria properties and states for valid roles and properties</a></li>
1079 <li><a href="http://oaa-accessibility.org/wcag20/rule/93">Check that 'ARIA-' attributes are valid properties and states</a></li>
1080 </ul>
1081 </td>
1082 <td>2.0.11</td>
1083 </tr>
1084 <tr>
1085 <td>
1086 <code>react-a11y-tabindex-no-positive</code>
1087 </td>
1088 <td>
1089 For accessibility of your website, enforce tabindex value is **not greater than zero**.
1090 Avoid positive tabindex attribute values to synchronize the flow of the page with keyboard tab order.
1091 <br />
1092 References:
1093 <ul>
1094 <li><a href="https://www.w3.org/TR/2008/REC-WCAG20-20081211/#navigation-mechanisms-focus-order">WCAG 2.4.3 - Focus Order</a></li>
1095 <li><a href="https://github.com/GoogleChrome/accessibility-developer-tools/wiki/Audit-Rules#tabindex-usage">Audit Rules - tabindex-usage</a></li>
1096 <li><a href="https://github.com/GoogleChrome/accessibility-developer-tools/wiki/Audit-Rules#ax_focus_03">Avoid positive integer values for tabIndex</a></li>
1097 </ul>
1098 </td>
1099 <td>2.0.11</td>
1100 </tr>
1101 <tr>
1102 <td>
1103 <code>react-a11y-titles</code>
1104 </td>
1105 <td>
1106 For accessibility of your website, HTML title elements must not be empty, must be more than one word, and must not be more than 60 characters long.
1107 <br />
1108 References:
1109 <ul>
1110 <li><a href="http://www.w3.org/TR/WCAG20/#navigation-mechanisms-title">WCAG 2.0 - Requirement 2.4.2 Page Titled (Level A)</a></li>
1111 <li><a href="http://oaa-accessibility.org/wcag20/rule/13">OAA-Accessibility Rule 13: Title element should not be empty</a></li>
1112 <li><a href="http://oaa-accessibility.org/wcag20/rule/24">OAA-Accessibility Rule 24: Title content should be concise</a></li>
1113 <li><a href="http://oaa-accessibility.org/wcag20/rule/25">OAA-Accessibility Rule 25: Title text must contain more than one word</a></li>
1114 </ul>
1115 </td>
1116 <td>2.0.11</td>
1117 </tr>
1118 <tr>
1119 <td>
1120 <code>react-anchor-blank-noopener</code>
1121 </td>
1122 <td>
1123 For security reasons, anchor tags with <code>target="_blank"</code> should also include <code>rel="noreferrer"</code>.
1124 In order to restrict the behavior <code>window.opener</code> access, the original page needs to add a <code>rel="noopener"</code> attribute to any link that has <code>target="_blank"</code>.
1125 However, Firefox does not support that tag, so you should actually use <code>rel="noopener noreferrer"</code> for full coverage.
1126 <br />
1127 By default, the rule considers the use of <code>rel="noreferrer"</code> as sufficient.
1128 The option <code>'force-rel-redundancy'</code> can be passed to require <code>rel="noopener noreferrer"</code>.
1129 <br />
1130 For more info see: <a href="https://dev.to/ben/the-targetblank-vulnerability-by-example">The target="_blank" vulnerability by example</a>.
1131 </td>
1132 <td>2.0.11</td>
1133 </tr>
1134 <tr>
1135 <td>
1136 <code>react-iframe-missing-sandbox</code>
1137 </td>
1138 <td>
1139 React iframes must specify a sandbox attribute.
1140 If specified as an empty string, this attribute enables extra restrictions on the content that can appear in the inline frame.
1141 The value of the attribute can either be an empty string (all the restrictions are applied), or a space-separated list of tokens that lift particular restrictions.
1142 You many not use both allow-scripts and allow-same-origin at the same time, as that allows the embedded document to programmatically remove the sandbox attribute in some scenarios.
1143 </td>
1144 <td>2.0.10</td>
1145 </tr>
1146 <tr>
1147 <td>
1148 <code>react-no-dangerous-html</code>
1149 </td>
1150 <td>
1151 Do not use React's dangerouslySetInnerHTML API.
1152 This rule finds usages of the dangerouslySetInnerHTML API (but not any JSX references).
1153 For more info see the <a href="https://github.com/Microsoft/tslint-microsoft-contrib/wiki/react-no-dangerous-html-Rule">react-no-dangerous-html Rule wiki page</a>.
1154 </td>
1155 <td>0.0.2</td>
1156 </tr>
1157 <tr>
1158 <td>
1159 <code>react-this-binding-issue</code>
1160 </td>
1161 <td>
1162 Several errors can occur when using React and React.Component subclasses.
1163 When using React components you must be careful to correctly bind the 'this' reference on any methods that you pass off to child components as callbacks.
1164 For example, it is common to define a private method called 'onClick' and then specify <code>onClick={this.onClick}</code> as a JSX attribute.
1165 If you do this then the 'this' reference will be undefined when your private method is invoked.
1166 The React documentation suggests that you bind the 'this' reference on all of your methods within the constructor: <code>this.onClick = this.onClick.bind(this);</code>.
1167 This rule will create a violation if:
1168 <ul>
1169 <li>a method reference is passed to a JSX attribute without being bound in the constructor</li>
1170 <li>a method is bound multiple times in the constructor</li>
1171 </ul>
1172 Another issue that can occur is binding the 'this' reference to a function within the render() method.
1173 For example, many people will create an anonymous lambda within the JSX attribute to avoid the 'this' binding issue: <code>onClick={() => { this.onClick(); }}</code>.
1174 The problem with this is that a new instance of an anonymous function is created every time render() is invoked.
1175 When React compares virutual DOM properties within shouldComponentUpdate() then the onClick property will look like a new property and force a re-render.
1176 You should avoid this pattern because creating function instances within render methods breaks any logic within shouldComponentUpdate() methods.
1177 This rule creates violations if:
1178 <ul>
1179 <li>an anonymous function is passed as a JSX attribute</li>
1180 <li>if a function instantiated in local scope is passed as a JSX attribute</li>
1181 </ul>
1182 This rule can be configured via the "allow-anonymous-listeners" parameter.
1183 If you want to suppress violations for the anonymous listener scenarios then configure that rule like this: <code>"react-this-binding-issue": [ true, { 'allow-anonymous-listeners': true } ]</code>, you can also pass in array of string which can act as bind method decorators: <code>"react-this-binding-issue": [true, {'bind-decorators': ['autobind']}]</code></td>
1184 <td>2.0.8, 2.0.9</td>
1185 </tr>
1186 <tr>
1187 <td>
1188 <code>react-tsx-curly-spacing</code>
1189 </td>
1190 <td>
1191 Consistently use spaces around the brace characters of JSX attributes.
1192 You can either allow or ban spaces between the braces and the values they enclose.
1193 <br />
1194 One of the two following options are required:
1195 <ul>
1196 <li><code>"always"</code> enforces a space inside of curly braces (default)</li>
1197 <li><code>"never"</code> disallows spaces inside of curly braces</li>
1198 </ul>
1199 By default, braces spanning multiple lines are not allowed with either setting.
1200 If you want to allow them you can specify an additional allowMultiline property with the value false.
1201 <br />
1202 Examples:
1203 <ul>
1204 <li><code>"react-tsx-curly-spacing": [true, "always"]</code></li>
1205 <li><code>"react-tsx-curly-spacing": [true, "never"]</code></li>
1206 <li><code>"react-tsx-curly-spacing": [true, "never", {"allowMultiline": false}]</code></li>
1207 </ul>
1208 References:
1209 <ul>
1210 <li><a href="https://github.com/yannickcr/eslint-plugin-react/blob/master/docs/rules/jsx-curly-spacing.md">eslint-plugin-react jsx-curly-spacing rule</a></li>
1211 <li><a href="https://github.com/palantir/tslint-react">tslint-react jsx-curly-spacing rule</a></li>
1212 </ul>
1213 </td>
1214 <td>2.0.14</td>
1215 </tr>
1216 <tr>
1217 <td>
1218 <code>react-unused-props-and-state</code>
1219 </td>
1220 <td>
1221 Remove unneeded properties defined in React Props and State interfaces.
1222 Any interface named Props or State is defined as a React interface.
1223 All fields in these interfaces must be referenced.
1224 This rule can be configured with regexes to match custom Props and State interface names.
1225 <br />
1226 Example for including all interfaces ending with Props or State: <code>[ true, { 'props-interface-regex': 'Props$', 'state-interface-regex': 'State$' } ]</code>.
1227 </td>
1228 <td>2.0.10</td>
1229 </tr>
1230 <tr>
1231 <td>
1232 <code>underscore-consistent-invocation</code>
1233 </td>
1234 <td>
1235 Enforce a consistent usage of the _ functions.
1236 By default, invoking underscore functions should begin with wrapping a variable in an underscore instance: <code>_(list).map(...)</code>.
1237 An alternative is to prefer using the static methods on the _ variable: <code>_.map(list, ...)</code>.
1238 The rule accepts a single parameter called 'style' which can be the value 'static' or 'instance': <code>[true, { "style": "static" }]</code>.
1239 </td>
1240 <td>2.0.10</td>
1241 </tr>
1242 <tr>
1243 <td>
1244 <code>use-named-parameter</code>
1245 </td>
1246 <td>
1247 Do not reference the <a>arguments</a> object by numerical index; instead, use a named parameter.
1248 This rule is similar to JSLint's <a href="https://jslinterrors.com/use-a-named-parameter">Use a named parameter</a> rule.
1249 </td>
1250 <td>0.0.3</td>
1251 </tr>
1252 <tr>
1253 <td>
1254 <code>use-simple-attributes</code>
1255 </td>
1256 <td>
1257 Simpler attributes in JSX and TSX files helps keep code clean and readable.
1258 Separate complex expressions into their own line and use clear variable names to make your code more understandable.
1259 </td>
1260 <td>6.0.0</td>
1261 </tr>
1262 <tr>
1263 <td>
1264 <code>valid-typeof</code>
1265 </td>
1266 <td>
1267 Deprecated - This rule is now enforced by the TypeScript compiler.
1268 Ensures that the results of typeof are compared against a valid string.
1269 This rule aims to prevent errors from likely typos by ensuring that when the result of a typeof operation is compared against a string, that the string is a valid value.
1270 Similar to the <a href="https://eslint.org/docs/rules/valid-typeof">valid-typeof ESLint rule</a>.
1271 </td>
1272 <td>1.0</td>
1273 </tr>
1274 <tr>
1275 <td>
1276 <code>void-zero</code>
1277 </td>
1278 <td>
1279 <code>void 0</code>, which resolves to <code>undefined</code>, can be confusing to newcomers. Exclusively use <code>undefined</code> to reduce ambiguity.
1280 </td>
1281 <td>6.1.0</td>
1282 </tr>
1283 </tbody>
1284</table>
1285
1286## Development
1287
1288See [CONTRIBUTING.md](./CONTRIBUTING.md).
1289
1290## Release notes
1291
1292Check GitHub [Releases](https://github.com/Microsoft/tslint-microsoft-contrib/releases) for individual release notes or [CHANGELOG.md](./CHANGELOG.md) for full project changelog.