feat(@angular/cli): update tslint on updating prefix (#5908)

Fixes #5794

Author: sumitarora

packages/@angular/cli/blueprints/component/index.ts

@@ -1,6 +1,7 @@
 import * as chalk from 'chalk';
 import * as fs from 'fs';
 import * as path from 'path';
+import { oneLine } from 'common-tags';
 import { NodeHost } from '../../lib/ast-tools';
 import { CliConfig } from '../../models/config';
 import { getAppFromConfig } from '../../utilities/app-utils';
@@ -218,6 +219,12 @@ export default Blueprint.extend({
   },
 
   afterInstall: function (options: any) {
+    const appConfig = getAppFromConfig(this.options.app);
+    if (options.prefix && appConfig.prefix && appConfig.prefix !== options.prefix) {
+      console.log(chalk.yellow(oneLine`You are using different prefix from app,
+       you might get lint errors. Please update "tslint.json" accordingly.`));
+    }
+
     const returns: Array<any> = [];
     const className = stringUtils.classify(`${options.entity.name}Component`);
     const fileName = stringUtils.dasherize(`${options.entity.name}.component`);

packages/@angular/cli/blueprints/directive/index.ts

@@ -1,5 +1,6 @@
 import * as chalk from 'chalk';
 import * as path from 'path';
+import { oneLine } from 'common-tags';
 import { NodeHost } from '../../lib/ast-tools';
 import { CliConfig } from '../../models/config';
 import { getAppFromConfig } from '../../utilities/app-utils';
@@ -130,6 +131,12 @@ export default Blueprint.extend({
   },
 
   afterInstall: function (options: any) {
+    const appConfig = getAppFromConfig(this.options.app);
+    if (options.prefix && appConfig.prefix && appConfig.prefix !== options.prefix) {
+      console.log(chalk.yellow(oneLine`You are using different prefix from app,
+       you might get lint errors. Please update "tslint.json" accordingly.`));
+    }
+
     const returns: Array<any> = [];
     const className = stringUtils.classify(`${options.entity.name}Directive`);
     const fileName = stringUtils.dasherize(`${options.entity.name}.directive`);

packages/@angular/cli/commands/set.ts

@@ -1,9 +1,11 @@
-import {CliConfig} from '../models/config';
+import * as fs from 'fs';
+import { CliConfig } from '../models/config';
+import { oneLine } from 'common-tags';
 
 const SilentError = require('silent-error');
+const chalk = require('chalk');
 const Command = require('../ember-cli/lib/models/command');
 
-
 export interface SetOptions {
   global?: boolean;
 }
@@ -67,13 +69,38 @@ const SetCommand = Command.extend({
         default: value = parseValue(rawValue, jsonPath);
       }
 
+      if (jsonPath.indexOf('prefix') > 0) {
+        // update tslint if prefix is updated
+        updateLintForPrefix(this.project.root + '/tslint.json', value);
+      }
+
       config.set(jsonPath, value);
       config.save();
       resolve();
     });
   }
 });
 
+function updateLintForPrefix(filePath: string, prefix: string): void {
+    const tsLint = JSON.parse(fs.readFileSync(filePath, 'utf8'));
+    const componentLint = tsLint.rules['component-selector'][2];
+    if (componentLint instanceof Array) {
+      tsLint.rules['component-selector'][2].push(prefix);
+    } else {
+      tsLint.rules['component-selector'][2] = prefix;
+    }
+
+    const directiveLint = tsLint.rules['directive-selector'][2];
+    if (directiveLint instanceof Array) {
+      tsLint.rules['directive-selector'][2].push(prefix);
+    } else {
+      tsLint.rules['directive-selector'][2] = prefix;
+    }
+    fs.writeFileSync(filePath, JSON.stringify(tsLint, null, 2));
+    console.log(chalk.yellow(oneLine`we have updated tslint to match prefix,
+     you may want to fix linting errors.`));
+}
+
 function parseValue(rawValue: string, path: string) {
   try {
     return JSON.parse(rawValue);

tests/e2e/tests/commands/set/set-prefix.ts

@@ -0,0 +1,21 @@
+import {ng} from '../../../utils/process';
+import {expectToFail} from '../../../utils/utils';
+import * as fs from 'fs';
+
+export default function() {
+  return Promise.resolve()
+    .then(() => expectToFail(() => ng('set', 'apps.zzz.prefix')))
+    .then(() => ng('set', 'apps.0.prefix' , 'new-prefix'))
+    .then(() => ng('get', 'apps.0.prefix'))
+    .then(({ stdout }) => {
+      if (!stdout.match(/new-prefix/)) {
+        throw new Error(`Expected "new-prefix", received "${JSON.stringify(stdout)}".`);
+      }
+    })
+    .then(() => {
+      const tsLint = JSON.parse(fs.readFileSync(process.cwd() + '/tslint.json', 'utf8'));
+      if (tsLint.rules['component-selector'][2] !== 'new-prefix') {
+        throw new Error(`Expected "new-prefix" Found: ${tsLint.rules['component-selector'][2]}.`);
+      }
+    });
+}