test(schematics): move away from deprecated test API (#16150)

In 8.0 the `runSchematic` method is marked as deprecated. These changes switch all the usages to `runSchematicAsync`.

Author: crisbeto

src/cdk/schematics/ng-add/index.spec.ts

@@ -11,8 +11,8 @@ describe('CDK ng-add', () => {
     appTree = await createTestApp(runner);
   });
 
-  it('should update the package.json', () => {
-    const tree = runner.runSchematic('ng-add', {}, appTree);
+  it('should update the package.json', async () => {
+    const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
     const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
     const dependencies = packageJson.dependencies;
 

src/cdk/schematics/ng-generate/drag-drop/index.spec.ts

@@ -1,7 +1,6 @@
 import {SchematicTestRunner} from '@angular-devkit/schematics/testing';
 import {getProjectFromWorkspace} from '@angular/cdk/schematics';
 import {getWorkspace} from '@schematics/angular/utility/config';
-import {getProject} from '@schematics/angular/utility/project';
 import {createTestApp, getFileContent} from '../../testing';
 import {Schema} from './schema';
 
@@ -21,7 +20,8 @@ describe('CDK drag-drop schematic', () => {
   });
 
   it('should create drag-drop files and add them to module', async () => {
-    const tree = runner.runSchematic('drag-drop', baseOptions, await createTestApp(runner));
+    const app = await createTestApp(runner);
+    const tree = await runner.runSchematicAsync('drag-drop', baseOptions, app).toPromise();
     const moduleContent = getFileContent(tree, '/projects/material/src/app/app.module.ts');
     const files = tree.files;
 
@@ -35,16 +35,17 @@ describe('CDK drag-drop schematic', () => {
   });
 
   it('should add drag-drop module', async () => {
-    const tree = runner.runSchematic('drag-drop', baseOptions, await createTestApp(runner));
+    const app = await createTestApp(runner);
+    const tree = await runner.runSchematicAsync('drag-drop', baseOptions, app).toPromise();
     const moduleContent = getFileContent(tree, '/projects/material/src/app/app.module.ts');
 
     expect(moduleContent).toContain('DragDropModule');
   });
 
   describe('style option', () => {
     it('should respect the option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', {style: 'scss', ...baseOptions}, await createTestApp(runner));
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', {style: 'scss', ...baseOptions}, await createTestApp(runner)).toPromise();
 
       expect(tree.files).toContain('/projects/material/src/app/foo/foo.component.scss');
     });
@@ -61,14 +62,14 @@ describe('CDK drag-drop schematic', () => {
       project.schematics!['@schematics/angular:component'] = {styleext: 'scss'};
 
       tree.overwrite('angular.json', JSON.stringify(workspace));
-      tree = runner.runSchematic('drag-drop', baseOptions, tree);
+      tree = await runner.runSchematicAsync('drag-drop', baseOptions, tree).toPromise();
 
       expect(tree.files).toContain('/projects/material/src/app/foo/foo.component.scss');
     });
 
     it('should not generate invalid stylesheets', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', {style: 'styl', ...baseOptions}, await createTestApp(runner));
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', {style: 'styl', ...baseOptions}, await createTestApp(runner)).toPromise();
 
       // In this case we expect the schematic to generate a plain "css" file because
       // the component schematics are using CSS style templates which are not compatible
@@ -80,49 +81,51 @@ describe('CDK drag-drop schematic', () => {
     });
 
     it('should fall back to the @schematics/angular:component option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', baseOptions, await createTestApp(runner, {style: 'less'}));
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', baseOptions, await createTestApp(runner, {style: 'less'})).toPromise();
 
       expect(tree.files).toContain('/projects/material/src/app/foo/foo.component.less');
     });
   });
 
   describe('inlineStyle option', () => {
     it('should respect the option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', {inlineStyle: true, ...baseOptions}, await createTestApp(runner));
+      const app = await createTestApp(runner);
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', {inlineStyle: true, ...baseOptions}, app).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.css');
     });
 
     it('should fall back to the @schematics/angular:component option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', baseOptions, await createTestApp(runner, {inlineStyle: true}));
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', baseOptions, await createTestApp(runner, {inlineStyle: true})).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.css');
     });
   });
 
   describe('inlineTemplate option', () => {
     it('should respect the option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', {inlineTemplate: true, ...baseOptions}, await createTestApp(runner));
+      const app = await createTestApp(runner);
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', {inlineTemplate: true, ...baseOptions}, app).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.html');
     });
 
     it('should fall back to the @schematics/angular:component option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', baseOptions, await createTestApp(runner, {inlineTemplate: true}));
+      const app = await createTestApp(runner, {inlineTemplate: true});
+      const tree = await runner.runSchematicAsync('drag-drop', baseOptions, app).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.html');
     });
   });
 
   describe('skipTests option', () => {
     it('should respect the option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', {skipTests: true, ...baseOptions}, await createTestApp(runner));
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', {skipTests: true, ...baseOptions}, await createTestApp(runner)).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.spec.ts');
     });
@@ -139,14 +142,14 @@ describe('CDK drag-drop schematic', () => {
       project.schematics!['@schematics/angular:component'] = {spec: false};
 
       tree.overwrite('angular.json', JSON.stringify(workspace));
-      tree = runner.runSchematic('drag-drop', baseOptions, tree);
+      tree = await runner.runSchematicAsync('drag-drop', baseOptions, tree).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.spec.ts');
     });
 
     it('should fall back to the @schematics/angular:component option value', async () => {
-      const tree = runner.runSchematic(
-          'drag-drop', baseOptions, await createTestApp(runner, {skipTests: true}));
+      const tree = await runner.runSchematicAsync(
+          'drag-drop', baseOptions, await createTestApp(runner, {skipTests: true})).toPromise();
 
       expect(tree.files).not.toContain('/projects/material/src/app/foo/foo.component.spec.ts');
     });

src/material/schematics/ng-add/index.spec.ts

@@ -34,13 +34,13 @@ describe('ng-add schematic', () => {
     tree.overwrite('/package.json', JSON.stringify(packageContent, null, 2));
   }
 
-  it('should update package.json', () => {
+  it('should update package.json', async () => {
     // By default, the Angular workspace schematic sets up "@angular/animations". In order
     // to verify that we would set up the dependency properly if someone doesn't have the
     // animations installed already, we remove the animations dependency explicitly.
     removePackageJsonDependency(appTree, '@angular/animations');
 
-    const tree = runner.runSchematic('ng-add', {}, appTree);
+    const tree = await runner.runSchematicAsync('ng-add', {}, appTree).toPromise();
     const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
     const dependencies = packageJson.dependencies;
     const angularCoreVersion = dependencies['@angular/core'];
@@ -59,16 +59,16 @@ describe('ng-add schematic', () => {
     expect(runner.tasks.some(task => task.name === 'run-schematic')).toBe(true);
   });
 
-  it('should add hammerjs import to project main file', () => {
-    const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+  it('should add hammerjs import to project main file', async () => {
+    const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
     const fileContent = getFileContent(tree, '/projects/material/src/main.ts');
 
     expect(fileContent).toContain(`import 'hammerjs';`,
       'Expected the project main file to contain a HammerJS import.');
   });
 
-  it('should add default theme', () => {
-    const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+  it('should add default theme', async () => {
+    const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
 
     const workspace = getWorkspace(tree);
     const project = getProjectFromWorkspace(workspace);
@@ -81,7 +81,8 @@ describe('ng-add schematic', () => {
     // TODO(devversion): do not re-create test app here.
     appTree = await createTestApp(runner, {style: 'scss'});
 
-    const tree = runner.runSchematic('ng-add-setup-project', {theme: 'custom'}, appTree);
+    const tree = await runner.runSchematicAsync('ng-add-setup-project',
+        {theme: 'custom'}, appTree).toPromise();
 
     const workspace = getWorkspace(tree);
     const project = getProjectFromWorkspace(workspace);
@@ -98,7 +99,8 @@ describe('ng-add schematic', () => {
     // TODO(devversion): do not re-create test app here.
     appTree = await createTestApp(runner, {style: 'css'});
 
-    const tree = runner.runSchematic('ng-add-setup-project', {theme: 'custom'}, appTree);
+    const tree = await runner.runSchematicAsync('ng-add-setup-project',
+        {theme: 'custom'}, appTree).toPromise();
     const workspace = getWorkspace(tree);
     const project = getProjectFromWorkspace(workspace);
     const expectedStylesPath = normalize(`/${project.root}/src/custom-theme.scss`);
@@ -107,8 +109,8 @@ describe('ng-add schematic', () => {
     expectProjectStyleFile(project, 'projects/material/src/custom-theme.scss');
   });
 
-  it('should add font links', () => {
-    const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+  it('should add font links', async () => {
+    const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
     const workspace = getWorkspace(tree);
     const project = getProjectFromWorkspace(workspace);
 
@@ -125,8 +127,8 @@ describe('ng-add schematic', () => {
       '  <link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500"');
   });
 
-  it('should add material app styles', () => {
-    const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+  it('should add material app styles', async () => {
+    const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
     const workspace = getWorkspace(tree);
     const project = getProjectFromWorkspace(workspace);
 
@@ -140,16 +142,16 @@ describe('ng-add schematic', () => {
 
   describe('gestures disabled', () => {
 
-    it('should not add hammerjs to package.json', () => {
-      const tree = runner.runSchematic('ng-add', {gestures: false}, appTree);
+    it('should not add hammerjs to package.json', async () => {
+      const tree = await runner.runSchematicAsync('ng-add', {gestures: false}, appTree).toPromise();
       const packageJson = JSON.parse(getFileContent(tree, '/package.json'));
 
       expect(packageJson.dependencies['hammerjs'])
         .toBeUndefined(`Expected 'hammerjs' to be not added to the package.json`);
     });
 
-    it('should not add hammerjs import to project main file', () => {
-      const tree = runner.runSchematic('ng-add', {gestures: false}, appTree);
+    it('should not add hammerjs import to project main file', async () => {
+      const tree = await runner.runSchematicAsync('ng-add', {gestures: false}, appTree).toPromise();
       const fileContent = getFileContent(tree, '/projects/material/src/main.ts');
 
       expect(fileContent).not.toContain(`import 'hammerjs';`,
@@ -158,15 +160,15 @@ describe('ng-add schematic', () => {
   });
 
   describe('animations enabled', () => {
-    it('should add the BrowserAnimationsModule to the project module', () => {
-      const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+    it('should add the BrowserAnimationsModule to the project module', async () => {
+      const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
       const fileContent = getFileContent(tree, '/projects/material/src/app/app.module.ts');
 
       expect(fileContent).toContain('BrowserAnimationsModule',
         'Expected the project app module to import the "BrowserAnimationsModule".');
     });
 
-    it('should not add BrowserAnimationsModule if NoopAnimationsModule is set up', () => {
+    it('should not add BrowserAnimationsModule if NoopAnimationsModule is set up', async () => {
       const workspace = getWorkspace(appTree);
       const project = getProjectFromWorkspace(workspace);
 
@@ -178,16 +180,17 @@ describe('ng-add schematic', () => {
           '@angular/platform-browser/animations', project);
 
       spyOn(console, 'warn');
-      runner.runSchematic('ng-add-setup-project', {}, appTree);
+      await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
 
       expect(console.warn).toHaveBeenCalledWith(
         jasmine.stringMatching(/Could not set up "BrowserAnimationsModule"/));
     });
   });
 
   describe('animations disabled', () => {
-    it('should add the NoopAnimationsModule to the project module', () => {
-      const tree = runner.runSchematic('ng-add-setup-project', {animations: false}, appTree);
+    it('should add the NoopAnimationsModule to the project module', async () => {
+      const tree = await runner.runSchematicAsync('ng-add-setup-project',
+          {animations: false}, appTree).toPromise();
       const fileContent = getFileContent(tree, '/projects/material/src/app/app.module.ts');
 
       expect(fileContent).toContain('NoopAnimationsModule',
@@ -221,18 +224,25 @@ describe('ng-add schematic', () => {
       tree.overwrite('/angular.json', JSON.stringify(workspace, null, 2));
     }
 
-    it('should throw an error if the "build" target has been changed', () => {
+    it('should throw an error if the "build" target has been changed', async () => {
       overwriteTargetBuilder(appTree, 'build', 'thirdparty-builder');
 
-      expect(() => runner.runSchematic('ng-add-setup-project', {}, appTree))
-        .toThrowError(/not using the default builders.*build/);
+      let message: string | null = null;
+
+      try {
+        await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
+      } catch (e) {
+        message = e.message;
+      }
+
+      expect(message).toMatch(/not using the default builders.*build/);
     });
 
-    it('should warn if the "test" target has been changed', () => {
+    it('should warn if the "test" target has been changed', async () => {
       overwriteTargetBuilder(appTree, 'test', 'thirdparty-test-builder');
 
       spyOn(console, 'warn');
-      runner.runSchematic('ng-add-setup-project', {}, appTree);
+      await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
 
       expect(console.warn).toHaveBeenCalledWith(
         jasmine.stringMatching(/not using the default builders.*cannot add the configured theme/));
@@ -260,12 +270,12 @@ describe('ng-add schematic', () => {
       tree.overwrite('/angular.json', JSON.stringify(workspace, null, 2));
     }
 
-    it('should replace existing prebuilt theme files', () => {
+    it('should replace existing prebuilt theme files', async () => {
       const existingThemePath =
           './node_modules/@angular/material/prebuilt-themes/purple-green.css';
       writeStyleFileToWorkspace(appTree, existingThemePath);
 
-      const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+      const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
       const workspace = getWorkspace(tree);
       const project = getProjectFromWorkspace(workspace);
       const styles = getProjectTargetOptions(project, 'build').styles;
@@ -276,11 +286,11 @@ describe('ng-add schematic', () => {
           'Expected the default prebuilt theme to be added.');
     });
 
-    it('should not replace existing custom theme files', () => {
+    it('should not replace existing custom theme files', async () => {
       spyOn(console, 'warn');
       writeStyleFileToWorkspace(appTree, './projects/material/custom-theme.scss');
 
-      const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+      const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
       const workspace = getWorkspace(tree);
       const project = getProjectFromWorkspace(workspace);
       const styles = getProjectTargetOptions(project, 'build').styles;
@@ -291,10 +301,10 @@ describe('ng-add schematic', () => {
         jasmine.stringMatching(/Could not add the selected theme/));
     });
 
-    it('should not add a theme file multiple times', () => {
+    it('should not add a theme file multiple times', async () => {
       writeStyleFileToWorkspace(appTree, defaultPrebuiltThemePath);
 
-      const tree = runner.runSchematic('ng-add-setup-project', {}, appTree);
+      const tree = await runner.runSchematicAsync('ng-add-setup-project', {}, appTree).toPromise();
       const workspace = getWorkspace(tree);
       const project = getProjectFromWorkspace(workspace);
       const styles = getProjectTargetOptions(project, 'build').styles;
@@ -303,9 +313,10 @@ describe('ng-add schematic', () => {
           'Expected the "styles.css" file and default prebuilt theme to be the only styles');
     });
 
-    it('should not overwrite existing custom theme files', () => {
+    it('should not overwrite existing custom theme files', async () => {
       appTree.create('/projects/material/custom-theme.scss', 'custom-theme');
-      const tree = runner.runSchematic('ng-add-setup-project', {theme: 'custom'}, appTree);
+      const tree = await runner.runSchematicAsync('ng-add-setup-project',
+          {theme: 'custom'}, appTree).toPromise();
 
       expect(tree.readContent('/projects/material/custom-theme.scss')).toBe('custom-theme',
           'Expected the old custom theme content to be unchanged.');