-
Notifications
You must be signed in to change notification settings - Fork 358
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
bugfix(ts): changed
file.types type to work with both ts 2.0 and 2.…
…1. (closes #236) (#241) * fix file.types type to work with both ts 2.0 and 2.1 * unit tests for file-drop.directive * initial unit testing for file-select.directive * fix tslint errors * upgrade depdencies to @angular@2.4.2 and TS@2.1.4 * added unit tests for file-upload.component * upgrade tslint and codelyzer for 2.1.4 support * moved some rules into the tsconfig.json * fix linting issues with upgraded tslint
- Loading branch information
1 parent
b297746
commit 48cdbca
Showing
22 changed files
with
543 additions
and
146 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
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
231 changes: 231 additions & 0 deletions
231
src/platform/core/file/directives/file-drop.directive.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,231 @@ | ||
| import { | ||
| TestBed, | ||
| inject, | ||
| async, | ||
| ComponentFixture, | ||
| } from '@angular/core/testing'; | ||
| import { Component, DebugElement } from '@angular/core'; | ||
| import { CovalentFileModule, TdFileDropDirective } from '../file.module'; | ||
| import { By } from '@angular/platform-browser'; | ||
|
|
||
| describe('Directive: FileDrop', () => { | ||
|
|
||
| beforeEach(async(() => { | ||
| TestBed.configureTestingModule({ | ||
| declarations: [ | ||
| TdFileDropBasicTestComponent, | ||
| ], | ||
| imports: [ | ||
| CovalentFileModule.forRoot(), | ||
| ], | ||
| }); | ||
| TestBed.compileComponents(); | ||
| })); | ||
|
|
||
| it('should add/remove class on dragenter and dragleave', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = false; | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| directive.triggerEventHandler('dragenter', new Event('dragenter')); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(directive.classes['drop-zone']).toBeTruthy(); | ||
| directive.triggerEventHandler('dragleave', new Event('dragleave')); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(directive.classes['drop-zone']).toBeFalsy(); | ||
| }); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should disable element and not add class on dragenter', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.disabled = true; | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| directive.triggerEventHandler('dragenter', new Event('dragenter')); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(directive.classes['drop-zone']).toBeFalsy(); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should throw dragover event and add copy dropEffect for a single file', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = false; | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('dragover'); | ||
| event.dataTransfer = { | ||
| dropEffect: 'none', | ||
| types: ['Files'], | ||
| items: ['file-name.txt'], | ||
| }; | ||
| directive.triggerEventHandler('dragover', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(event.dataTransfer.dropEffect).toBe('copy'); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should throw dragover event and not add copy dropEffect for a multiple file', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = false; | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('dragover'); | ||
| event.dataTransfer = { | ||
| dropEffect: 'none', | ||
| types: ['Files'], | ||
| items: ['file-name.txt', 'file-name1.txt'], | ||
| }; | ||
| directive.triggerEventHandler('dragover', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(event.dataTransfer.dropEffect).toBe('none'); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should throw dragover event and add copy dropEffect for a multiple file', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = true; | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('dragover'); | ||
| event.dataTransfer = { | ||
| dropEffect: 'none', | ||
| types: ['Files'], | ||
| items: ['file-name.txt', 'file-name1.txt'], | ||
| }; | ||
| directive.triggerEventHandler('dragover', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(event.dataTransfer.dropEffect).toBe('copy'); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should throw dragover event and not add copy dropEffect on disabled state', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = false; | ||
| component.disabled = true; | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('dragover'); | ||
| event.dataTransfer = { | ||
| dropEffect: 'none', | ||
| types: ['Files'], | ||
| items: ['file-name.txt'], | ||
| }; | ||
| directive.triggerEventHandler('dragover', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(event.dataTransfer.dropEffect).toBe('none'); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should throw ondrop event for a single file', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = false; | ||
| expect(component.files).toBeFalsy(); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('drop'); | ||
| event.dataTransfer = { | ||
| files: [{}], | ||
| }; | ||
| directive.triggerEventHandler('drop', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(component.files).toBeTruthy(); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should throw ondrop event for a multiple files', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.multiple = true; | ||
| expect(component.files).toBeFalsy(); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('drop'); | ||
| event.dataTransfer = { | ||
| files: [{}, {}], | ||
| }; | ||
| directive.triggerEventHandler('drop', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect((<FileList>component.files).length).toBe(2); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| it('should not throw ondrop event for disabled state', | ||
| async(inject([], () => { | ||
| let fixture: ComponentFixture<any> = TestBed.createComponent(TdFileDropBasicTestComponent); | ||
| let component: TdFileDropBasicTestComponent = fixture.debugElement.componentInstance; | ||
| component.disabled = true; | ||
| expect(component.files).toBeFalsy(); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| let directive: DebugElement = fixture.debugElement.query(By.directive(TdFileDropDirective)); | ||
| let event: any = <DragEvent>new Event('drop'); | ||
| event.dataTransfer = { | ||
| files: [{}], | ||
| }; | ||
| directive.triggerEventHandler('drop', event); | ||
| fixture.detectChanges(); | ||
| fixture.whenStable().then(() => { | ||
| expect(component.files).toBeFalsy(); | ||
| }); | ||
| }); | ||
| }))); | ||
|
|
||
| }); | ||
|
|
||
| @Component({ | ||
| selector: 'td-file-drop-basic-test', | ||
| template: ` | ||
| <div tdFileDrop | ||
| [multiple]="multiple" | ||
| [disabled]="disabled" | ||
| (fileDrop)="files = $event"> | ||
| </div> | ||
| `, | ||
| }) | ||
| class TdFileDropBasicTestComponent { | ||
| multiple: boolean; | ||
| disabled: boolean; | ||
| files: FileList | File; | ||
| } |
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
Oops, something went wrong.