fix(@schematics/angular): set inlineStyleLanguage when application style option is used

The `style` option for the application schematic specifies the language/preprocessor to use for the application's external style files and should also setup the default for inline styles as well via the `inlineStyleLanguage` build option. The value can be adjusted after application generation if needed.

(cherry picked from commit fdf41b2)

Author: clydin

packages/schematics/angular/application/index.ts

@@ -140,6 +140,11 @@ function addAppToWorkspaceFile(options: ApplicationOptions, appDir: string): Rul
     ];
   }
 
+  const inlineStyleLanguage =
+    options.style && options.style !== Style.Css && options.style !== Style.Styl
+      ? options.style
+      : undefined;
+
   const project = {
     root: normalize(projectRoot),
     sourceRoot,
@@ -157,6 +162,7 @@ function addAppToWorkspaceFile(options: ApplicationOptions, appDir: string): Rul
           polyfills: `${sourceRoot}/polyfills.ts`,
           tsConfig: `${projectRoot}tsconfig.app.json`,
           aot: true,
+          inlineStyleLanguage,
           assets: [
             `${sourceRoot}/favicon.ico`,
             `${sourceRoot}/assets`,
@@ -212,6 +218,7 @@ function addAppToWorkspaceFile(options: ApplicationOptions, appDir: string): Rul
           polyfills: `${sourceRoot}/polyfills.ts`,
           tsConfig: `${projectRoot}tsconfig.spec.json`,
           karmaConfig: `${projectRoot}karma.conf.js`,
+          inlineStyleLanguage,
           assets: [
             `${sourceRoot}/favicon.ico`,
             `${sourceRoot}/assets`,

packages/schematics/angular/application/index_spec.ts

@@ -399,6 +399,66 @@ describe('Application Schematic', () => {
       expect(tree.exists('src/styles.sass')).toBe(true);
     });
 
+    it('sets "inlineStyleLanguage" in angular.json when using a style preprocessor', async () => {
+      const options = { ...defaultOptions, projectRoot: '', style: Style.Sass };
+      const tree = await schematicRunner
+        .runSchematicAsync('application', options, workspaceTree)
+        .toPromise();
+      const config = JSON.parse(tree.readContent('/angular.json'));
+      const prj = config.projects.foo;
+
+      const buildOpt = prj.architect.build.options;
+      expect(buildOpt.inlineStyleLanguage).toBe('sass');
+
+      const testOpt = prj.architect.test.options;
+      expect(testOpt.inlineStyleLanguage).toBe('sass');
+    });
+
+    it('does not set "inlineStyleLanguage" in angular.json when not using a style preprocessor', async () => {
+      const options = { ...defaultOptions, projectRoot: ''};
+      const tree = await schematicRunner
+        .runSchematicAsync('application', options, workspaceTree)
+        .toPromise();
+      const config = JSON.parse(tree.readContent('/angular.json'));
+      const prj = config.projects.foo;
+
+      const buildOpt = prj.architect.build.options;
+      expect(buildOpt.inlineStyleLanguage).toBeUndefined();
+
+      const testOpt = prj.architect.test.options;
+      expect(testOpt.inlineStyleLanguage).toBeUndefined();
+    });
+
+    it('does not set "inlineStyleLanguage" in angular.json when using CSS styles', async () => {
+      const options = { ...defaultOptions, projectRoot: '', style: Style.Css };
+      const tree = await schematicRunner
+        .runSchematicAsync('application', options, workspaceTree)
+        .toPromise();
+      const config = JSON.parse(tree.readContent('/angular.json'));
+      const prj = config.projects.foo;
+
+      const buildOpt = prj.architect.build.options;
+      expect(buildOpt.inlineStyleLanguage).toBeUndefined();
+
+      const testOpt = prj.architect.test.options;
+      expect(testOpt.inlineStyleLanguage).toBeUndefined();
+    });
+
+    it('does not set "inlineStyleLanguage" in angular.json when using Stylus styles', async () => {
+      const options = { ...defaultOptions, projectRoot: '', style: Style.Styl };
+      const tree = await schematicRunner
+        .runSchematicAsync('application', options, workspaceTree)
+        .toPromise();
+      const config = JSON.parse(tree.readContent('/angular.json'));
+      const prj = config.projects.foo;
+
+      const buildOpt = prj.architect.build.options;
+      expect(buildOpt.inlineStyleLanguage).toBeUndefined();
+
+      const testOpt = prj.architect.test.options;
+      expect(testOpt.inlineStyleLanguage).toBeUndefined();
+    });
+
     it('should set the relative tsconfig paths', async () => {
       const options = { ...defaultOptions, projectRoot: '' };
       const tree = await schematicRunner.runSchematicAsync('application', options, workspaceTree)