fix(angular): host tests were failing due to no navigation (#11825)

nrwl · Sep 2, 2022 · 458e89b · 458e89b
1 parent 525350f
commit 458e89b
Show file tree

Hide file tree

Showing 4 changed files with 172 additions and 0 deletions.
diff --git a/packages/angular/src/generators/host/__snapshots__/host.spec.ts.snap b/packages/angular/src/generators/host/__snapshots__/host.spec.ts.snap
@@ -64,3 +64,89 @@ export class AppComponent {
   title = 'host';
 }"
 `;
+
+exports[`Host App Generator should generate the correct app component spec file 1`] = `
+"import { fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import { NxWelcomeComponent } from './nx-welcome.component';
+import { RouterTestingModule } from '@angular/router/testing';
+import { Router } from '@angular/router';
+
+describe('AppComponent', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule.withRoutes([
+          { path: '', component: NxWelcomeComponent },
+        ]),
+      ],
+      declarations: [AppComponent, NxWelcomeComponent],
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(\`should have as title 'host'\`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('host');
+  });
+
+  it('should render title', fakeAsync(() => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const router = TestBed.inject(Router);
+    fixture.ngZone?.run(() => router.navigate(['']));
+    tick();
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('h1')?.textContent).toContain('Welcome host');
+  }));
+});"
+`;
+
+exports[`Host App Generator should generate the correct app component spec file with a directory 1`] = `
+"import { fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import { NxWelcomeComponent } from './nx-welcome.component';
+import { RouterTestingModule } from '@angular/router/testing';
+import { Router } from '@angular/router';
+
+describe('AppComponent', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule.withRoutes([
+          { path: '', component: NxWelcomeComponent },
+        ]),
+      ],
+      declarations: [AppComponent, NxWelcomeComponent],
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(\`should have as title 'test-dashboard'\`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('test-dashboard');
+  });
+
+  it('should render title', fakeAsync(() => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const router = TestBed.inject(Router);
+    fixture.ngZone?.run(() => router.navigate(['']));
+    tick();
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('h1')?.textContent).toContain('Welcome test-dashboard');
+  }));
+});"
+`;
diff --git a/packages/angular/src/generators/host/files/app.component.spec.ts__tmpl__ b/packages/angular/src/generators/host/files/app.component.spec.ts__tmpl__
@@ -0,0 +1,40 @@
+import { fakeAsync, TestBed, tick } from '@angular/core/testing';
+import { AppComponent } from './app.component';
+import { NxWelcomeComponent } from './nx-welcome.component';
+import { RouterTestingModule } from '@angular/router/testing';
+import { Router } from '@angular/router';
+
+describe('AppComponent', () => {
+  beforeEach(async () => {
+    await TestBed.configureTestingModule({
+      imports: [
+        RouterTestingModule.withRoutes([
+          { path: '', component: NxWelcomeComponent },
+        ]),
+      ],
+      declarations: [AppComponent, NxWelcomeComponent],
+    }).compileComponents();
+  });
+
+  it('should create the app', () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app).toBeTruthy();
+  });
+
+  it(`should have as title '<%= appName %>'`, () => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const app = fixture.componentInstance;
+    expect(app.title).toEqual('<%= appName %>');
+  });
+
+  it('should render title', fakeAsync(() => {
+    const fixture = TestBed.createComponent(AppComponent);
+    const router = TestBed.inject(Router);
+    fixture.ngZone?.run(() => router.navigate(['']));
+    tick();
+    fixture.detectChanges();
+    const compiled = fixture.nativeElement as HTMLElement;
+    expect(compiled.querySelector('h1')?.textContent).toContain('Welcome <%= appName %>');
+  }));
+});
diff --git a/packages/angular/src/generators/host/host.spec.ts b/packages/angular/src/generators/host/host.spec.ts
@@ -131,4 +131,39 @@ describe('Host App Generator', () => {
       tree.read(`apps/host/src/app/app.component.ts`, 'utf-8')
     ).toMatchSnapshot();
   });
+
+  it('should generate the correct app component spec file', async () => {
+    // ARRANGE
+    const tree = createTreeWithEmptyWorkspace();
+
+    // ACT
+    await host(tree, {
+      name: 'host',
+      remotes: ['remote1'],
+      standalone: true,
+    });
+
+    // ASSERT
+    expect(
+      tree.read(`apps/host/src/app/app.component.spec.ts`, 'utf-8')
+    ).toMatchSnapshot();
+  });
+
+  it('should generate the correct app component spec file with a directory', async () => {
+    // ARRANGE
+    const tree = createTreeWithEmptyWorkspace();
+
+    // ACT
+    await host(tree, {
+      name: 'dashboard',
+      remotes: ['remote1'],
+      directory: 'test',
+      standalone: true,
+    });
+
+    // ASSERT
+    expect(
+      tree.read(`apps/test/dashboard/src/app/app.component.spec.ts`, 'utf-8')
+    ).toMatchSnapshot();
+  });
 });
diff --git a/packages/angular/src/generators/host/host.ts b/packages/angular/src/generators/host/host.ts
@@ -1,5 +1,6 @@
 import {
   formatFiles,
+  generateFiles,
   getProjects,
   joinPathFragments,
   names,
@@ -142,4 +143,14 @@ ${remoteRoutes}
     ${tree.read(pathToHostRootRoutingFile, 'utf-8')}`
     );
   }
+
+  generateFiles(
+    tree,
+    joinPathFragments(__dirname, 'files'),
+    joinPathFragments(sourceRoot, 'app'),
+    {
+      appName: normalizeProjectName(options.name, options.directory),
+      tmpl: '',
+    }
+  );
 }