fixed collection selector component after angular 10 upgrade

This commit is contained in:
Giuseppe Digilio
2020-12-02 16:19:26 +01:00
parent b49d46176b
commit 58f1cbe5e5
3 changed files with 45 additions and 40 deletions

View File

@@ -5,7 +5,7 @@
</button>
</div>
<div class="modal-body">
<ds-collection-dropdown (selectionChange)="selectObject($event.collection)">
<ds-collection-dropdown (selectionChange)="selectObject($event)">
</ds-collection-dropdown>
</div>
</div>

View File

@@ -1,28 +1,33 @@
import { async, ComponentFixture, TestBed, fakeAsync, tick } from '@angular/core/testing';
import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
import { ChangeDetectorRef, ElementRef, NO_ERRORS_SCHEMA } from '@angular/core';
import { ActivatedRoute } from '@angular/router';
import { By } from '@angular/platform-browser';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { getTestScheduler, hot } from 'jasmine-marbles';
import { TestScheduler } from 'rxjs/testing';
import { Observable, of } from 'rxjs';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { CollectionSelectorComponent } from './collection-selector.component';
import { CollectionDropdownComponent } from 'src/app/shared/collection-dropdown/collection-dropdown.component';
import { Collection } from 'src/app/core/shared/collection.model';
import { of, Observable } from 'rxjs';
import { RemoteData } from 'src/app/core/data/remote-data';
import { Community } from 'src/app/core/shared/community.model';
import { FindListOptions } from 'src/app/core/data/request.models';
import { FollowLinkConfig } from 'src/app/shared/utils/follow-link-config.model';
import { PaginatedList } from 'src/app/core/data/paginated-list';
import { createSuccessfulRemoteDataObject } from 'src/app/shared/remote-data.utils';
import { PageInfo } from 'src/app/core/shared/page-info.model';
import { TranslateModule, TranslateLoader } from '@ngx-translate/core';
import { TranslateLoaderMock } from 'src/app/shared/mocks/translate-loader.mock';
import { CollectionDataService } from 'src/app/core/data/collection-data.service';
import { ChangeDetectorRef, ElementRef, NO_ERRORS_SCHEMA } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { ActivatedRoute } from '@angular/router';
import { hot } from 'jasmine-marbles';
import { By } from '@angular/platform-browser';
import { CollectionDropdownComponent } from '../../shared/collection-dropdown/collection-dropdown.component';
import { Collection } from '../../core/shared/collection.model';
import { RemoteData } from '../../core/data/remote-data';
import { Community } from '../../core/shared/community.model';
import { FindListOptions } from '../../core/data/request.models';
import { FollowLinkConfig } from '../../shared/utils/follow-link-config.model';
import { PaginatedList } from '../../core/data/paginated-list';
import { createSuccessfulRemoteDataObject } from '../../shared/remote-data.utils';
import { PageInfo } from '../../core/shared/page-info.model';
import { TranslateLoaderMock } from '../../shared/mocks/translate-loader.mock';
import { CollectionDataService } from '../../core/data/collection-data.service';
import { MockElementRef } from '../../shared/testing/element-ref.mock';
describe('CollectionSelectorComponent', () => {
let component: CollectionSelectorComponent;
let fixture: ComponentFixture<CollectionSelectorComponent>;
let scheduler: TestScheduler;
const modal = jasmine.createSpyObj('modal', ['close', 'dismiss']);
const community: Community = Object.assign(new Community(), {
@@ -110,7 +115,7 @@ describe('CollectionSelectorComponent', () => {
}
};
beforeEach(async(() => {
beforeEach(waitForAsync(() => {
TestBed.configureTestingModule({
imports: [
TranslateModule.forRoot({
@@ -123,10 +128,10 @@ describe('CollectionSelectorComponent', () => {
declarations: [ CollectionSelectorComponent, CollectionDropdownComponent ],
providers: [
{provide: CollectionDataService, useValue: collectionDataServiceMock},
{provide: ChangeDetectorRef, useValue: {}},
{provide: ElementRef, userValue: {}},
{provide: ElementRef, useClass: MockElementRef},
{provide: NgbActiveModal, useValue: modal},
{provide: ActivatedRoute, useValue: {}}
{provide: ActivatedRoute, useValue: {}},
ChangeDetectorRef
],
schemas: [NO_ERRORS_SCHEMA]
})
@@ -134,28 +139,25 @@ describe('CollectionSelectorComponent', () => {
}));
beforeEach(() => {
scheduler = getTestScheduler();
fixture = TestBed.createComponent(CollectionSelectorComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
it('should call selectObject', fakeAsync(() => {
it('should call selectObject', () => {
spyOn(component, 'selectObject');
fixture.detectChanges();
tick();
fixture.whenStable().then(() => {
const collectionItem = fixture.debugElement.query(By.css('.collection-item:nth-child(2)'));
collectionItem.triggerEventHandler('click', {
preventDefault: () => {/**/
}
});
expect(component.selectObject).toHaveBeenCalled();
});
}));
scheduler.schedule(() => fixture.detectChanges());
scheduler.flush();
const collectionItem = fixture.debugElement.query(By.css('.collection-item:nth-child(2)'));
collectionItem.triggerEventHandler('click', null);
expect(component.selectObject).toHaveBeenCalled();
});
it('should close the dialog', () => {
component.close();

View File

@@ -1,7 +1,9 @@
import { Component } from '@angular/core';
import { DSpaceObject } from '../../core/shared/dspace-object.model';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { CollectionListEntry } from '../../shared/collection-dropdown/collection-dropdown.component';
/**
* This component displays the dialog that shows the list of selectable collections
* on the MyDSpace page
@@ -18,10 +20,11 @@ export class CollectionSelectorComponent {
/**
* Method called when an element has been selected from collection list.
* Its close the active modal and send selected value to the component container
* @param dso The selected DSpaceObject
*
* @param event The event object containing a CollectionListEntry
*/
selectObject(dso: DSpaceObject) {
this.activeModal.close(dso);
selectObject(event: CollectionListEntry) {
this.activeModal.close(event.collection);
}
/**