tests(theme-shared): fix confirmation and toaster tests

npm/ng-packs/packages/theme-shared/src/lib/tests/confirmation.service.spec.ts

@@ -3,9 +3,10 @@ import { Component } from '@angular/core';
 import { RouterTestingModule } from '@angular/router/testing';
 import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
 import { NgxsModule } from '@ngxs/store';
-import { OAuthService } from 'angular-oauth2-oidc';
+import { MessageService } from 'primeng/components/common/messageservice';
 import { ConfirmationService } from '../services/confirmation.service';
 import { ThemeSharedModule } from '../theme-shared.module';
+import { OAuthModule, OAuthService } from 'angular-oauth2-oidc';
 
 @Component({
   selector: 'abp-dummy',
@@ -23,6 +24,7 @@ describe('ConfirmationService', () => {
   const createComponent = createComponentFactory({
     component: DummyComponent,
     imports: [CoreModule, ThemeSharedModule.forRoot(), NgxsModule.forRoot(), RouterTestingModule],
+    providers: [MessageService],
     mocks: [OAuthService],
   });
 
@@ -30,4 +32,45 @@ describe('ConfirmationService', () => {
     spectator = createComponent();
     service = spectator.get(ConfirmationService);
   });
+
+  test('should display a confirmation popup', () => {
+    service.info('test', 'title');
+
+    spectator.detectChanges();
+
+    expect(spectator.query('div.confirmation .title')).toHaveText('title');
+    expect(spectator.query('div.confirmation .message')).toHaveText('test');
+  });
+
+  test('should close with ESC key', done => {
+    service.info('test', 'title').subscribe(() => {
+      setTimeout(() => {
+        spectator.detectComponentChanges();
+        expect(spectator.query('div.confirmation')).toBeFalsy();
+        done();
+      }, 0);
+    });
+
+    spectator.detectChanges();
+    expect(spectator.query('div.confirmation')).toBeTruthy();
+    spectator.dispatchKeyboardEvent('div.confirmation', 'keyup', 'Escape');
+  });
+
+  test('should close when click cancel button', done => {
+    service.info('test', 'title', { yesText: 'Sure', cancelText: 'Exit' }).subscribe(() => {
+      spectator.detectComponentChanges();
+      setTimeout(() => {
+        expect(spectator.query('div.confirmation')).toBeFalsy();
+        done();
+      }, 0);
+    });
+
+    spectator.detectChanges();
+
+    expect(spectator.query('div.confirmation')).toBeTruthy();
+    expect(spectator.query('button#cancel')).toHaveText('Exit');
+    expect(spectator.query('button#confirm')).toHaveText('Sure');
+
+    spectator.click('button#cancel');
+  });
 });

npm/ng-packs/packages/theme-shared/src/lib/tests/error.handler.spec.ts

@@ -128,7 +128,6 @@ describe('ErrorHandler', () => {
     );
     spectator.detectChanges();
 
-    console.warn(spectator.query('.confirmation'));
     expect(spectator.query('.title')).toHaveText('test message');
     expect(spectator.query('.confirmation .message')).toHaveText('test detail');
   });

npm/ng-packs/packages/theme-shared/src/lib/tests/toaster.service.spec.ts

@@ -3,6 +3,7 @@ import { Component } from '@angular/core';
 import { RouterTestingModule } from '@angular/router/testing';
 import { createComponentFactory, Spectator } from '@ngneat/spectator/jest';
 import { NgxsModule } from '@ngxs/store';
+import { MessageService } from 'primeng/components/common/messageservice';
 import { ToasterService } from '../services/toaster.service';
 import { ThemeSharedModule } from '../theme-shared.module';
 import { OAuthService } from 'angular-oauth2-oidc';
@@ -10,7 +11,7 @@ import { OAuthService } from 'angular-oauth2-oidc';
 @Component({
   selector: 'abp-dummy',
   template: `
-    <abp-toast></abp-toast>
+    <abp-toast-container></abp-toast-container>
   `,
 })
 class DummyComponent {
@@ -23,6 +24,7 @@ describe('ToasterService', () => {
   const createComponent = createComponentFactory({
     component: DummyComponent,
     imports: [CoreModule, ThemeSharedModule.forRoot(), NgxsModule.forRoot(), RouterTestingModule],
+    providers: [MessageService],
     mocks: [OAuthService],
   });
 
@@ -30,4 +32,58 @@ describe('ToasterService', () => {
     spectator = createComponent();
     service = spectator.get(ToasterService);
   });
+
+  test('should display an error toast', () => {
+    service.error('test', 'title');
+
+    spectator.detectChanges();
+
+    expect(spectator.query('div.toast')).toBeTruthy();
+    expect(spectator.query('.toast-icon i')).toHaveClass('fa-times-circle');
+    expect(spectator.query('div.toast-title')).toHaveText('title');
+    expect(spectator.query('div.toast-message')).toHaveText('test');
+  });
+
+  test('should display a warning toast', () => {
+    service.warn('test', 'title');
+    spectator.detectChanges();
+    expect(spectator.query('.toast-icon i')).toHaveClass('fa-exclamation-triangle');
+  });
+
+  test('should display a success toast', () => {
+    service.success('test', 'title');
+    spectator.detectChanges();
+    expect(spectator.query('.toast-icon i')).toHaveClass('fa-check-circle');
+  });
+
+  test('should display an info toast', () => {
+    service.info('test', 'title');
+    spectator.detectChanges();
+    expect(spectator.query('.toast-icon i')).toHaveClass('fa-info-circle');
+  });
+
+  test('should display multiple toasts', () => {
+    service.info('detail1', 'summary1');
+    service.info('detail2', 'summary2');
+
+    spectator.detectChanges();
+    expect(spectator.queryAll('div.toast-title').map(node => node.textContent.trim())).toEqual([
+      'summary1',
+      'summary2',
+    ]);
+    expect(spectator.queryAll('div.toast-message').map(node => node.textContent.trim())).toEqual([
+      'detail1',
+      'detail2',
+    ]);
+  });
+
+  test('should remove the opened toasts', () => {
+    service.info('test', 'title');
+    spectator.detectChanges();
+    expect(spectator.query('div.toast')).toBeTruthy();
+
+    service.clear();
+    spectator.detectChanges();
+    expect(spectator.query('p-div.toast')).toBeFalsy();
+  });
 });