diff --git a/.travis.yml b/.travis.yml index 7285d0f7..240a96d0 100644 --- a/.travis.yml +++ b/.travis.yml @@ -6,7 +6,7 @@ before_install: - export DISPLAY=:99.0 - sh -e /etc/init.d/xvfb start install: - - npm install zone.js@0.6.21 rxjs@5.0.0-beta.12 @angular/common@2.0.0 @angular/compiler@2.0.0 @angular/core@2.0.0 @angular/platform-browser@2.0.0 @angular/platform-browser-dynamic@2.0.0 + - npm install zone.js@0.6.21 rxjs@5.0.0-beta.12 @angular/common@2.0.2 @angular/compiler@2.0.2 @angular/core@2.0.2 @angular/platform-browser@2.0.2 @angular/platform-browser-dynamic@2.0.2 - npm install script: - npm run build diff --git a/CHANGELOG.md b/CHANGELOG.md index 7ddbbfc5..089a178c 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,3 +1,17 @@ +# 1.0.2 (2016-10-12) +### Bug Fixes +* **toast.component:** Dynamic template data would break `bodyOutputType.Component` rendering. +A forced `detectChanges()` call has been added after the component is created and loaded to enable +this functionality. Additional test cases were added for the gap. Closes +[#71](https://github.com/Stabzs/Angular2-Toaster/issues/71). +* **angular2-toaster.js:** The library entrance attempts to load `Toast` from `./lib/toast`. Since +the `Toast` file is an interface-only file, there is nothing to load. Closes +[#70](https://github.com/Stabzs/Angular2-Toaster/issues/70). + +### Features +* **Angular 2.0.2 Support:** The library has been tested through to Angular 2.0.2. + + # 1.0.1 (2016-09-16) ### Bug Fix * **package.json:** The `typings install` step was incorrectly set in the `postinstall` hook when diff --git a/README.md b/README.md index 3fea9bd1..1b491800 100644 --- a/README.md +++ b/README.md @@ -4,9 +4,9 @@ largely based off of [AngularJS-Toaster](https://github.com/jirikavi/AngularJS-Toaster). [![Build Status](https://travis-ci.org/Stabzs/Angular2-Toaster.svg?branch=master)](https://travis-ci.org/Stabzs/Angular2-Toaster) -[![Coverage Status](https://coveralls.io/repos/github/Stabzs/Angular2-Toaster/badge.svg?branch=master&bump=1.0.1)](https://coveralls.io/github/Stabzs/Angular2-Toaster?branch=master) +[![Coverage Status](https://coveralls.io/repos/github/Stabzs/Angular2-Toaster/badge.svg?branch=master&b=1.0.2)](https://coveralls.io/github/Stabzs/Angular2-Toaster?branch=master) -### Current Version 1.0.1 +### Current Version 1.0.2 ## Installation: diff --git a/angular2-toaster.js b/angular2-toaster.js index 69baf69f..cd9fb1b9 100644 --- a/angular2-toaster.js +++ b/angular2-toaster.js @@ -1,5 +1,4 @@ exports.BodyOutputType = require('./lib/bodyOutputType').BodyOutputType; -exports.Toast = require('./lib/toast').Toast; exports.ToastComponent = require('./lib/toast.component').ToastComponent; exports.ToasterConfig = require('./lib/toaster-config').ToasterConfig; exports.ToasterContainerComponent = require('./lib/toaster-container.component').ToasterContainerComponent; diff --git a/package.json b/package.json index e06212ad..d89203b2 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "angular2-toaster", - "version": "1.0.1", + "version": "1.0.2", "description": "An Angular 2 Toaster Notification library based on AngularJS-Toaster", "main": "angular2-toaster.js", "scripts": { @@ -44,23 +44,23 @@ "rxjs": "5.0.0-beta.12" }, "devDependencies": { - "@angular/compiler-cli": "^0.6.2", - "@angular/platform-server": "^2.0.0", + "@angular/compiler-cli": "^0.6.4", + "@angular/platform-server": "^2.0.2", "core-js": "^2.4.1", - "coveralls": "^2.11.13", + "coveralls": "^2.11.14", "cpx": "^1.5.0", "http-server": "^0.9.0", - "jasmine-core": "2.5.1", + "jasmine-core": "2.5.2", "karma": "1.3.0", "karma-chrome-launcher": "2.0.0", "karma-coverage": "^1.1.1", "karma-jasmine": "1.0.2", "reflect-metadata": "0.1.8", - "remap-istanbul": "^0.6.4", + "remap-istanbul": "^0.7.0", "rimraf": "^2.5.4", - "systemjs": "^0.19.38", - "typescript": "2.0.2", - "typings": "^1.3.3", + "systemjs": "^0.19.39", + "typescript": "2.0.3", + "typings": "^1.4.0", "zone.js": "0.6.21" } -} +} \ No newline at end of file diff --git a/src/toast.component.ts b/src/toast.component.ts index b33e37fa..dd1d8d31 100644 --- a/src/toast.component.ts +++ b/src/toast.component.ts @@ -1,4 +1,5 @@ -import {Component, Input, ViewChild, ViewContainerRef, EventEmitter, ComponentFactoryResolver} +import {Component, Input, ViewChild, ViewContainerRef, EventEmitter, + ComponentFactoryResolver, ChangeDetectorRef} from '@angular/core'; import {DomSanitizer, SafeHtml} from '@angular/platform-browser' @@ -36,7 +37,8 @@ export class ToastComponent { constructor( private sanitizer: DomSanitizer, - private componentFactoryResolver : ComponentFactoryResolver + private componentFactoryResolver : ComponentFactoryResolver, + private changeDetectorRef : ChangeDetectorRef ) {} ngOnInit() { @@ -48,7 +50,8 @@ export class ToastComponent { ngAfterViewInit() { if (this.toast.bodyOutputType === this.bodyOutputType.Component) { let component = this.componentFactoryResolver.resolveComponentFactory(this.toast.body); - this.componentBody.createComponent(component, null, this.componentBody.injector); + this.componentBody.createComponent(component, null, this.componentBody.injector); + this.changeDetectorRef.detectChanges(); } } diff --git a/src/toaster-container.component.spec.ts b/src/toaster-container.component.spec.ts index 15be07ac..02b4d380 100644 --- a/src/toaster-container.component.spec.ts +++ b/src/toaster-container.component.spec.ts @@ -44,6 +44,19 @@ export class TestDynamicComponent { } }) export class TestDynamicComponentModule { } +@Component({ + selector: 'bound-dynamic-component', + template: `
{{someValue}} loaded via component
` +}) +export class TestBoundDynamicComponent { + someValue: string = 'Some value'; +} +@NgModule({ + bootstrap: [TestBoundDynamicComponent], + declarations: [TestBoundDynamicComponent] +}) +export class TestBoundDynamicComponentModule { } + describe('ToasterContainerComponent with sync ToasterService', () => { let toasterService: ToasterService, @@ -937,4 +950,50 @@ describe('Multiple ToasterContainerComponent components', () => { expect(container1.toasts[0].title).toBe('fixture 1'); expect(container2.toasts[0].title).toBe('fixture 2'); }); +}); + +describe('ToasterContainerComponent when included as a component with bindings', () => { + let fixture: ComponentFixture; + + beforeEach(() => { + TestBed.configureTestingModule({ + declarations: [TestComponent], + imports: [ToasterModule, TestBoundDynamicComponentModule] + }); + + fixture = TestBed.createComponent(TestComponent); + }); + + it('should use the bound toasterconfig object if provided', () => { + fixture.detectChanges(); + + expect(fixture.componentInstance).toBeDefined(); + + var container = fixture.debugElement.children[0].componentInstance; + + expect(container).toBeDefined(); + expect(container.toasterconfig).toBeDefined(); + expect(container.toasterconfig.showCloseButton).toBe(true); + expect(container.toasterconfig.tapToDismiss).toBe(false); + expect(container.toasterconfig.timeout).toBe(0); + }); + + + it('should redner the dynamic bound content', () => { + fixture.detectChanges(); + var container = fixture.debugElement.children[0].componentInstance; + var toast: Toast = { + type: 'success', + title: 'Yay', + body: TestBoundDynamicComponent, + bodyOutputType: BodyOutputType.Component + }; + + fixture.componentInstance.toasterService.pop(toast); + fixture.detectChanges(); + expect(container.toasts.length).toBe(1); + + var renderedToast = fixture.nativeElement.querySelector('bound-dynamic-component'); + expect(renderedToast.innerHTML).toBe('
Some value loaded via component
'); + }); }); \ No newline at end of file