Commit aa1e3108d6e28ba36656d85c2c6cdb7f01aa719f
1 parent
2417cffc
Exists in
master
and in
18 other branches
Added removed listener to DiscussionBlockComponent
Showing
5 changed files
with
79 additions
and
87 deletions
Show diff stats
src/app/article/types/blog/blog.component.spec.ts
1 | -import { | ||
2 | -providers | ||
3 | -} from 'ng-forward/cjs/testing/providers'; | ||
4 | - | ||
5 | -import { | ||
6 | -Input, | ||
7 | -Component | ||
8 | -} from 'ng-forward'; | ||
9 | -import { | ||
10 | -ArticleBlogComponent | ||
11 | -} from './blog.component'; | ||
12 | - | ||
13 | -import { | ||
14 | -createComponentFromClass, | ||
15 | -quickCreateComponent, | ||
16 | -provideEmptyObjects, | ||
17 | -createProviderToValue, | ||
18 | -provideFilters | ||
19 | -} from "../../../../spec/helpers.ts"; | 1 | +import {providers} from 'ng-forward/cjs/testing/providers'; |
2 | + | ||
3 | +import {Input, provide, Component} from 'ng-forward'; | ||
4 | +import {ArticleBlogComponent} from './blog.component'; | ||
5 | + | ||
6 | +import {createComponentFromClass, quickCreateComponent, provideEmptyObjects, createProviderToValue, provideFilters} from "../../../../spec/helpers.ts"; | ||
7 | + | ||
8 | +import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper'; | ||
20 | 9 | ||
21 | // this htmlTemplate will be re-used between the container components in this spec file | 10 | // this htmlTemplate will be re-used between the container components in this spec file |
22 | const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>'; | 11 | const htmlTemplate: string = '<noosfero-blog [article]="ctrl.article" [profile]="ctrl.profile"></noosfero-blog>'; |
@@ -42,38 +31,30 @@ describe("Blog Component", () => { | @@ -42,38 +31,30 @@ describe("Blog Component", () => { | ||
42 | } | 31 | } |
43 | } | 32 | } |
44 | 33 | ||
34 | + let article1 = <noosfero.Article>{ | ||
35 | + id: 1, | ||
36 | + title: 'The article test' | ||
37 | + }; | ||
38 | + | ||
39 | + let article2 = <noosfero.Article>{ | ||
40 | + id: 1, | ||
41 | + title: 'The article test' | ||
42 | + }; | ||
43 | + | ||
44 | + let articles = [ article1, article2 ]; | ||
45 | + | ||
45 | let articleService = { | 46 | let articleService = { |
46 | getChildren: (article_id: number, filters: {}) => { | 47 | getChildren: (article_id: number, filters: {}) => { |
47 | return promiseResultTemplate(null); | 48 | return promiseResultTemplate(null); |
48 | - } | 49 | + }, |
50 | + subscribeToArticleRemoved: (fn: Function) => {} | ||
49 | }; | 51 | }; |
50 | 52 | ||
51 | - @Component({ | ||
52 | - selector: 'test-container-component', | ||
53 | - template: htmlTemplate, | ||
54 | - directives: [ArticleBlogComponent], | ||
55 | - providers: [ | ||
56 | - provideEmptyObjects('Restangular'), | ||
57 | - createProviderToValue('ArticleService', articleService), | ||
58 | - provideFilters('truncateFilter') | ||
59 | - ] | ||
60 | - }) | ||
61 | - class BlogContainerComponent { | ||
62 | - article = { | ||
63 | - type: 'anyArticleType' | ||
64 | - }; | ||
65 | - profile = { | ||
66 | - name: 'profile-name' | ||
67 | - }; | ||
68 | - } | 53 | + let helper: ComponentTestHelper<ArticleBlogComponent>; |
69 | 54 | ||
70 | - beforeEach(() => { | 55 | + beforeEach(angular.mock.module("templates")); |
71 | 56 | ||
72 | - // the karma preprocessor html2js transform the templates html into js files which put | ||
73 | - // the templates to the templateCache into the module templates | ||
74 | - // we need to load the module templates here as the template for the | ||
75 | - // component Noosfero ArtileView will be load on our tests | ||
76 | - angular.mock.module("templates"); | 57 | + beforeEach((done) => { |
77 | 58 | ||
78 | providers((provide: any) => { | 59 | providers((provide: any) => { |
79 | return <any>[ | 60 | return <any>[ |
@@ -82,48 +63,26 @@ describe("Blog Component", () => { | @@ -82,48 +63,26 @@ describe("Blog Component", () => { | ||
82 | }) | 63 | }) |
83 | ]; | 64 | ]; |
84 | }); | 65 | }); |
85 | - }); | ||
86 | - | ||
87 | - it("renders the blog content", (done: Function) => { | ||
88 | - | ||
89 | - createComponentFromClass(BlogContainerComponent).then((fixture) => { | ||
90 | - | ||
91 | - expect(fixture.debugElement.query('div.blog').length).toEqual(1); | ||
92 | - | ||
93 | - done(); | 66 | + let providersHelper = [ |
67 | + provide('ArticleService', { useValue: articleService }) | ||
68 | + ]; | ||
69 | + let cls = createClass({ | ||
70 | + template: htmlTemplate, | ||
71 | + directives: [ArticleBlogComponent], | ||
72 | + providers: providersHelper, | ||
73 | + properties: { | ||
74 | + posts: articles | ||
75 | + } | ||
94 | }); | 76 | }); |
77 | + helper = new ComponentTestHelper<ArticleBlogComponent>(cls, done); | ||
95 | }); | 78 | }); |
96 | 79 | ||
97 | - it("verify the blog data", (done: Function) => { | ||
98 | - | ||
99 | - let articles = [{ | ||
100 | - id: 1, | ||
101 | - title: 'The article test' | ||
102 | - }]; | ||
103 | - | ||
104 | - let result = { data: articles, headers: (name: string) => { return 1; } }; | ||
105 | - | ||
106 | - // defining a mock result to articleService.getChildren method | ||
107 | - articleService.getChildren = (article_id: number, filters: {}) => { | ||
108 | - return promiseResultTemplate(result); | ||
109 | - }; | ||
110 | - | ||
111 | - createComponentFromClass(BlogContainerComponent).then((fixture) => { | ||
112 | - | ||
113 | - // gets the children component of BlogContainerComponent | ||
114 | - let articleBlog: BlogContainerComponent = fixture.debugElement.componentViewChildren[0].componentInstance; | ||
115 | - | ||
116 | - // check if the component property are the provided by the mocked articleService | ||
117 | - let post = { | ||
118 | - id: 1, | ||
119 | - title: 'The article test' | ||
120 | - }; | ||
121 | - expect((<any>articleBlog)["posts"][0]).toEqual(jasmine.objectContaining(post)); | ||
122 | - expect((<any>articleBlog)["totalPosts"]).toEqual(1); | ||
123 | - | ||
124 | - done(); | ||
125 | - }); | 80 | + it("renders the blog content", () => { |
81 | + expect(helper.debugElement.query('div.blog').length).toEqual(1); | ||
82 | + }); | ||
126 | 83 | ||
84 | + it("verify the blog data", () => { | ||
85 | + expect(helper.component["posts"][0]).toEqual(jasmine.objectContaining(article1)); | ||
127 | }); | 86 | }); |
128 | 87 | ||
129 | }); | 88 | }); |
130 | \ No newline at end of file | 89 | \ No newline at end of file |
src/lib/ng-noosfero-api/http/article.service.ts
@@ -37,8 +37,6 @@ export class ArticleService extends RestangularService<noosfero.Article> { | @@ -37,8 +37,6 @@ export class ArticleService extends RestangularService<noosfero.Article> { | ||
37 | * Notify listeners that this article has been removed | 37 | * Notify listeners that this article has been removed |
38 | */ | 38 | */ |
39 | private notifyArticleRemovedListeners(article: noosfero.Article) { | 39 | private notifyArticleRemovedListeners(article: noosfero.Article) { |
40 | - // let listener = this.events.get(this.removed); | ||
41 | - // listener.next(article); | ||
42 | this.articleRemoved.next(article); | 40 | this.articleRemoved.next(article); |
43 | } | 41 | } |
44 | 42 |
@@ -0,0 +1,10 @@ | @@ -0,0 +1,10 @@ | ||
1 | +export class Arrays { | ||
2 | + | ||
3 | + static remove<T extends noosfero.RestModel>(elements: T[], element: T) { | ||
4 | + elements.forEach((value: T, index: number, array: T[]) => { | ||
5 | + if (value.id == element.id) { | ||
6 | + array.splice(index, 1); | ||
7 | + } | ||
8 | + }); | ||
9 | + } | ||
10 | +} | ||
0 | \ No newline at end of file | 11 | \ No newline at end of file |
src/plugins/comment_paragraph/block/discussion/discussion-block.component.spec.ts
@@ -3,6 +3,7 @@ import {Provider, Input, provide, Component} from 'ng-forward'; | @@ -3,6 +3,7 @@ import {Provider, Input, provide, Component} from 'ng-forward'; | ||
3 | import {provideFilters} from '../../../../spec/helpers'; | 3 | import {provideFilters} from '../../../../spec/helpers'; |
4 | import {DiscussionBlockComponent} from './discussion-block.component'; | 4 | import {DiscussionBlockComponent} from './discussion-block.component'; |
5 | import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper'; | 5 | import {ComponentTestHelper, createClass} from './../../../../spec/component-test-helper'; |
6 | +import * as helpers from "./../../../../spec/helpers"; | ||
6 | 7 | ||
7 | const htmlTemplate: string = '<noosfero-comment-paragraph-plugin-discussion-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-comment-paragraph-plugin-discussion-block>'; | 8 | const htmlTemplate: string = '<noosfero-comment-paragraph-plugin-discussion-block [block]="ctrl.block" [owner]="ctrl.owner"></noosfero-comment-paragraph-plugin-discussion-block>'; |
8 | 9 | ||
@@ -13,11 +14,13 @@ describe("Components", () => { | @@ -13,11 +14,13 @@ describe("Components", () => { | ||
13 | 14 | ||
14 | let helper: ComponentTestHelper<DiscussionBlockComponent>; | 15 | let helper: ComponentTestHelper<DiscussionBlockComponent>; |
15 | let settingsObj = {}; | 16 | let settingsObj = {}; |
17 | + let article = <noosfero.Article>{ name: "article1" }; | ||
16 | let mockedBlockService = { | 18 | let mockedBlockService = { |
17 | getApiContent: (content: any): any => { | 19 | getApiContent: (content: any): any => { |
18 | - return Promise.resolve({ articles: [{ name: "article1" }], headers: (name: string) => { return name; } }); | 20 | + return Promise.resolve({ articles: [ article ], headers: (name: string) => { return name; } }); |
19 | } | 21 | } |
20 | }; | 22 | }; |
23 | + let articleService: any = helpers.mocks.articleService; | ||
21 | let profile = { name: 'profile-name' }; | 24 | let profile = { name: 'profile-name' }; |
22 | 25 | ||
23 | let state = jasmine.createSpyObj("state", ["go"]); | 26 | let state = jasmine.createSpyObj("state", ["go"]); |
@@ -27,6 +30,7 @@ describe("Components", () => { | @@ -27,6 +30,7 @@ describe("Components", () => { | ||
27 | new Provider('BlockService', { | 30 | new Provider('BlockService', { |
28 | useValue: mockedBlockService | 31 | useValue: mockedBlockService |
29 | }), | 32 | }), |
33 | + new Provider('ArticleService', { useValue: articleService }) | ||
30 | ].concat(provideFilters("truncateFilter", "stripTagsFilter", "translateFilter", "amDateFormatFilter")); | 34 | ].concat(provideFilters("truncateFilter", "stripTagsFilter", "translateFilter", "amDateFormatFilter")); |
31 | 35 | ||
32 | beforeEach(angular.mock.module("templates")); | 36 | beforeEach(angular.mock.module("templates")); |
@@ -51,5 +55,17 @@ describe("Components", () => { | @@ -51,5 +55,17 @@ describe("Components", () => { | ||
51 | block.openDocument({ path: "path", profile: { identifier: "identifier" } }); | 55 | block.openDocument({ path: "path", profile: { identifier: "identifier" } }); |
52 | expect(state.go).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "identifier" }); | 56 | expect(state.go).toHaveBeenCalledWith("main.profile.page", { page: "path", profile: "identifier" }); |
53 | }); | 57 | }); |
58 | + | ||
59 | + it("verify removed article has been removed from list", () => { | ||
60 | + expect(helper.component.documents.length).toEqual(1); | ||
61 | + simulateRemovedEvent(); | ||
62 | + expect(helper.component.documents.length).toEqual(0); | ||
63 | + }); | ||
64 | + /** | ||
65 | + * Simulate the ArticleService ArticleEvent.removed event | ||
66 | + */ | ||
67 | + function simulateRemovedEvent() { | ||
68 | + helper.component.articleService["notifyArticleRemovedListeners"](article); | ||
69 | + } | ||
54 | }); | 70 | }); |
55 | }); | 71 | }); |
src/plugins/comment_paragraph/block/discussion/discussion-block.component.ts
1 | import {Component, Inject, Input} from "ng-forward"; | 1 | import {Component, Inject, Input} from "ng-forward"; |
2 | import {BlockService} from "../../../../lib/ng-noosfero-api/http/block.service"; | 2 | import {BlockService} from "../../../../lib/ng-noosfero-api/http/block.service"; |
3 | +import {ArticleService} from "./../../../../lib/ng-noosfero-api/http/article.service" | ||
4 | +import {Arrays} from "./../../../../lib/util/arrays" | ||
3 | 5 | ||
4 | @Component({ | 6 | @Component({ |
5 | selector: "noosfero-comment-paragraph-plugin-discussion-block", | 7 | selector: "noosfero-comment-paragraph-plugin-discussion-block", |
6 | templateUrl: 'plugins/comment_paragraph/block/discussion/discussion-block.html' | 8 | templateUrl: 'plugins/comment_paragraph/block/discussion/discussion-block.html' |
7 | }) | 9 | }) |
8 | -@Inject(BlockService, "$state") | 10 | +@Inject(BlockService, "$state", ArticleService) |
9 | export class DiscussionBlockComponent { | 11 | export class DiscussionBlockComponent { |
10 | 12 | ||
11 | @Input() block: any; | 13 | @Input() block: any; |
@@ -14,7 +16,7 @@ export class DiscussionBlockComponent { | @@ -14,7 +16,7 @@ export class DiscussionBlockComponent { | ||
14 | profile: noosfero.Profile; | 16 | profile: noosfero.Profile; |
15 | documents: Array<noosfero.Article>; | 17 | documents: Array<noosfero.Article>; |
16 | 18 | ||
17 | - constructor(private blockService: BlockService, private $state: any) { } | 19 | + constructor(private blockService: BlockService, private $state: any, public articleService: ArticleService) { } |
18 | 20 | ||
19 | ngOnInit() { | 21 | ngOnInit() { |
20 | this.profile = this.owner; | 22 | this.profile = this.owner; |
@@ -22,6 +24,13 @@ export class DiscussionBlockComponent { | @@ -22,6 +24,13 @@ export class DiscussionBlockComponent { | ||
22 | this.documents = content.articles; | 24 | this.documents = content.articles; |
23 | this.block.hide = !this.documents || this.documents.length === 0; | 25 | this.block.hide = !this.documents || this.documents.length === 0; |
24 | }); | 26 | }); |
27 | + this.watchArticles(); | ||
28 | + } | ||
29 | + | ||
30 | + watchArticles() { | ||
31 | + this.articleService.subscribeToArticleRemoved((article: noosfero.Article) => { | ||
32 | + Arrays.remove(this.documents, article); | ||
33 | + }); | ||
25 | } | 34 | } |
26 | 35 | ||
27 | openDocument(article: any) { | 36 | openDocument(article: any) { |