diff --git a/components/file-upload/file-drop.directive.spec.ts b/components/file-upload/file-drop.directive.spec.ts index 264e409..da2bcc4 100644 --- a/components/file-upload/file-drop.directive.spec.ts +++ b/components/file-upload/file-drop.directive.spec.ts @@ -1,20 +1,27 @@ -import {Component} from '@angular/core'; -import {it, inject, beforeEachProviders} from '@angular/core/testing'; -import {ComponentFixture} from '@angular/compiler/testing'; -import {FileUploader} from './file-uploader.class'; -import {FileSelectDirective} from './file-select.directive'; +import { Component} from '@angular/core'; +import { inject, ComponentFixture, TestBed } from '@angular/core/testing'; + +import { FileUploader } from './file-uploader.class'; +import { FileUploadModule } from './file-upload.module'; + @Component({ selector: 'container', - template: ``, - directives: [FileSelectDirective] + template: `` }) export class ContainerComponent { public uploader:FileUploader = new FileUploader({url: 'localhost:3000'}); } + describe('Directive: FileSelectDirective', () => { - beforeEachProviders(() => [ - ContainerComponent - ]); + + beforeEach(() => { + TestBed.configureTestingModule({ + imports: [FileUploadModule], + declarations: [ContainerComponent], + providers: [ContainerComponent] + }); + }); + it('should be fine', inject([ContainerComponent], (fixture:ComponentFixture) => { expect(fixture).not.toBeNull(); })); diff --git a/components/file-upload/file-upload.module.ts b/components/file-upload/file-upload.module.ts new file mode 100644 index 0000000..258c2bb --- /dev/null +++ b/components/file-upload/file-upload.module.ts @@ -0,0 +1,13 @@ +import { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; + +import { FileDropDirective } from './file-drop.directive'; +import { FileSelectDirective } from './file-select.directive'; + +@NgModule({ + imports: [CommonModule], + declarations: [FileDropDirective, FileSelectDirective], + exports: [FileDropDirective, FileSelectDirective] +}) +export class FileUploadModule { +} diff --git a/demo/app.component.ts b/demo/app.component.ts new file mode 100644 index 0000000..9a0a4ba --- /dev/null +++ b/demo/app.component.ts @@ -0,0 +1,34 @@ +import {Component} from '@angular/core'; + +let gettingStarted = require('./getting-started.md'); + +@Component({ + selector: 'app', + template: ` + + + ng2-file-upload + The Angular2 File Upload directives + View on GitHub + + + + + + + + + ${gettingStarted} + + + + + + ` +}) +export class DemoComponent { +} diff --git a/demo/components/file-upload-section.ts b/demo/components/file-upload-section.ts index eb4d586..c7ca4b3 100644 --- a/demo/components/file-upload-section.ts +++ b/demo/components/file-upload-section.ts @@ -1,10 +1,5 @@ import {Component} from '@angular/core'; -import {CORE_DIRECTIVES} from '@angular/common'; -import {TAB_DIRECTIVES} from 'ng2-bootstrap/ng2-bootstrap'; -import {SimpleDemoComponent} from './file-upload/simple-demo'; - -let name = 'File Upload'; let doc = require('../../components/file-upload/readme.md'); let tabDesc:Array = [ @@ -16,13 +11,16 @@ let tabDesc:Array = [ } ]; -let tabsContent:string = ``; -tabDesc.forEach((desc:any) => { - tabsContent += ` - +@Component({ + selector: 'file-upload-section', + template: ` + + + + - <${desc.heading.toLowerCase()}-demo *ngIf="currentHeading === '${desc.heading}'">${desc.heading.toLowerCase()}-demo> + @@ -30,48 +28,38 @@ tabDesc.forEach((desc:any) => { - ${desc.html} + - ${desc.ts} + - ${desc.js} + - `; -}); - -@Component({ - selector: 'file-upload-section', - template: ` - - - - - ${tabsContent} - API - ${doc} + - `, - directives: [SimpleDemoComponent, TAB_DIRECTIVES, CORE_DIRECTIVES] + ` }) export class FileUploadSectionComponent { + public name:string = 'File Upload'; public currentHeading:string = 'Simple'; + public doc:string = doc; + public tabs:any = tabDesc; public select(e:any):void { if (e.heading) { diff --git a/demo/components/file-upload/simple-demo.ts b/demo/components/file-upload/simple-demo.ts index cd0bf52..10ce86b 100644 --- a/demo/components/file-upload/simple-demo.ts +++ b/demo/components/file-upload/simple-demo.ts @@ -1,6 +1,5 @@ -import {Component} from '@angular/core'; -import {CORE_DIRECTIVES, FORM_DIRECTIVES, NgClass, NgStyle} from '@angular/common'; -import {FILE_UPLOAD_DIRECTIVES, FileUploader} from '../../../ng2-file-upload'; +import { Component } from '@angular/core'; +import { FileUploader } from '../../../ng2-file-upload'; // webpack html imports let template = require('./simple-demo.html'); @@ -10,8 +9,7 @@ const URL = 'https://evening-anchorage-3159.herokuapp.com/api/'; @Component({ selector: 'simple-demo', - template: template, - directives: [FILE_UPLOAD_DIRECTIVES, NgClass, NgStyle, CORE_DIRECTIVES, FORM_DIRECTIVES] + template: template }) export class SimpleDemoComponent { public uploader:FileUploader = new FileUploader({url: URL}); diff --git a/demo/index.ts b/demo/index.ts index 2ee024c..c732090 100644 --- a/demo/index.ts +++ b/demo/index.ts @@ -1,44 +1,4 @@ -import {bootstrap} from '@angular/platform-browser-dynamic'; -import {Component} from '@angular/core'; -import {NgClass} from '@angular/common'; +import { platformBrowserDynamic } from '@angular/platform-browser-dynamic'; +import { NgFileUploadDemo } from './ng2-file-upload-demo.module'; -import {FileUploadSectionComponent} from './components/file-upload-section'; - -let gettingStarted = require('./getting-started.md'); - -@Component({ - selector: 'app', - template: ` - - - ng2-file-upload - The Angular2 File Upload directives - View on GitHub - - - - - - - - - ${gettingStarted} - - - - - - `, - directives: [ - NgClass, - FileUploadSectionComponent - ] -}) -export class DemoComponent { -} - -bootstrap(DemoComponent); +platformBrowserDynamic().bootstrapModule(NgFileUploadDemo); diff --git a/demo/ng2-file-upload-demo.module.ts b/demo/ng2-file-upload-demo.module.ts new file mode 100644 index 0000000..016a61f --- /dev/null +++ b/demo/ng2-file-upload-demo.module.ts @@ -0,0 +1,18 @@ +import { CommonModule } from '@angular/common'; +import { NgModule } from '@angular/core'; +import { FormsModule } from '@angular/forms'; +import { BrowserModule } from '@angular/platform-browser'; + +import { Ng2BootstrapModule } from 'ng2-bootstrap/ng2-bootstrap'; +import { FileUploadModule } from '../components/file-upload/file-upload.module'; +import { DemoComponent } from './app.component.ts'; +import { FileUploadSectionComponent } from './components/file-upload-section'; +import { SimpleDemoComponent } from './components/file-upload/simple-demo'; + +@NgModule({ + imports: [BrowserModule, CommonModule, FileUploadModule, Ng2BootstrapModule, FormsModule], + declarations: [DemoComponent, FileUploadSectionComponent, SimpleDemoComponent], + bootstrap: [DemoComponent] +}) +export class NgFileUploadDemo { +} diff --git a/ng2-file-upload.ts b/ng2-file-upload.ts index 353f03c..804af65 100644 --- a/ng2-file-upload.ts +++ b/ng2-file-upload.ts @@ -2,13 +2,4 @@ export * from './components/file-upload/file-select.directive'; export * from './components/file-upload/file-drop.directive'; export * from './components/file-upload/file-uploader.class'; -import {FileSelectDirective} from './components/file-upload/file-select.directive'; -import {FileDropDirective} from './components/file-upload/file-drop.directive'; - -export const FILE_UPLOAD_DIRECTIVES:[any] = [FileSelectDirective, FileDropDirective]; - -export default { - directives: [ - FILE_UPLOAD_DIRECTIVES - ] -}; +export { FileUploadModule } from './components/file-upload/file-upload.module'; diff --git a/package.json b/package.json index b8db312..2eebf9b 100644 --- a/package.json +++ b/package.json @@ -48,15 +48,16 @@ "homepage": "https://github.com/valor-software/ng2-file-upload#readme", "dependencies": {}, "peerDependencies": { - "@angular/common": "^2.0.0-rc.1", - "@angular/core": "^2.0.0-rc.1" + "@angular/common": "2.0.0-rc.6", + "@angular/core": "2.0.0-rc.6" }, "devDependencies": { - "@angular/common": "^2.0.0-rc.1", - "@angular/compiler": "^2.0.0-rc.1", - "@angular/core": "^2.0.0-rc.1", - "@angular/platform-browser": "^2.0.0-rc.1", - "@angular/platform-browser-dynamic": "^2.0.0-rc.1", + "@angular/common": "2.0.0-rc.6", + "@angular/compiler": "2.0.0-rc.6", + "@angular/core": "2.0.0-rc.6", + "@angular/platform-browser": "2.0.0-rc.6", + "@angular/platform-browser-dynamic": "2.0.0-rc.6", + "@angular/forms": "2.0.0-rc.6", "async": "1.5.2", "bootstrap": "3.3.6", "codecov": "1.0.1", @@ -92,7 +93,7 @@ "lite-server": "2.2.0", "markdown-loader": "0.1.7", "marked": "0.3.5", - "ng2-bootstrap": "1.0.17", + "ng2-bootstrap": "1.1.1", "phantomjs-polyfill": "0.0.2", "phantomjs-prebuilt": "2.1.7", "pre-commit": "1.1.3", @@ -101,7 +102,7 @@ "raw-loader": "0.5.1", "reflect-metadata": "0.1.2", "require-dir": "0.3.0", - "rxjs": "5.0.0-beta.6", + "rxjs": "5.0.0-beta.11", "source-map-loader": "0.1.5", "systemjs-builder": "0.15.19", "ts-loader": "0.8.2", @@ -110,7 +111,7 @@ "typings": "0.8.1", "webpack": "1.13.1", "webpack-dev-server": "1.14.1", - "zone.js": "0.6.12" + "zone.js": "0.6.17" }, "contributors": [ { diff --git a/test.bundle.js b/test.bundle.js index 9ade857..c2d6e67 100644 --- a/test.bundle.js +++ b/test.bundle.js @@ -17,18 +17,21 @@ require('es6-promise'); require('es6-shim'); require('es7-reflect-metadata/dist/browser'); -// require('zone.js'); -require('zone.js/dist/zone.js'); -require('zone.js/dist/long-stack-trace-zone.js'); -require('zone.js/dist/jasmine-patch.js'); -require('zone.js/dist/async-test.js'); +require('zone.js/dist/zone'); +require('zone.js/dist/long-stack-trace-zone'); +require('zone.js/dist/async-test'); +require('zone.js/dist/fake-async-test'); +require('zone.js/dist/sync-test'); +require('zone.js/dist/proxy'); +require('zone.js/dist/jasmine-patch'); var testing = require('@angular/core/testing'); var browser = require('@angular/platform-browser-dynamic/testing'); -testing.setBaseTestProviders( - browser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS, - browser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS); +testing.TestBed.initTestEnvironment( + browser.BrowserDynamicTestingModule, + browser.platformBrowserDynamicTesting() +); /* Ok, this is kinda crazy. We can use the the context method on
The Angular2 File Upload directives
${desc.html}
${desc.ts}
${desc.js}