Update ng10 tests

hmil · Oct 10, 2020 · 8ff21fb · 8ff21fb
1 parent a0cc592
commit 8ff21fb
Show file tree

Hide file tree

Showing 2 changed files with 34 additions and 17 deletions.
diff --git a/test/ng10/src/app/app.component.spec.ts b/test/ng10/src/app/app.component.spec.ts
@@ -9,24 +9,24 @@ import { CONSOLE } from './auth/app.providers';
 
 describe('AppComponent', () => {
 
-    let page: Page;
-
     let isAuthenticated: boolean;
 
-    beforeEach(async () => {
+    function createPage() {
         isAuthenticated = false;
         when(getMock(AuthService).isAuthenticated()).useGetter(() => isAuthenticated);
-        page = new Page(await renderComponent(AppComponent, AppModule));
-    });
+        page = new Page(renderComponent(AppComponent, AppModule));
+    }
 
     it('lets user log in when not authenticated', fakeAsync(() => {
+        const page = createPage();
         when(getMock(AuthService).setAuthenticated(true)).return().once();
         page.detectChanges();
         page.loginButton.click();
         expect().nothing();
     }));
 
     it('presents a fancy button when authenticated', fakeAsync(() => {
+        const page = createPage();
         isAuthenticated = true;
         page.detectChanges();
         expect(page.fancyButton.confirmLabel).toBe('Got it');

diff --git a/test/ng10/src/app/fancy-button.component.spec.ts b/test/ng10/src/app/fancy-button.component.spec.ts
@@ -1,23 +1,21 @@
 import { fakeAsync } from '@angular/core/testing';
-import { BasePage, getShallow, renderComponent } from 'ng-vacuum';
+import { BasePage, renderComponent } from 'ng-vacuum';
 
 import { AppModule } from './app.module';
 import { FancyButtonComponent } from './fancy-button.component';
 
 describe('FancyButtonComponent', () => {
 
-    let page: Page;
-
-    it('shows default values', fakeAsync(async () => {
-        page = new Page(await renderComponent(FancyButtonComponent, AppModule));
+    it('shows default values', fakeAsync(() => {
+        const page = new Page(renderComponent(FancyButtonComponent, AppModule));
         expect(page.confirmBtnLabel).toBe('Happy');
         expect(page.cancelBtnLabel).toBe('Sad');
         expect(page.description).toBe('Chose between Happy or Sad');
     }));
 
-    it('shows confirm and cancel labels', fakeAsync(async () => {
-        page = new Page(await getShallow(FancyButtonComponent, AppModule).render({
-            bind: {
+    it('shows confirm and cancel labels', fakeAsync(() => {
+        const page = new Page(renderComponent(FancyButtonComponent, AppModule, {
+            input: {
                 confirmLabel: 'hello',
                 cancelLabel: 'goodbye'
             }
@@ -33,19 +31,38 @@ describe('FancyButtonComponent', () => {
         expect(page.cancelBtnLabel).toBe('Tschuss');
         expect(page.description).toBe('Chose between Gruetzi or Tschuss');
     }));
+
+    it('emits click events', fakeAsync(() => {
+        const page = new Page(renderComponent(FancyButtonComponent, AppModule));
+
+        const emittedValues = page.outputs.clicked.capture();
+        page.confirmBtn.click();
+        expect(emittedValues).toEqual(['confirm']);
+
+        page.cancelBtn.click();
+        expect(emittedValues).toEqual(['confirm', 'cancel']);
+    }));
 });
 
 class Page extends BasePage<FancyButtonComponent> {
 
     get confirmBtnLabel(): string {
-        return (this.rendering.find('[test-id=confirm-btn]').nativeElement as HTMLButtonElement).innerText;
+        return this.confirmBtn.innerText;
     }
 
-    get cancelBtnLabel() {
-        return (this.rendering.find('[test-id=cancel-btn]').nativeElement as HTMLButtonElement).innerText;
+    get cancelBtnLabel(): string {
+        return this.cancelBtn.innerText;
     }
 
-    get description() {
+    get description(): string {
         return (this.rendering.find('[test-id=description]').nativeElement as HTMLDivElement).innerText;
     }
+
+    get confirmBtn(): HTMLButtonElement {
+        return this.rendering.find('[test-id=confirm-btn]').nativeElement;
+    }
+
+    get cancelBtn(): HTMLButtonElement {
+        return this.rendering.find('[test-id=cancel-btn]').nativeElement;
+    }
 }