forked from DSpace/dspace-angular
-
Notifications
You must be signed in to change notification settings - Fork 0
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
71712: confirmation modal for export + tests &
- request causing error because of issue DSpace#756, commented out for now & - drop event prevention in a HostListener like dragover event
- Loading branch information
1 parent
66cdf9d
commit 3e0f4a5
Showing
9 changed files
with
228 additions
and
14 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
16 changes: 16 additions & 0 deletions
16
src/app/shared/confirmation-modal/confirmation-modal.component.html
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,16 @@ | ||
<div> | ||
<div class="modal-header">{{ headerLabel | translate:{dsoName: dso?.name} }} | ||
<button type="button" class="close" (click)="close()" aria-label="Close"> | ||
<span aria-hidden="true">×</span> | ||
</button> | ||
</div> | ||
<div class="modal-body"> | ||
<p>{{ infoLabel | translate:{dsoName: dso?.name} }}</p> | ||
<button type="button" class="cancel btn btn-secondary" (click)="cancelPressed()" aria-label="Cancel"> | ||
{{ cancelLabel | translate:{dsoName: dso?.name} }} | ||
</button> | ||
<button type="button" class="confirm btn btn-primary" (click)="confirmPressed()" aria-label="Confirm" ngbAutofocus> | ||
{{ confirmLabel | translate:{dsoName: dso?.name} }} | ||
</button> | ||
</div> | ||
</div> |
117 changes: 117 additions & 0 deletions
117
src/app/shared/confirmation-modal/confirmation-modal.component.spec.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,117 @@ | ||
import { DebugElement, NO_ERRORS_SCHEMA } from '@angular/core'; | ||
import { async, ComponentFixture, fakeAsync, TestBed, tick } from '@angular/core/testing'; | ||
import { By } from '@angular/platform-browser'; | ||
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap'; | ||
import { TranslateModule } from '@ngx-translate/core'; | ||
import { ConfirmationModalComponent } from './confirmation-modal.component'; | ||
|
||
describe('ConfirmationModalComponent', () => { | ||
let component: ConfirmationModalComponent; | ||
let fixture: ComponentFixture<ConfirmationModalComponent>; | ||
let debugElement: DebugElement; | ||
|
||
const modalStub = jasmine.createSpyObj('modalStub', ['close']); | ||
|
||
beforeEach(async(() => { | ||
TestBed.configureTestingModule({ | ||
imports: [TranslateModule.forRoot()], | ||
declarations: [ConfirmationModalComponent], | ||
providers: [ | ||
{ provide: NgbActiveModal, useValue: modalStub } | ||
], | ||
schemas: [NO_ERRORS_SCHEMA] | ||
}).compileComponents(); | ||
|
||
})); | ||
|
||
beforeEach(() => { | ||
fixture = TestBed.createComponent(ConfirmationModalComponent); | ||
component = fixture.componentInstance; | ||
debugElement = fixture.debugElement; | ||
fixture.detectChanges(); | ||
}); | ||
|
||
it('should create', () => { | ||
expect(component).toBeTruthy(); | ||
}); | ||
|
||
describe('close', () => { | ||
beforeEach(() => { | ||
component.close(); | ||
}); | ||
it('should call the close method on the active modal', () => { | ||
expect(modalStub.close).toHaveBeenCalled(); | ||
}); | ||
}); | ||
|
||
describe('confirmPressed', () => { | ||
beforeEach(() => { | ||
spyOn(component.response, 'emit'); | ||
component.confirmPressed(); | ||
}); | ||
it('should call the close method on the active modal', () => { | ||
expect(modalStub.close).toHaveBeenCalled(); | ||
}); | ||
it('event emitter should emit true', () => { | ||
expect(component.response.emit).toHaveBeenCalledWith(true); | ||
}); | ||
}); | ||
|
||
describe('cancelPressed', () => { | ||
beforeEach(() => { | ||
spyOn(component.response, 'emit'); | ||
component.cancelPressed(); | ||
}); | ||
it('should call the close method on the active modal', () => { | ||
expect(modalStub.close).toHaveBeenCalled(); | ||
}); | ||
it('event emitter should emit false', () => { | ||
expect(component.response.emit).toHaveBeenCalledWith(false); | ||
}); | ||
}); | ||
|
||
describe('when the click method emits on close button', () => { | ||
beforeEach(fakeAsync(() => { | ||
spyOn(component, 'close'); | ||
debugElement.query(By.css('button.close')).triggerEventHandler('click', {}); | ||
tick(); | ||
fixture.detectChanges(); | ||
})); | ||
it('should call the close method on the component', () => { | ||
expect(component.close).toHaveBeenCalled(); | ||
}); | ||
}); | ||
|
||
describe('when the click method emits on cancel button', () => { | ||
beforeEach(fakeAsync(() => { | ||
spyOn(component, 'close'); | ||
spyOn(component.response, 'emit'); | ||
debugElement.query(By.css('button.cancel')).triggerEventHandler('click', {}); | ||
tick(); | ||
fixture.detectChanges(); | ||
})); | ||
it('should call the close method on the component', () => { | ||
expect(component.close).toHaveBeenCalled(); | ||
}); | ||
it('event emitter should emit false', () => { | ||
expect(component.response.emit).toHaveBeenCalledWith(false); | ||
}); | ||
}); | ||
|
||
describe('when the click method emits on confirm button', () => { | ||
beforeEach(fakeAsync(() => { | ||
spyOn(component, 'close'); | ||
spyOn(component.response, 'emit'); | ||
debugElement.query(By.css('button.confirm')).triggerEventHandler('click', {}); | ||
tick(); | ||
fixture.detectChanges(); | ||
})); | ||
it('should call the close method on the component', () => { | ||
expect(component.close).toHaveBeenCalled(); | ||
}); | ||
it('event emitter should emit true', () => { | ||
expect(component.response.emit).toHaveBeenCalledWith(true); | ||
}); | ||
}); | ||
|
||
}); |
48 changes: 48 additions & 0 deletions
48
src/app/shared/confirmation-modal/confirmation-modal.component.ts
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,48 @@ | ||
import { Component, EventEmitter, Input, Output } from '@angular/core'; | ||
import { ActivatedRoute } from '@angular/router'; | ||
import { NgbActiveModal, NgbModal } from '@ng-bootstrap/ng-bootstrap'; | ||
import { DSpaceObject } from '../../core/shared/dspace-object.model'; | ||
|
||
@Component({ | ||
selector: 'ds-confirmation-modal', | ||
templateUrl: 'confirmation-modal.component.html', | ||
}) | ||
export class ConfirmationModalComponent { | ||
@Input() headerLabel: string; | ||
@Input() infoLabel: string; | ||
@Input() cancelLabel: string; | ||
@Input() confirmLabel: string; | ||
@Input() dso: DSpaceObject; | ||
|
||
/** | ||
* An event fired when the cancel or confirm button is clicked, with respectively false or true | ||
*/ | ||
@Output() | ||
response = new EventEmitter<boolean>(); | ||
|
||
constructor(protected activeModal: NgbActiveModal) { | ||
} | ||
|
||
/** | ||
* Confirm the action that led to the modal | ||
*/ | ||
confirmPressed() { | ||
this.response.emit(true); | ||
this.close(); | ||
} | ||
|
||
/** | ||
* Cancel the action that led to the modal and close modal | ||
*/ | ||
cancelPressed() { | ||
this.response.emit(false); | ||
this.close(); | ||
} | ||
|
||
/** | ||
* Close the modal | ||
*/ | ||
close() { | ||
this.activeModal.close(); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters