Skip to content

Commit

Permalink
feat(library): upgrade to RC6
Browse files Browse the repository at this point in the history
Angular: RC6: The library has been updated to Angular RC6. Closes
#52.
Documentation: Updated to close
#51.
package dependencies: @angular packages and the rxjs package have been
removed from dependencies and added to peerDependencies to allow for
more flexible consumption of alternative builds and configurations.  The
consumer is now responsible to ensure that the correct version is used
per the minimum requirements in
https://github.com/Stabzs/Angular2-Toaster/blob/master/package.json.
Closes #50.
toast.component: Due to Angular2-RC5 deprecating `ComponentResolver` and
Angular2-RC6 removing `ComponentResolver`, dynamic component resolution
has been moved to `Compiler.compileComponentAsync`.
toast.component: Dynamic body rendering via component has been moved to
the `ngAfterViewInit` lifecycle hook to ensure full module compilation
is complete and metadata is attached before attempting to render the
component.
toast.component: RC6 requires that all dynamically rendered components
be enclosed in a `NgModule`.  If a module is not used, an error will be
thrown at runtime.
  • Loading branch information
Stabzs committed Sep 2, 2016
1 parent 95e64c3 commit eebbd01
Show file tree
Hide file tree
Showing 9 changed files with 280 additions and 189 deletions.
27 changes: 27 additions & 0 deletions CHANGELOG.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,30 @@
# 0.5.0-rc.6 (2016-09-01)
### Features
* **Angular: RC6:** The library has been updated to Angular RC6.
Closes [#52](https://github.com/Stabzs/Angular2-Toaster/issues/52).
* **Documentation:** Updated to close
[#51](https://github.com/Stabzs/Angular2-Toaster/issues/51).

### Breaking Changes
* **package dependencies:** @angular packages and the rxjs package have been removed from
dependencies and added to peerDependencies to allow for more flexible consumption of alternative
builds and configurations. The consumer is now responsible to ensure that the correct version is
used per the minimum requirements in
[package.json](https://github.com/Stabzs/Angular2-Toaster/blob/master/package.json).
Closes [#50](https://github.com/Stabzs/Angular2-Toaster/issues/50).

* **toast.component:** Due to Angular2-RC5 deprecating `ComponentResolver` and Angular2-RC6
removing `ComponentResolver`, dynamic component resolution has been moved to
`Compiler.compileComponentAsync`.

* **toast.component:** Dynamic body rendering via component has been moved to the `ngAfterViewInit`
lifecycle hook to ensure full module compilation is complete and metadata is attached before
attempting to render the component.

* **toast.component:** RC6 requires that all dynamically rendered components be enclosed in a
`NgModule`. If a module is not used, an error will be thrown at runtime.


# 0.4.0-rc.5 (2016-08-24)
### Features
* **toast.module:** toast.module renamed to **toaster.module** for greater consistency with other
Expand Down
6 changes: 3 additions & 3 deletions README.md
Original file line number Diff line number Diff line change
Expand Up @@ -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&busted=0.3.6-rc.4)](https://coveralls.io/github/Stabzs/Angular2-Toaster?branch=master)
[![Coverage Status](https://coveralls.io/repos/github/Stabzs/Angular2-Toaster/badge.svg?branch=master&b=0.5.0-rc.6)](https://coveralls.io/github/Stabzs/Angular2-Toaster?branch=master)

### Current Version 0.4.0-rc.5
### Current Version 0.5.0-rc.6

## Installation:

Expand Down Expand Up @@ -56,7 +56,7 @@ A dynamic Angular2 and Typescript demo can be found at

## Getting Started With Default Configuration - NgModule:
```typescript
import {NgModule} from '@angular/core';
import {NgModule, Component} from '@angular/core';
import {ToasterModule, ToasterService} from 'angular2-toaster/angular2-toaster';
import {Root} from './root.component'

Expand Down
2 changes: 1 addition & 1 deletion demo/systemjs/package.json
Original file line number Diff line number Diff line change
Expand Up @@ -24,7 +24,7 @@
"@angular/platform-browser": "2.0.0-rc.5",
"@angular/platform-browser-dynamic": "2.0.0-rc.5",
"rxjs": "5.0.0-beta.6",
"angular2-toaster": "0.4.0-rc.5",
"angular2-toaster": "0.5.0-rc.5",
"es6-shim": "0.35.0",
"http-server": "^0.8.5",
"reflect-metadata": "0.1.3",
Expand Down
129 changes: 44 additions & 85 deletions karma-test-shim.js
Original file line number Diff line number Diff line change
@@ -1,95 +1,54 @@
//Based on https://github.com/mgechev/angular2-seed/blob/master/test-main.js
//Updated with excellent insight from https://github.com/antonybudianto/angular2-starter

// Turn on full stack traces in errors to help debugging
/*global jasmine, __karma__, window*/
Error.stackTraceLimit = Infinity;

jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;

// Cancel Karma's synchronous start,
// we will call `__karma__.start()` later, once all the specs are loaded.
__karma__.loaded = function () { };

var paths = {
'n:*': 'node_modules/*'
};

// map tells the System loader where to look for things
var map = {
'lib': 'lib',
'src': 'src',
'rxjs': 'n:rxjs',
'@angular': 'n:@angular'
__karma__.loaded = function () {
};

var packages = {
'src': { defaultExtension: 'ts', format: 'register' },
'lib': { defaultExtension: 'js' },
'rxjs': { defaultExtension: 'js' }
};

var packageNames = [
'@angular/common',
'@angular/compiler',
'@angular/core',
'@angular/platform-browser',
'@angular/platform-browser-dynamic',
'@angular/testing',
];

// add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
packageNames.forEach(function (pkgName) {
packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
});

var config = {
baseURL: '/base/',
map: map,
packages: packages,
paths: paths
};

System.config(config);


Promise.all([
System.import('@angular/platform-browser/src/browser/browser_adapter'),
System.import('@angular/platform-browser-dynamic/testing'),
System.import('@angular/core/testing'),
]).then(function (modules) {
var browser_adapter = modules[0];
var providers = modules[1];
var testing = modules[2];
testing.setBaseTestProviders(providers.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
providers.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);

browser_adapter.BrowserDomAdapter.makeCurrent();
}).then(function () {
return Promise.all(
Object.keys(window.__karma__.files)
.filter(onlySpecFiles)
.map(file2moduleName)
.map(importModules)
);
})
.then(function () {
__karma__.start();
}, function (error) {
console.error(error.stack || error);
__karma__.start();
});
function isJsFile(path) {
return path.slice(-3) == '.js';
}

function onlySpecFiles(path) {
return /[\.|-]spec\.js$/.test(path);
function isSpecFile(path) {
return /\.spec\.js$/.test(path);
}

// Normalize paths to module names.
function file2moduleName(filePath) {
return filePath.replace(/\\/g, '/')
.replace(/^\/base\//, '')
.replace(/\.js/, '');
function isBuiltFile(path) {
var builtPath = '/base/lib/';
return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
}

function importModules(path) {
return System.import(path);
}
var allSpecFiles = Object.keys(window.__karma__.files)
.filter(isSpecFile)
.filter(isBuiltFile);

System.config({
baseURL: '/base',
packageWithIndex: true
});

System.import('systemjs.config.js')
.then(() => Promise.all([
System.import('@angular/core/testing'),
System.import('@angular/platform-browser-dynamic/testing')
]))
.then((providers) => {
var coreTesting = providers[0];
var browserTesting = providers[1];
coreTesting.TestBed.initTestEnvironment(
browserTesting.BrowserDynamicTestingModule,
browserTesting.platformBrowserDynamicTesting());

})
.then(function () {
// Finally, load all spec files.
// This will run the tests directly.
return Promise.all(
allSpecFiles.map(function (moduleName) {
return System.import(moduleName);
}));
})
.then(__karma__.start, function (error) {
console.error(error.stack || error);
__karma__.start();
});
19 changes: 15 additions & 4 deletions karma.conf.js
Original file line number Diff line number Diff line change
@@ -1,5 +1,5 @@
module.exports = function (config) {
var dependencies = require('./package.json').dependencies;
var dependencies = require('./package.json').peerDependencies;
var excludedDependencies = [
'systemjs', 'zone.js'
];
Expand All @@ -10,17 +10,28 @@ module.exports = function (config) {
frameworks: ['jasmine'],

files: [
'node_modules/reflect-metadata/Reflect.js',
'node_modules/zone.js/dist/zone.js',
'node_modules/zone.js/dist/long-stack-trace-zone.js',
'node_modules/zone.js/dist/proxy.js',
'node_modules/zone.js/dist/sync-test.js',
'node_modules/zone.js/dist/jasmine-patch.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js',
'node_modules/es6-promise/dist/es6-promise.js',
'node_modules/es6-shim/es6-shim.js',
'node_modules/systemjs/dist/system-polyfills.js',
'node_modules/reflect-metadata/Reflect.js',
'node_modules/zone.js/dist/async-test.js',
'node_modules/zone.js/dist/fake-async-test.js',
'node_modules/systemjs/dist/system.src.js',

{ pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false },
{ pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false },

// Angular 2 itself and the testing library
{pattern: 'node_modules/@angular/**/*.js', included: false, watched: false},
{pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false},

{pattern: 'systemjs.config.js', included: false, watched: false},

'karma-test-shim.js',

{ pattern: 'lib/**/*.js', included: false },
Expand Down
26 changes: 13 additions & 13 deletions package.json
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "angular2-toaster",
"version": "0.4.0-rc.5",
"version": "0.5.0-rc.6",
"description": "An Angular 2 Toaster Notification library based on AngularJS-Toaster",
"main": "angular2-toaster.ts",
"scripts": {
Expand Down Expand Up @@ -33,29 +33,29 @@
"url": "https://github.com/stabzs/Angular2-Toaster/issues"
},
"typings": "./angular2-toaster.d.ts",
"dependencies": {
"@angular/common": "^2.0.0-rc.5",
"@angular/compiler": "^2.0.0-rc.5",
"@angular/core": "^2.0.0-rc.5",
"@angular/platform-browser": "^2.0.0-rc.5",
"@angular/platform-browser-dynamic": "^2.0.0-rc.5",
"rxjs": "5.0.0-beta.6"
"peerDependencies": {
"@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",
"rxjs": "5.0.0-beta.11"
},
"devDependencies": {
"coveralls": "^2.11.9",
"cpx": "^1.3.1",
"es6-promise": "3.1.2",
"es6-shim": "0.35.0",
"http-server": "^0.9.0",
"jasmine-core": "2.4.1",
"karma": "^0.13.22",
"jasmine-core": "2.5.0",
"karma": "^1.2.0",
"karma-chrome-launcher": "^1.0.1",
"karma-coverage": "^0.5.5",
"karma-jasmine": "^0.3.8",
"karma-jasmine": "^1.0.2",
"reflect-metadata": "0.1.3",
"remap-istanbul": "^0.6.3",
"systemjs": "^0.19.27",
"typescript": "1.8.10",
"zone.js": "0.6.12"
"zone.js": "0.6.17"
}
}
}
23 changes: 12 additions & 11 deletions src/toast.component.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
import {Component, Input, ViewChild, ComponentResolver, ViewContainerRef, EventEmitter}
import {Component, Input, ViewChild, ViewContainerRef, EventEmitter, ComponentFactoryResolver}
from '@angular/core';
import {DomSanitizationService, SafeHtml} from '@angular/platform-browser'
import {DomSanitizer, SafeHtml} from '@angular/platform-browser'

import {Toast} from './toast';
import {BodyOutputType} from './bodyOutputType';
Expand All @@ -24,7 +24,7 @@ import {BodyOutputType} from './bodyOutputType';
})

export class ToastComponent {

@Input() toast: Toast;
@Input() iconClass: string;
@ViewChild('componentBody', { read: ViewContainerRef }) componentBody: ViewContainerRef;
Expand All @@ -35,22 +35,23 @@ export class ToastComponent {
public clickEvent = new EventEmitter();

constructor(
private resolver: ComponentResolver,
private sanitizer: DomSanitizationService
private sanitizer: DomSanitizer,
private componentFactoryResolver : ComponentFactoryResolver
) {}

ngOnInit() {
if (this.toast.bodyOutputType === this.bodyOutputType.Component) {
this.resolver.resolveComponent(this.toast.body).then(factory => {
this.componentBody.createComponent(factory, 0, this.componentBody.injector);
});
}

if (this.toast.closeHtml) {
this.safeCloseHtml = this.sanitizer.bypassSecurityTrustHtml(this.toast.closeHtml);
}
}

ngAfterViewInit() {
if (this.toast.bodyOutputType === this.bodyOutputType.Component) {
let component = this.componentFactoryResolver.resolveComponentFactory(this.toast.body);
this.componentBody.createComponent(component, null, this.componentBody.injector);
}
}

click(event, toast: Toast) {
event.stopPropagation();
this.clickEvent.emit({
Expand Down
Loading

0 comments on commit eebbd01

Please sign in to comment.