feat(upgrade): provide unit test helpers for wiring up injectors (#16848)

Adds two new helper functions that can be used when unit testing Angular services
that depend upon upgraded AngularJS services, or vice versa.
The functions return a module (AngularJS or NgModule) that is configured to wire up
the Angular and AngularJS injectors without the need to actually bootstrap a full
hybrid application.

This makes it simpler and faster to unit test services.

PR Close #16848

packages/examples/upgrade/static/ts/full/module.spec.ts

@@ -0,0 +1,46 @@
+/**
+ * @license
+ * Copyright Google Inc. All Rights Reserved.
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://angular.io/license
+ */
+
+// #docregion angular-setup
+import {TestBed} from '@angular/core/testing';
+import {createAngularJSTestingModule, createAngularTestingModule} from '@angular/upgrade/static/testing';
+
+import {HeroesService, Ng2AppModule, ng1AppModule} from './module';
+
+const {module, inject} = (window as any).angular.mock;
+
+// #enddocregion angular-setup
+describe('HeroesService (from Angular)', () => {
+
+  // #docregion angular-setup
+  beforeEach(() => {
+    TestBed.configureTestingModule(
+        {imports: [createAngularTestingModule([ng1AppModule.name]), Ng2AppModule]});
+  });
+  // #enddocregion angular-setup
+
+  // #docregion angular-spec
+  it('should have access to the HeroesService', () => {
+    const heroesService = TestBed.get(HeroesService) as HeroesService;
+    expect(heroesService).toBeDefined();
+  });
+  // #enddocregion angular-spec
+});
+
+
+describe('HeroesService (from AngularJS)', () => {
+  // #docregion angularjs-setup
+  beforeEach(module(createAngularJSTestingModule([Ng2AppModule])));
+  beforeEach(module(ng1AppModule.name));
+  // #enddocregion angularjs-setup
+
+  // #docregion angularjs-spec
+  it('should have access to the HeroesService',
+     inject((heroesService: HeroesService) => { expect(heroesService).toBeDefined(); }));
+  // #enddocregion angularjs-spec
+});

packages/examples/upgrade/static/ts/full/module.ts

@@ -13,13 +13,13 @@ import {UpgradeComponent, UpgradeModule, downgradeComponent, downgradeInjectable
 
 declare var angular: ng.IAngularStatic;
 
-interface Hero {
+export interface Hero {
   name: string;
   description: string;
 }
 
 // #docregion ng1-text-formatter-service
-class TextFormatter {
+export class TextFormatter {
   titleCase(value: string) { return value.replace(/((^|\s)[a-z])/g, (_, c) => c.toUpperCase()); }
 }
 
@@ -38,7 +38,7 @@ class TextFormatter {
              </div>
              <button (click)="addHero.emit()">Add Hero</button>`,
 })
-class Ng2HeroesComponent {
+export class Ng2HeroesComponent {
   @Input() heroes !: Hero[];
   @Output() addHero = new EventEmitter();
   @Output() removeHero = new EventEmitter();
@@ -48,7 +48,7 @@ class Ng2HeroesComponent {
 // #docregion ng2-heroes-service
 // This Angular service will be "downgraded" to be used in AngularJS
 @Injectable()
-class HeroesService {
+export class HeroesService {
   heroes: Hero[] = [
     {name: 'superman', description: 'The man of steel'},
     {name: 'wonder woman', description: 'Princess of the Amazons'},
@@ -74,7 +74,7 @@ class HeroesService {
 // #docregion ng1-hero-wrapper
 // This Angular directive will act as an interface to the "upgraded" AngularJS component
 @Directive({selector: 'ng1-hero'})
-class Ng1HeroComponentWrapper extends UpgradeComponent {
+export class Ng1HeroComponentWrapper extends UpgradeComponent {
   // The names of the input and output properties here must match the names of the
   // `<` and `&` bindings in the AngularJS component that is being wrapped
   @Input() hero !: Hero;
@@ -104,7 +104,7 @@ class Ng1HeroComponentWrapper extends UpgradeComponent {
   imports: [BrowserModule, UpgradeModule]
 })
 // #docregion bootstrap-ng1
-class Ng2AppModule {
+export class Ng2AppModule {
   // #enddocregion ng2-module
   constructor(private upgrade: UpgradeModule) {}
 
@@ -122,7 +122,7 @@ class Ng2AppModule {
 // #docregion Angular 1 Stuff
 // #docregion ng1-module
 // This Angular 1 module represents the AngularJS pieces of the application
-const ng1AppModule = angular.module('ng1AppModule', []);
+export const ng1AppModule: ng.IModule = angular.module('ng1AppModule', []);
 // #enddocregion
 
 // #docregion ng1-hero

packages/examples/upgrade/upgrade_example.bzl

@@ -17,10 +17,13 @@ def create_upgrade_example_targets(name, srcs, e2e_srcs, entry_module, assets =
         type_check = False,
         deps = [
             "@npm//@types/angular",
+            "@npm//@types/jasmine",
             "//packages/core",
             "//packages/platform-browser",
             "//packages/platform-browser-dynamic",
             "//packages/upgrade/static",
+            "//packages/core/testing",
+            "//packages/upgrade/static/testing",
         ],
         tsconfig = "//packages/examples/upgrade:tsconfig-build.json",
     )