From 052673c62b4e7b4423b31709d9fb3dae6ad886ed Mon Sep 17 00:00:00 2001
From: Paul Gschwendtner <paulgschwendtner@gmail.com>
Date: Wed, 31 Oct 2018 17:51:52 +0100
Subject: [PATCH] chore(schematics): improve messages for ng-add (#13840)

In order to make the "failure" or "warning" messages with `ng-add` look more friendly and structured, we manually wrap the messages. Additionally `chalk` is being used more often in order to make it clear if something failed/passed or is just a warning.
---
 src/lib/schematics/ng-add/index.spec.ts      |  2 +-
 src/lib/schematics/ng-add/setup-project.ts   | 20 ++++++++++++++------
 src/lib/schematics/ng-add/theming/theming.ts | 13 +++++++------
 3 files changed, 22 insertions(+), 13 deletions(-)

diff --git a/src/lib/schematics/ng-add/index.spec.ts b/src/lib/schematics/ng-add/index.spec.ts
index 5c4ede1112c..76ce203bbaf 100644
--- a/src/lib/schematics/ng-add/index.spec.ts
+++ b/src/lib/schematics/ng-add/index.spec.ts
@@ -257,7 +257,7 @@ describe('ng-add schematic', () => {
       expect(styles).not.toContain(defaultPrebuiltThemePath,
           'Expected the default prebuilt theme to be not configured.');
       expect(console.warn).toHaveBeenCalledWith(
-          jasmine.stringMatching(/Cannot add.*already a custom theme/));
+        jasmine.stringMatching(/Could not add the selected theme/));
     });
 
     it('should not add a theme file multiple times', () => {
diff --git a/src/lib/schematics/ng-add/setup-project.ts b/src/lib/schematics/ng-add/setup-project.ts
index bf47c5120f8..d5970f3eba2 100644
--- a/src/lib/schematics/ng-add/setup-project.ts
+++ b/src/lib/schematics/ng-add/setup-project.ts
@@ -14,7 +14,7 @@ import {
   getProjectStyleFile,
   hasNgModuleImport,
 } from '@angular/cdk/schematics';
-import {red, bold} from 'chalk';
+import {red, bold, italic} from 'chalk';
 import {getWorkspace} from '@schematics/angular/utility/config';
 import {getAppModulePath} from '@schematics/angular/utility/ng-ast-utils';
 import {addFontsToIndex} from './fonts/material-fonts';
@@ -88,12 +88,20 @@ function addMaterialAppStyles(options: Schema) {
     const workspace = getWorkspace(host);
     const project = getProjectFromWorkspace(workspace, options.project);
     const styleFilePath = getProjectStyleFile(project);
-    const buffer = host.read(styleFilePath!);
 
-    if (!styleFilePath || !buffer) {
-      return console.warn(`Could not find styles file: "${styleFilePath}". Skipping styles ` +
-        `generation. Please consider manually adding the "Roboto" font and resetting the ` +
-        `body margin.`);
+    if (!styleFilePath) {
+      console.warn(red(`Could not find the default style file for this project.`));
+      console.warn(red(`Please consider manually setting up the Roboto font in your CSS.`));
+      return;
+    }
+
+    const buffer = host.read(styleFilePath);
+
+    if (!buffer) {
+      console.warn(red(`Could not read the default style file within the project ` +
+        `(${italic(styleFilePath)})`));
+      console.warn(red(`Please consider manually setting up the Robot font.`));
+      return;
     }
 
     const htmlContent = buffer.toString();
diff --git a/src/lib/schematics/ng-add/theming/theming.ts b/src/lib/schematics/ng-add/theming/theming.ts
index 8fc83d6f445..f137e6d02ab 100644
--- a/src/lib/schematics/ng-add/theming/theming.ts
+++ b/src/lib/schematics/ng-add/theming/theming.ts
@@ -19,7 +19,7 @@ import {getWorkspace} from '@schematics/angular/utility/config';
 import {join} from 'path';
 import {Schema} from '../schema';
 import {createCustomTheme} from './custom-theme';
-import {red, bold} from 'chalk';
+import {red, bold, yellow} from 'chalk';
 
 /** Path segment that can be found in paths that refer to a prebuilt theme. */
 const prebuiltThemePathSegment = '@angular/material/prebuilt-themes';
@@ -69,8 +69,8 @@ function insertCustomTheme(project: WorkspaceProject, projectName: string, host:
     const customThemePath = normalize(join(project.sourceRoot, defaultCustomThemeFilename));
 
     if (host.exists(customThemePath)) {
-      console.warn(red(`Cannot create a custom Angular Material theme because
-          "${customThemePath}" already exists. Skipping custom theme generation.`));
+      console.warn(yellow(`Cannot create a custom Angular Material theme because
+          ${bold(customThemePath)} already exists. Skipping custom theme generation.`));
       return;
     }
 
@@ -119,9 +119,10 @@ function addThemeStyleToTarget(project: WorkspaceProject, targetName: string, ho
       // theme because these files can contain custom styles, while prebuilt themes are
       // always packaged and considered replaceable.
       if (stylePath.includes(defaultCustomThemeFilename)) {
-        console.warn(red(`Cannot add "${bold(assetPath)} to the CLI project configuration ` +
-            `because there is already a custom theme file referenced. Please manually add ` +
-            `the "${bold(assetPath)}" style file to your configuration.`));
+        console.warn(red(`Could not add the selected theme to the CLI project configuration ` +
+            `because there is already a custom theme file referenced.`));
+        console.warn(red(`Please manually add the following style file to your configuration:`));
+        console.warn(yellow(`    ${bold(assetPath)}`));
         return;
       } else if (stylePath.includes(prebuiltThemePathSegment)) {
         targetOptions.styles.splice(index, 1);