Renamed AlertsComponent to AlertComponent and added tests

src/app/shared/alert/alert.component.spec.ts

@@ -0,0 +1,114 @@
+import { ChangeDetectorRef, Component, NO_ERRORS_SCHEMA } from '@angular/core';
+import { BrowserModule, By } from '@angular/platform-browser';
+import { CommonModule } from '@angular/common';
+import { async, ComponentFixture, inject, TestBed } from '@angular/core/testing';
+import { NoopAnimationsModule } from '@angular/platform-browser/animations';
+
+import { TranslateModule } from '@ngx-translate/core';
+
+import { AlertComponent } from './alert.component';
+import { createTestComponent } from '../testing/utils';
+import { AlertType } from './aletr-type';
+
+describe('AlertComponent test suite', () => {
+
+  let comp: AlertComponent;
+  let compAsAny: any;
+  let fixture: ComponentFixture<AlertComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      imports: [
+        BrowserModule,
+        CommonModule,
+        NoopAnimationsModule,
+        TranslateModule.forRoot()
+      ],
+      declarations: [
+        AlertComponent,
+        TestComponent
+      ],
+      providers: [
+        ChangeDetectorRef,
+        AlertComponent
+      ],
+      schemas: [NO_ERRORS_SCHEMA]
+    }).compileComponents().then();
+  }));
+
+  describe('', () => {
+    let testComp: TestComponent;
+    let testFixture: ComponentFixture<TestComponent>;
+
+    // synchronous beforeEach
+    beforeEach(() => {
+      const html = `
+        <ds-alert [content]="content" [dismissible]="dismissible" [type]="type"></ds-alert>`;
+
+      testFixture = createTestComponent(html, TestComponent) as ComponentFixture<TestComponent>;
+      testComp = testFixture.componentInstance;
+    });
+
+    afterEach(() => {
+      testFixture.destroy();
+    });
+
+    it('should create AlertComponent', inject([AlertComponent], (app: AlertComponent) => {
+
+      expect(app).toBeDefined();
+    }));
+  });
+
+  describe('', () => {
+    beforeEach(() => {
+      fixture = TestBed.createComponent(AlertComponent);
+      comp = fixture.componentInstance;
+      compAsAny = comp;
+      comp.content = 'test alert';
+      comp.dismissible = true;
+      comp.type = AlertType.Info;
+      fixture.detectChanges();
+    });
+
+    it('should display close icon when dismissible is true', () => {
+
+      const btn = fixture.debugElement.query(By.css('.close'));
+      expect(btn).toBeDefined();
+    });
+
+    it('should not display close icon when dismissible is false', () => {
+      comp.dismissible = false;
+      fixture.detectChanges();
+
+      const btn = fixture.debugElement.query(By.css('.close'));
+      expect(btn).toBeDefined();
+    });
+
+    it('should dismiss alert when click on close icon', () => {
+      spyOn(comp, 'dismiss');
+      const btn = fixture.debugElement.query(By.css('.close'));
+
+      btn.nativeElement.click();
+
+      expect(comp.dismiss).toHaveBeenCalled();
+    });
+
+    afterEach(() => {
+      fixture.destroy();
+      comp = null;
+      compAsAny = null;
+    });
+  });
+});
+
+// declare a test component
+@Component({
+  selector: 'ds-test-cmp',
+  template: ``
+})
+class TestComponent {
+
+  content = 'test alert';
+  dismissible = true;
+  type = AlertType.Info;
+}

src/app/shared/alert/alert.component.ts

@@ -1,7 +1,7 @@
 import { ChangeDetectorRef, Component, EventEmitter, Input, Output, ViewEncapsulation } from '@angular/core';
 import { trigger } from '@angular/animations';
 
-import { AlertType } from './aletrs-type';
+import { AlertType } from './aletr-type';
 import { fadeOutLeave, fadeOutState } from '../animations/fade';
 
 /**
@@ -15,10 +15,10 @@ import { fadeOutLeave, fadeOutState } from '../animations/fade';
       fadeOutLeave, fadeOutState,
     ])
   ],
-  templateUrl: './alerts.component.html',
+  templateUrl: './alert.component.html',
-  styleUrls: ['./alerts.component.scss']
+  styleUrls: ['./alert.component.scss']
 })
-export class AlertsComponent {
+export class AlertComponent {
 
   /**
    * The alert content

src/app/shared/shared.module.ts

@@ -76,7 +76,7 @@ import { NumberPickerComponent } from './number-picker/number-picker.component';
 import { DsDatePickerComponent } from './form/builder/ds-dynamic-form-ui/models/date-picker/date-picker.component';
 import { DsDynamicLookupComponent } from './form/builder/ds-dynamic-form-ui/models/lookup/dynamic-lookup.component';
 import { MockAdminGuard } from './mocks/mock-admin-guard.service';
-import { AlertsComponent } from './alerts/alerts.component';
+import { AlertComponent } from './alert/alert.component';
 import { ObjNgFor } from './utils/object-ngfor.pipe';
 import { BrowseByComponent } from './browse-by/browse-by.component';
 import { BrowseEntryListElementComponent } from './object-list/browse-entry-list-element/browse-entry-list-element.component';
@@ -140,7 +140,7 @@ const PIPES = [
 
 const COMPONENTS = [
   // put shared components here
-  AlertsComponent,
+  AlertComponent,
   AuthNavMenuComponent,
   ChipsComponent,
   ComcolPageContentComponent,

src/app/submission/sections/container/section-container.component.ts

@@ -3,7 +3,7 @@ import { Component, Injector, Input, OnInit, ViewChild } from '@angular/core';
 import { SectionsDirective } from '../sections.directive';
 import { SectionDataObject } from '../models/section-data.model';
 import { rendersSectionType } from '../sections-decorator';
-import { AlertType } from '../../../shared/alerts/aletrs-type';
+import { AlertType } from '../../../shared/alert/aletr-type';
 
 /**
  * This component represents a section that contains the submission license form.

src/app/submission/sections/upload/section-upload.component.ts

@@ -15,7 +15,7 @@ import { SectionsType } from '../sections-type';
 import { renderSectionFor } from '../sections-decorator';
 import { SectionDataObject } from '../models/section-data.model';
 import { SubmissionObjectEntry } from '../../objects/submission-objects.reducer';
-import { AlertType } from '../../../shared/alerts/aletrs-type';
+import { AlertType } from '../../../shared/alert/aletr-type';
 import { RemoteData } from '../../../core/data/remote-data';
 import { Group } from '../../../core/eperson/models/group.model';
 import { SectionsService } from '../sections.service';