refactor(docs-infra): update docs examples `tslint.json` to match CLI and fix failures (#38143)

This commit updates the `tslint.json` configuration file, that is used to lint the docs examples, to match the one generated for new Angular CLI apps. There are some minimal differences (marked with `TODO` comments) for things, such as component selector prefix, that would require extensive and/or difficult to validate changes in guides. This commit also includes the final adjustments to make the docs examples code compatible with the new tslint rules. (The bulk of the work has been done in previous commits.) PR Close #38143
2020-07-30 13:03:23 +03:00 · 2020-07-30 13:03:23 +03:00 · 3a46c2da7c
parent bfd13c06e1
commit 3a46c2da7c
12 changed files with 323 additions and 155 deletions
--- a/aio/content/examples/ajs-quick-reference/e2e/src/app.e2e-spec.ts
+++ b/aio/content/examples/ajs-quick-reference/e2e/src/app.e2e-spec.ts
@ -24,8 +24,7 @@ describe('AngularJS to Angular Quick Reference Tests', () => {

    // Go through the samples
    const movieRows = getMovieRows();
-    for (let i = 0; i < expectedSamples.length; i++) {
-      const sample = expectedSamples[i];
+    for (const sample of expectedSamples) {
      const tableCell = movieRows.get(sample.row)
        .all(by.tagName('td')).get(sample.column);
      // Check the cell or its nested element
--- a/aio/content/examples/built-in-directives/src/app/app.component.ts
+++ b/aio/content/examples/built-in-directives/src/app/app.component.ts
@ -76,11 +76,7 @@ export class AppComponent implements OnInit {
  }

  giveNullCustomerValue() {
-    !(this.nullCustomer = null) ? (this.nullCustomer = 'Kelly') : (this.nullCustomer = null);
-  }
-
-  resetNullItem() {
-    this.nullCustomer = null;
+    this.nullCustomer = 'Kelly';
  }

  resetItems() {
--- a/aio/content/examples/dependency-injection-in-action/src/app/parent-finder.component.ts
+++ b/aio/content/examples/dependency-injection-in-action/src/app/parent-finder.component.ts
@ -1,4 +1,4 @@
-/* tslint:disable: no-unused-variable component-selector one-line space-before-function-paren */
+// tslint:disable: component-selector space-before-function-paren
 // #docplaster
 // #docregion
 import { Component, forwardRef, Optional, SkipSelf } from '@angular/core';
--- a/aio/content/examples/dependency-injection/src/app/car/car.component.ts
+++ b/aio/content/examples/dependency-injection/src/app/car/car.component.ts
@ -27,9 +27,9 @@ import { useInjector } from './car-injector';
  providers: [Car, Engine, Tires]
 })
 export class CarComponent {
-  factoryCar  = (new CarFactory).createCar();
+  factoryCar  = (new CarFactory()).createCar();
  injectorCar = useInjector();
-  noDiCar     = new CarNoDi;
+  noDiCar     = new CarNoDi();
  simpleCar   = simpleCar();
  superCar    = superCar();
  testCar     = testCar();
--- a/aio/content/examples/testing/src/app/dashboard/dashboard.component.spec.ts
+++ b/aio/content/examples/testing/src/app/dashboard/dashboard.component.spec.ts
@ -90,7 +90,7 @@ function compileAndCreate() {
 * The (almost) same tests for both.
 * Only change: the way that the first hero is clicked
 */
-function tests(heroClick: Function) {
+function tests(heroClick: () => void) {

  it('should NOT have heroes before ngOnInit', () => {
    expect(comp.heroes.length).toBe(0,
--- a/aio/content/examples/testing/src/app/demo/async-helper.spec.ts
+++ b/aio/content/examples/testing/src/app/demo/async-helper.spec.ts
@ -147,7 +147,7 @@ describe('Angular async helper', () => {

  // #docregion async-test-promise-then
  describe('test jsonp', () => {
-    function jsonp(url: string, callback: Function) {
+    function jsonp(url: string, callback: () => void) {
      // do a jsonp call which is not zone aware
    }
    // need to config __zone_symbol__supportWaitUnResolvedChainedPromise flag
--- a/aio/content/examples/testing/src/testing/jasmine-matchers.d.ts
+++ b/aio/content/examples/testing/src/testing/jasmine-matchers.d.ts
@ -1,3 +1,4 @@
+// tslint:disable-next-line: no-namespace
 declare namespace jasmine {
  interface Matchers<T> {
    toHaveText(actual: any, expectationFailOutput?: any): jasmine.CustomMatcher;
--- a/aio/content/examples/testing/src/testing/jasmine-matchers.ts
+++ b/aio/content/examples/testing/src/testing/jasmine-matchers.ts
@ -1,3 +1,4 @@
+// tslint:disable-next-line: no-reference
 /// <reference path="./jasmine-matchers.d.ts" />

 ////  Jasmine Custom Matchers ////
--- a/aio/content/examples/tslint.json
+++ b/aio/content/examples/tslint.json
@ -1,28 +1,61 @@
 {
-  "rulesDirectory": [
-    "../../node_modules/codelyzer"
-  ],
+  "extends": "tslint:recommended",
  "rules": {
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space"
-    ],
+    "align": {
+      "options": [
+        "parameters",
+        "statements"
+      ]
+    },
+    "array-type": false,
+    "arrow-return-shorthand": true,
    "curly": true,
-    "eofline": true,
-    "forin": true,
-    "indent": [
+    "deprecation": {
+      "severity": "warning"
+    },
+    "component-class-suffix": true,
+    "component-selector": [
      true,
-      "spaces"
+      "element",
+      // TODO: Fix the code and change the prefix to `"app"` (or whatever makes sense).
+      "",
+      "kebab-case"
    ],
-    "label-position": true,
+    "contextual-lifecycle": true,
+    "directive-class-suffix": true,
+    "directive-selector": [
+      true,
+      "attribute",
+      ["app", "toh"],
+      "camelCase"
+    ],
+    "eofline": true,
+    "import-blacklist": [
+      true,
+      "rxjs/Rx"
+    ],
+    "import-spacing": true,
+    "indent": {
+      "options": [
+        "spaces"
+      ]
+    },
+    "max-classes-per-file": false,
    "max-line-length": [
      true,
      140
    ],
-    "member-access": false,
-    "no-arg": true,
-    "no-bitwise": true,
+    "member-ordering": [
+      true,
+      {
+        "order": [
+          "static-field",
+          "instance-field",
+          "static-method",
+          "instance-method"
+        ]
+      }
+    ],
    "no-console": [
      true,
      "debug",
@ -31,63 +64,86 @@
      "timeEnd",
      "trace"
    ],
-    "no-construct": true,
-    "no-debugger": true,
-    "no-duplicate-variable": true,
    "no-empty": false,
-    "no-eval": true,
-    "no-inferrable-types": true,
-    "no-string-literal": false,
-    "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unused-expression": true,
-    "no-var-keyword": true,
-    "object-literal-sort-keys": false,
-    "one-line": [
+    "no-inferrable-types": [
      true,
-      "check-open-brace",
-      "check-catch",
-      "check-else",
-      "check-whitespace"
+      "ignore-params"
+    ],
+    "no-non-null-assertion": true,
+    "no-redundant-jsdoc": true,
+    "no-switch-case-fall-through": true,
+    "no-var-requires": false,
+    "object-literal-key-quotes": [
+      true,
+      "as-needed"
    ],
    "quotemark": [
      true,
      "single"
    ],
-    "radix": true,
-    "semicolon": [
-      "always"
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
+    "semicolon": {
+      "options": [
+        "always"
+      ]
+    },
+    "space-before-function-paren": {
+      "options": {
+        "anonymous": "never",
+        "asyncArrow": "always",
+        "constructor": "never",
+        "method": "never",
+        "named": "never"
      }
-    ],
-    "variable-name": false,
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-decl",
-      "check-operator",
-      "check-separator",
-      "check-type"
-    ],
-
+    },
+    "typedef-whitespace": {
+      "options": [
+        {
+          "call-signature": "nospace",
+          "index-signature": "nospace",
+          "parameter": "nospace",
+          "property-declaration": "nospace",
+          "variable-declaration": "nospace"
+        },
+        {
+          "call-signature": "onespace",
+          "index-signature": "onespace",
+          "parameter": "onespace",
+          "property-declaration": "onespace",
+          "variable-declaration": "onespace"
+        }
+      ]
+    },
+    "variable-name": {
+      "options": [
+        "ban-keywords",
+        "check-format",
+        "allow-pascal-case"
+      ]
+    },
+    "whitespace": {
+      "options": [
+        "check-branch",
+        "check-decl",
+        "check-operator",
+        "check-separator",
+        "check-type",
+        "check-typecast"
+      ]
+    },
+    "no-conflicting-lifecycle": true,
+    "no-host-metadata-property": true,
+    "no-input-rename": true,
    "no-inputs-metadata-property": true,
+    "no-output-native": true,
+    "no-output-on-prefix": true,
+    "no-output-rename": true,
    "no-outputs-metadata-property": true,
-    "use-life-cycle-interface": true,
-    "use-pipe-transform-interface": true,
-    "component-class-suffix": true,
-    "directive-class-suffix": true,
-    "import-destructuring-spacing": true
-  }
+    "template-banana-in-box": true,
+    "template-no-negated-async": true,
+    "use-lifecycle-interface": true,
+    "use-pipe-transform-interface": true
+  },
+  "rulesDirectory": [
+    "codelyzer"
+  ]
 }
--- a/aio/content/examples/universal/src/app/app.module.ts
+++ b/aio/content/examples/universal/src/app/app.module.ts
@ -51,7 +51,7 @@ import { isPlatformBrowser } from '@angular/common';
 export class AppModule {
  // #docregion platform-detection
  constructor(
-    @Inject(PLATFORM_ID) private platformId: Object,
+    @Inject(PLATFORM_ID) private platformId: object,
    @Inject(APP_ID) private appId: string) {
    const platform = isPlatformBrowser(platformId) ?
      'in the browser' : 'on the server';
--- a/aio/tools/examples/shared/boilerplate/cli/tslint.json
+++ b/aio/tools/examples/shared/boilerplate/cli/tslint.json
@ -1,37 +1,50 @@
 {
  "extends": "tslint:recommended",
  "rules": {
+    "align": {
+      "options": [
+        "parameters",
+        "statements"
+      ]
+    },
    "array-type": false,
-    "arrow-parens": false,
+    "arrow-return-shorthand": true,
+    "curly": true,
    "deprecation": {
      "severity": "warning"
    },
    "component-class-suffix": true,
+    "component-selector": [
+      true,
+      "element",
+      // TODO: Fix the code and change the prefix to `"app"` (or whatever makes sense).
+      "",
+      "kebab-case"
+    ],
    "contextual-lifecycle": true,
    "directive-class-suffix": true,
    "directive-selector": [
      true,
      "attribute",
-      "app",
+      ["app", "toh"],
      "camelCase"
    ],
-    "component-selector": [
-      true,
-      "element",
-      "app",
-      "kebab-case"
-    ],
+    "eofline": true,
    "import-blacklist": [
      true,
      "rxjs/Rx"
    ],
-    "interface-name": false,
+    "import-spacing": true,
+    "indent": {
+      "options": [
+        "spaces"
+      ]
+    },
    "max-classes-per-file": false,
    "max-line-length": [
      true,
      140
    ],
-    "member-access": false,
    "member-ordering": [
      true,
      {
@ -43,7 +56,6 @@
        ]
      }
    ],
-    "no-consecutive-blank-lines": false,
    "no-console": [
      true,
      "debug",
@ -65,13 +77,59 @@
      true,
      "as-needed"
    ],
-    "object-literal-sort-keys": false,
-    "ordered-imports": false,
    "quotemark": [
      true,
      "single"
    ],
-    "trailing-comma": false,
+    "semicolon": {
+      "options": [
+        "always"
+      ]
+    },
+    "space-before-function-paren": {
+      "options": {
+        "anonymous": "never",
+        "asyncArrow": "always",
+        "constructor": "never",
+        "method": "never",
+        "named": "never"
+      }
+    },
+    "typedef-whitespace": {
+      "options": [
+        {
+          "call-signature": "nospace",
+          "index-signature": "nospace",
+          "parameter": "nospace",
+          "property-declaration": "nospace",
+          "variable-declaration": "nospace"
+        },
+        {
+          "call-signature": "onespace",
+          "index-signature": "onespace",
+          "parameter": "onespace",
+          "property-declaration": "onespace",
+          "variable-declaration": "onespace"
+        }
+      ]
+    },
+    "variable-name": {
+      "options": [
+        "ban-keywords",
+        "check-format",
+        "allow-pascal-case"
+      ]
+    },
+    "whitespace": {
+      "options": [
+        "check-branch",
+        "check-decl",
+        "check-operator",
+        "check-separator",
+        "check-type",
+        "check-typecast"
+      ]
+    },
    "no-conflicting-lifecycle": true,
    "no-host-metadata-property": true,
    "no-input-rename": true,
--- a/aio/tools/examples/shared/boilerplate/systemjs/tslint.json
+++ b/aio/tools/examples/shared/boilerplate/systemjs/tslint.json
@ -1,31 +1,61 @@
 {
+  "extends": "tslint:recommended",
  "rules": {
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space"
-    ],
+    "align": {
+      "options": [
+        "parameters",
+        "statements"
+      ]
+    },
+    "array-type": false,
+    "arrow-return-shorthand": true,
    "curly": true,
-    "eofline": true,
-    "forin": true,
-    "indent": [
+    "deprecation": {
+      "severity": "warning"
+    },
+    "component-class-suffix": true,
+    "component-selector": [
      true,
-      "spaces"
+      "element",
+      // TODO: Fix the code and change the prefix to `"app"` (or whatever makes sense).
+      "",
+      "kebab-case"
    ],
-    "label-position": true,
-    "label-undefined": true,
+    "contextual-lifecycle": true,
+    "directive-class-suffix": true,
+    "directive-selector": [
+      true,
+      "attribute",
+      ["app", "toh"],
+      "camelCase"
+    ],
+    "eofline": true,
+    "import-blacklist": [
+      true,
+      "rxjs/Rx"
+    ],
+    "import-spacing": true,
+    "indent": {
+      "options": [
+        "spaces"
+      ]
+    },
+    "max-classes-per-file": false,
    "max-line-length": [
      true,
      140
    ],
-    "member-access": false,
    "member-ordering": [
      true,
-      "static-before-instance",
-      "variables-before-functions"
+      {
+        "order": [
+          "static-field",
+          "instance-field",
+          "static-method",
+          "instance-method"
+        ]
+      }
    ],
-    "no-arg": true,
-    "no-bitwise": true,
    "no-console": [
      true,
      "debug",
@ -34,59 +64,86 @@
      "timeEnd",
      "trace"
    ],
-    "no-construct": true,
-    "no-debugger": true,
-    "no-duplicate-key": true,
-    "no-duplicate-variable": true,
    "no-empty": false,
-    "no-eval": true,
-    "no-inferrable-types": true,
-    "no-shadowed-variable": true,
-    "no-string-literal": false,
-    "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unused-expression": true,
-    "no-unused-variable": true,
-    "no-unreachable": true,
-    "no-var-keyword": true,
-    "object-literal-sort-keys": false,
-    "one-line": [
+    "no-inferrable-types": [
      true,
-      "check-open-brace",
-      "check-catch",
-      "check-else",
-      "check-whitespace"
+      "ignore-params"
+    ],
+    "no-non-null-assertion": true,
+    "no-redundant-jsdoc": true,
+    "no-switch-case-fall-through": true,
+    "no-var-requires": false,
+    "object-literal-key-quotes": [
+      true,
+      "as-needed"
    ],
    "quotemark": [
      true,
      "single"
    ],
-    "radix": true,
-    "semicolon": [
-      "always"
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
+    "semicolon": {
+      "options": [
+        "always"
+      ]
+    },
+    "space-before-function-paren": {
+      "options": {
+        "anonymous": "never",
+        "asyncArrow": "always",
+        "constructor": "never",
+        "method": "never",
+        "named": "never"
      }
-    ],
-    "variable-name": false,
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-decl",
-      "check-operator",
-      "check-separator",
-      "check-type"
-    ]
-  }
+    },
+    "typedef-whitespace": {
+      "options": [
+        {
+          "call-signature": "nospace",
+          "index-signature": "nospace",
+          "parameter": "nospace",
+          "property-declaration": "nospace",
+          "variable-declaration": "nospace"
+        },
+        {
+          "call-signature": "onespace",
+          "index-signature": "onespace",
+          "parameter": "onespace",
+          "property-declaration": "onespace",
+          "variable-declaration": "onespace"
+        }
+      ]
+    },
+    "variable-name": {
+      "options": [
+        "ban-keywords",
+        "check-format",
+        "allow-pascal-case"
+      ]
+    },
+    "whitespace": {
+      "options": [
+        "check-branch",
+        "check-decl",
+        "check-operator",
+        "check-separator",
+        "check-type",
+        "check-typecast"
+      ]
+    },
+    "no-conflicting-lifecycle": true,
+    "no-host-metadata-property": true,
+    "no-input-rename": true,
+    "no-inputs-metadata-property": true,
+    "no-output-native": true,
+    "no-output-on-prefix": true,
+    "no-output-rename": true,
+    "no-outputs-metadata-property": true,
+    "template-banana-in-box": true,
+    "template-no-negated-async": true,
+    "use-lifecycle-interface": true,
+    "use-pipe-transform-interface": true
+  },
+  "rulesDirectory": [
+    "codelyzer"
+  ]
 }