docs: rename heros to heroes

This commit is contained in:
Foxandxss 2016-05-01 23:04:47 +02:00
parent ddfbbb5ebb
commit 6c0c6357a9
5 changed files with 70 additions and 70 deletions

View File

@ -1,6 +1,6 @@
<h1 id="top">Component Communication Cookbook</h1> <h1 id="top">Component Communication Cookbook</h1>
<a href="#parent-to-child">Pass data from parent to child with input binding ("Heros")</a><br/> <a href="#parent-to-child">Pass data from parent to child with input binding ("Heroes")</a><br/>
<a href="#parent-to-child-setter">Intercept input property changes with a setter ("Master")</a><br/> <a href="#parent-to-child-setter">Intercept input property changes with a setter ("Master")</a><br/>
<a href="#parent-to-child-on-changes">Intercept input property changes with <i>ngOnChanges</i> ("Source code version")</a><br/> <a href="#parent-to-child-on-changes">Intercept input property changes with <i>ngOnChanges</i> ("Source code version")</a><br/>
<a href="#child-to-parent">Parent listens for child event ("Colonize Universe")</a><br/> <a href="#child-to-parent">Parent listens for child event ("Colonize Universe")</a><br/>

View File

@ -6,17 +6,17 @@ import {Hero} from './hero';
export class HeroService { export class HeroService {
//TODO move to database //TODO move to database
private _heros:Array<Hero> = [ private _heroes:Array<Hero> = [
new Hero(1, 'RubberMan','Hero of many talents', '123-456-7899'), new Hero(1, 'RubberMan','Hero of many talents', '123-456-7899'),
new Hero(2, 'Magma','Hero of all trades', '555-555-5555'), new Hero(2, 'Magma','Hero of all trades', '555-555-5555'),
new Hero(3, 'Mr. Nice','The name says it all','111-222-3333') new Hero(3, 'Mr. Nice','The name says it all','111-222-3333')
]; ];
getHeroById(id:number):Hero{ getHeroById(id:number):Hero{
return this._heros.filter(hero => hero.id === id)[0]; return this._heroes.filter(hero => hero.id === id)[0];
} }
getAllHeroes():Array<Hero>{ getAllHeroes():Array<Hero>{
return this._heros; return this._heroes;
} }
} }

View File

@ -9,157 +9,157 @@ describe('Dependency Injection Tests', function () {
}); });
describe('Cars:', function() { describe('Cars:', function() {
it('DI car displays as expected', function () { it('DI car displays as expected', function () {
expectedMsg = 'DI car with 4 cylinders and Flintstone tires.'; expectedMsg = 'DI car with 4 cylinders and Flintstone tires.';
expect(element(by.css('#di')).getText()).toEqual(expectedMsg); expect(element(by.css('#di')).getText()).toEqual(expectedMsg);
}); });
it('No DI car displays as expected', function () { it('No DI car displays as expected', function () {
expectedMsg = 'No DI car with 4 cylinders and Flintstone tires.'; expectedMsg = 'No DI car with 4 cylinders and Flintstone tires.';
expect(element(by.css('#nodi')).getText()).toEqual(expectedMsg); expect(element(by.css('#nodi')).getText()).toEqual(expectedMsg);
}); });
it('Injector car displays as expected', function () { it('Injector car displays as expected', function () {
expectedMsg = 'Injector car with 4 cylinders and Flintstone tires.'; expectedMsg = 'Injector car with 4 cylinders and Flintstone tires.';
expect(element(by.css('#injector')).getText()).toEqual(expectedMsg); expect(element(by.css('#injector')).getText()).toEqual(expectedMsg);
}); });
it('Factory car displays as expected', function () { it('Factory car displays as expected', function () {
expectedMsg = 'Factory car with 4 cylinders and Flintstone tires.'; expectedMsg = 'Factory car with 4 cylinders and Flintstone tires.';
expect(element(by.css('#factory')).getText()).toEqual(expectedMsg); expect(element(by.css('#factory')).getText()).toEqual(expectedMsg);
}); });
it('Simple car displays as expected', function () { it('Simple car displays as expected', function () {
expectedMsg = 'Simple car with 4 cylinders and Flintstone tires.'; expectedMsg = 'Simple car with 4 cylinders and Flintstone tires.';
expect(element(by.css('#simple')).getText()).toEqual(expectedMsg); expect(element(by.css('#simple')).getText()).toEqual(expectedMsg);
}); });
it('Super car displays as expected', function () { it('Super car displays as expected', function () {
expectedMsg = 'Super car with 12 cylinders and Flintstone tires.'; expectedMsg = 'Super car with 12 cylinders and Flintstone tires.';
expect(element(by.css('#super')).getText()).toEqual(expectedMsg); expect(element(by.css('#super')).getText()).toEqual(expectedMsg);
}); });
it('Test car displays as expected', function () { it('Test car displays as expected', function () {
expectedMsg = 'Test car with 8 cylinders and YokoGoodStone tires.'; expectedMsg = 'Test car with 8 cylinders and YokoGoodStone tires.';
expect(element(by.css('#test')).getText()).toEqual(expectedMsg); expect(element(by.css('#test')).getText()).toEqual(expectedMsg);
}); });
}); });
describe('Other Injections:', function() { describe('Other Injections:', function() {
it('DI car displays as expected', function () { it('DI car displays as expected', function () {
expectedMsg = 'DI car with 4 cylinders and Flintstone tires.'; expectedMsg = 'DI car with 4 cylinders and Flintstone tires.';
expect(element(by.css('#car')).getText()).toEqual(expectedMsg); expect(element(by.css('#car')).getText()).toEqual(expectedMsg);
}); });
it('Hero displays as expected', function () { it('Hero displays as expected', function () {
expectedMsg = 'Mr. Nice'; expectedMsg = 'Mr. Nice';
expect(element(by.css('#hero')).getText()).toEqual(expectedMsg); expect(element(by.css('#hero')).getText()).toEqual(expectedMsg);
}); });
it('Optional injection displays as expected', function () { it('Optional injection displays as expected', function () {
expectedMsg = 'R.O.U.S.\'s? I don\'t think they exist!'; expectedMsg = 'R.O.U.S.\'s? I don\'t think they exist!';
expect(element(by.css('#rodent')).getText()).toEqual(expectedMsg); expect(element(by.css('#rodent')).getText()).toEqual(expectedMsg);
}); });
}); });
describe('Tests:', function() { describe('Tests:', function() {
it('Tests display as expected', function () { it('Tests display as expected', function () {
expectedMsg = /Tests passed/; expectedMsg = /Tests passed/;
expect(element(by.css('#tests')).getText()).toMatch(expectedMsg); expect(element(by.css('#tests')).getText()).toMatch(expectedMsg);
}); });
}); });
describe('Provider variations:', function() { describe('Provider variations:', function() {
it('P1 (class) displays as expected', function () { it('P1 (class) displays as expected', function () {
expectedMsg = 'Hello from logger provided with Logger class'; expectedMsg = 'Hello from logger provided with Logger class';
expect(element(by.css('#p1')).getText()).toEqual(expectedMsg); expect(element(by.css('#p1')).getText()).toEqual(expectedMsg);
}); });
it('P2 (Provider) displays as expected', function () { it('P2 (Provider) displays as expected', function () {
expectedMsg = 'Hello from logger provided with Provider class and useClass'; expectedMsg = 'Hello from logger provided with Provider class and useClass';
expect(element(by.css('#p2')).getText()).toEqual(expectedMsg); expect(element(by.css('#p2')).getText()).toEqual(expectedMsg);
}); });
it('P3 (provide) displays as expected', function () { it('P3 (provide) displays as expected', function () {
expectedMsg = 'Hello from logger provided with useClass'; expectedMsg = 'Hello from logger provided with useClass';
expect(element(by.css('#p3')).getText()).toEqual(expectedMsg); expect(element(by.css('#p3')).getText()).toEqual(expectedMsg);
}); });
it('P4 (useClass:BetterLogger) displays as expected', function () { it('P4 (useClass:BetterLogger) displays as expected', function () {
expectedMsg = 'Hello from logger provided with useClass:BetterLogger'; expectedMsg = 'Hello from logger provided with useClass:BetterLogger';
expect(element(by.css('#p4')).getText()).toEqual(expectedMsg); expect(element(by.css('#p4')).getText()).toEqual(expectedMsg);
}); });
it('P5 (useClass:EvenBetterLogger - dependency) displays as expected', function () { it('P5 (useClass:EvenBetterLogger - dependency) displays as expected', function () {
expectedMsg = 'Message to Bob: Hello from EvenBetterlogger.'; expectedMsg = 'Message to Bob: Hello from EvenBetterlogger.';
expect(element(by.css('#p5')).getText()).toEqual(expectedMsg); expect(element(by.css('#p5')).getText()).toEqual(expectedMsg);
}); });
it('P6a (no alias) displays as expected', function () { it('P6a (no alias) displays as expected', function () {
expectedMsg = 'Hello OldLogger (but we want NewLogger)'; expectedMsg = 'Hello OldLogger (but we want NewLogger)';
expect(element(by.css('#p6a')).getText()).toEqual(expectedMsg); expect(element(by.css('#p6a')).getText()).toEqual(expectedMsg);
}); });
it('P6b (alias) displays as expected', function () { it('P6b (alias) displays as expected', function () {
expectedMsg = 'Hello from NewLogger (via aliased OldLogger)'; expectedMsg = 'Hello from NewLogger (via aliased OldLogger)';
expect(element(by.css('#p6b')).getText()).toEqual(expectedMsg); expect(element(by.css('#p6b')).getText()).toEqual(expectedMsg);
}); });
it('P7 (useValue) displays as expected', function () { it('P7 (useValue) displays as expected', function () {
expectedMsg = 'Silent logger says "Shhhhh!". Provided via "useValue"'; expectedMsg = 'Silent logger says "Shhhhh!". Provided via "useValue"';
expect(element(by.css('#p7')).getText()).toEqual(expectedMsg); expect(element(by.css('#p7')).getText()).toEqual(expectedMsg);
}); });
it('P8 (useFactory) displays as expected', function () { it('P8 (useFactory) displays as expected', function () {
expectedMsg = 'Hero service injected successfully'; expectedMsg = 'Hero service injected successfully';
expect(element(by.css('#p8')).getText()).toEqual(expectedMsg); expect(element(by.css('#p8')).getText()).toEqual(expectedMsg);
}); });
it('P9a (string token) displays as expected', function () { it('P9a (string token) displays as expected', function () {
expectedMsg = '"app.config" Application title is Dependency Injection'; expectedMsg = '"app.config" Application title is Dependency Injection';
expect(element(by.css('#p9a')).getText()).toEqual(expectedMsg); expect(element(by.css('#p9a')).getText()).toEqual(expectedMsg);
}); });
it('P9b (OpaqueToken) displays as expected', function () { it('P9b (OpaqueToken) displays as expected', function () {
expectedMsg = 'APP_CONFIG Application title is Dependency Injection'; expectedMsg = 'APP_CONFIG Application title is Dependency Injection';
expect(element(by.css('#p9b')).getText()).toEqual(expectedMsg); expect(element(by.css('#p9b')).getText()).toEqual(expectedMsg);
}); });
it('P10a (required dependency) displays as expected', function () { it('P10a (required dependency) displays as expected', function () {
expectedMsg = 'Hello from the required logger.'; expectedMsg = 'Hello from the required logger.';
expect(element(by.css('#p10a')).getText()).toEqual(expectedMsg); expect(element(by.css('#p10a')).getText()).toEqual(expectedMsg);
}); });
it('P10b (optional dependency) displays as expected', function () { it('P10b (optional dependency) displays as expected', function () {
expectedMsg = 'Optional logger was not available.'; expectedMsg = 'Optional logger was not available.';
expect(element(by.css('#p10b')).getText()).toEqual(expectedMsg); expect(element(by.css('#p10b')).getText()).toEqual(expectedMsg);
}) })
}); });
describe('User/Heroes:', function() { describe('User/Heroes:', function() {
it('User is Bob - unauthorized', function () { it('User is Bob - unauthorized', function () {
expectedMsg = /Bob, is not authorized/; expectedMsg = /Bob, is not authorized/;
expect(element(by.css('#user')).getText()).toMatch(expectedMsg); expect(element(by.css('#user')).getText()).toMatch(expectedMsg);
}); });
it('should have button', function () { it('should have button', function () {
expect(element.all(by.cssContainingText('button','Next User')) expect(element.all(by.cssContainingText('button','Next User'))
.get(0).isDisplayed()).toBe(true, "'Next User' button should be displayed"); .get(0).isDisplayed()).toBe(true, "'Next User' button should be displayed");
}); });
it('unauthorized user should have multiple unauthorized heroes', function () { it('unauthorized user should have multiple unauthorized heroes', function () {
var heroes = element.all(by.css('#unauthorized hero-list div')); var heroes = element.all(by.css('#unauthorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0); expect(heroes.count()).toBeGreaterThan(0);
}); });
it('unauthorized user should have no secret heroes', function () { it('unauthorized user should have no secret heroes', function () {
var heroes = element.all(by.css('#unauthorized hero-list div')); var heroes = element.all(by.css('#unauthorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0); expect(heroes.count()).toBeGreaterThan(0);
heroes.filter(function(elem, index){ heroes.filter(function(elem, index){
return elem.getText().then(function(text) { return elem.getText().then(function(text) {
return /secret/.test(text); return /secret/.test(text);
@ -167,34 +167,34 @@ describe('Dependency Injection Tests', function () {
}).then(function(filteredElements) { }).then(function(filteredElements) {
//console.log("******Secret heroes count: "+filteredElements.length); //console.log("******Secret heroes count: "+filteredElements.length);
expect(filteredElements.length).toEqual(0); expect(filteredElements.length).toEqual(0);
}); });
}); });
it('unauthorized user should have no authorized heros listed', function () { it('unauthorized user should have no authorized heroes listed', function () {
expect(element.all(by.css('#authorized hero-list div')).count()).toEqual(0); expect(element.all(by.css('#authorized hero-list div')).count()).toEqual(0);
}); });
describe('after button click', function() { describe('after button click', function() {
beforeAll(function (done) { beforeAll(function (done) {
var buttonEle = element.all(by.cssContainingText('button','Next User')).get(0); var buttonEle = element.all(by.cssContainingText('button','Next User')).get(0);
buttonEle.click().then(done,done); buttonEle.click().then(done,done);
}); });
it('User is Alice - authorized', function () { it('User is Alice - authorized', function () {
expectedMsg = /Alice, is authorized/; expectedMsg = /Alice, is authorized/;
expect(element(by.css('#user')).getText()).toMatch(expectedMsg); expect(element(by.css('#user')).getText()).toMatch(expectedMsg);
}); });
it('authorized user should have multiple authorized heroes ', function () { it('authorized user should have multiple authorized heroes ', function () {
var heroes = element.all(by.css('#authorized hero-list div')); var heroes = element.all(by.css('#authorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0); expect(heroes.count()).toBeGreaterThan(0);
}); });
it('authorized user should have secret heroes', function () { it('authorized user should have secret heroes', function () {
var heroes = element.all(by.css('#authorized hero-list div')); var heroes = element.all(by.css('#authorized hero-list div'));
expect(heroes.count()).toBeGreaterThan(0); expect(heroes.count()).toBeGreaterThan(0);
heroes.filter(function(elem, index){ heroes.filter(function(elem, index){
return elem.getText().then(function(text) { return elem.getText().then(function(text) {
return /secret/.test(text); return /secret/.test(text);
@ -202,12 +202,12 @@ describe('Dependency Injection Tests', function () {
}).then(function(filteredElements) { }).then(function(filteredElements) {
//console.log("******Secret heroes count: "+filteredElements.length); //console.log("******Secret heroes count: "+filteredElements.length);
expect(filteredElements.length).toBeGreaterThan(0); expect(filteredElements.length).toBeGreaterThan(0);
}); });
}); });
it('authorized user should have no unauthorized heros listed', function () { it('authorized user should have no unauthorized heroes listed', function () {
expect(element.all(by.css('#unauthorized hero-list div')).count()).toEqual(0); expect(element.all(by.css('#unauthorized hero-list div')).count()).toEqual(0);
}); });
}); });
}); });
}); });

View File

@ -9,7 +9,7 @@ describe('Hierarchical dependency injection', function () {
"edit button should be displayed"); "edit button should be displayed");
}); });
it('should have multiple heros listed', function () { it('should have multiple heroes listed', function () {
expect(element.all(by.css('heroes-list li')).count()).toBeGreaterThan(1); expect(element.all(by.css('heroes-list li')).count()).toBeGreaterThan(1);
}); });

View File

@ -24,7 +24,7 @@
:marked :marked
In this auxiliary chat experience, it overlays the current screen and persists. In this auxiliary chat experience, it overlays the current screen and persists.
If you navigate from the Heros to Crisis Center, the chat auxiliary route remains If you navigate from the Heroes to Crisis Center, the chat auxiliary route remains
active and in view. active and in view.
Therefore the auxiliary routing is truly independent of the other Therefore the auxiliary routing is truly independent of the other
@ -73,7 +73,7 @@
In the chat components, we can use `RouterLink` to reference routes just the same as In the chat components, we can use `RouterLink` to reference routes just the same as
a normal route. Since this is inside of an Auxiliary route, these relative links will a normal route. Since this is inside of an Auxiliary route, these relative links will
resolve within the chat component and not change the primary route (the Crisis Center or resolve within the chat component and not change the primary route (the Crisis Center or
Heros pages). Heroes pages).
+_makeExample('router/ts/app/chat/chat-init.component.ts', 'chat-links') +_makeExample('router/ts/app/chat/chat-init.component.ts', 'chat-links')