Download as
Browse Code »

Commit 132b5d04d78480a9257ec73362e9f3136d76fdd6

Authored by Victor Costa
1 parent 845f879b
Exists in master and in 28 other branches activities_block, btn-new-post, cosmetic_changes_people_and_communities_block, edit-blocks, edit-header-footer, env-tags-block, forgot_password, header_and_footer, layout_support, list_articles_on_blog, loading-indicator-component, login_modal, login_modal_improve, person_info_block, profile-article-resolvers, profile-blocks-sass, profile_description_block_component, profile_page_improvements, recent-activities, remove-article-confirmation, signup_page, skin-small-change, staging, tags-block, theme-skin-yellow, translations, updated_signup_page, users_profile_page

Refactor post comment event to use EventEmitter

Showing 8 changed files with 97 additions and 28 deletions   Show diff stats
src/app/article/comment/comment.component.spec.ts
  Diff comments   View file @132b5d0
... ... @@ -11,8 +11,12 @@ describe("Components", () => {
11 11  
12 12 beforeEach(angular.mock.module("templates"));
13 13  
  14 + let postCommentEventService = jasmine.createSpyObj("postCommentEventService", ["subscribe"]);
  15 +
14 16 function createComponent() {
15   - let providers = helpers.provideFilters("translateFilter");
  17 + let providers = [
  18 + new Provider('PostCommentEventService', { useValue: postCommentEventService })
  19 + ].concat(helpers.provideFilters("translateFilter"));
16 20  
17 21 @Component({ selector: 'test-container-component', directives: [CommentComponent], template: htmlTemplate, providers: providers })
18 22 class ContainerComponent {
... ... @@ -46,10 +50,14 @@ describe("Components", () => {
46 50 });
47 51  
48 52 it("close form when receive a reply", done => {
  53 + let func: Function;
  54 + postCommentEventService.subscribe = (fn: Function) => {
  55 + func = fn;
  56 + };
49 57 createComponent().then(fixture => {
50 58 let component = fixture.debugElement.componentViewChildren[0];
51 59 component.componentInstance.showReply = true;
52   - fixture.debugElement.getLocal("$rootScope").$broadcast(PostCommentComponent.EVENT_COMMENT_RECEIVED, {});
  60 + func(<noosfero.Comment>{});
53 61 expect(component.componentInstance.showReply).toEqual(false);
54 62 done();
55 63 });
... ...
src/app/article/comment/comment.component.ts
  Diff comments   View file @132b5d0
1 1 import { Inject, Input, Component } from 'ng-forward';
2 2 import { PostCommentComponent } from "./post-comment/post-comment.component";
  3 +import { PostCommentEventService } from "./post-comment/post-comment-event.service";
3 4  
4 5 @Component({
5 6 selector: 'noosfero-comment',
6 7 templateUrl: 'app/article/comment/comment.html'
7 8 })
8   -@Inject("$scope")
  9 +@Inject(PostCommentEventService, "$scope")
9 10 export class CommentComponent {
10 11  
11 12 @Input() comment: noosfero.Comment;
... ... @@ -13,9 +14,10 @@ export class CommentComponent {
13 14  
14 15 showReply: boolean = false;
15 16  
16   - constructor(private $scope: ng.IScope) {
17   - $scope.$on(PostCommentComponent.EVENT_COMMENT_RECEIVED, (event: ng.IAngularEvent, comment: noosfero.Comment) => {
  17 + constructor(postCommentEventService: PostCommentEventService, private $scope: ng.IScope) {
  18 + postCommentEventService.subscribe((comment: noosfero.Comment) => {
18 19 this.showReply = false;
  20 + this.$scope.$apply();
19 21 });
20 22 }
21 23  
... ...
src/app/article/comment/comments.component.spec.ts
  Diff comments   View file @132b5d0
... ... @@ -17,14 +17,23 @@ describe(&quot;Components&quot;, () =&gt; {
17 17 commentService.getByArticle = jasmine.createSpy("getByArticle")
18 18 .and.returnValue(helpers.mocks.promiseResultTemplate({ data: comments }));
19 19  
20   - let providers = [
21   - helpers.createProviderToValue('CommentService', commentService),
22   - helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService),
23   - helpers.createProviderToValue('SessionService', helpers.mocks.sessionWithCurrentUser({}))
24   - ].concat(helpers.provideFilters("translateFilter"));
  20 + let emitEvent: Function;
  21 + let postCommentEventService = {
  22 + subscribe: (fn: Function) => {
  23 + emitEvent = fn;
  24 + }
  25 + };
25 26  
26 27 let properties = { article: { id: 1 }, parent: <any>null };
27 28 function createComponent() {
  29 + // postCommentEventService = jasmine.createSpyObj("postCommentEventService", ["subscribe"]);
  30 + let providers = [
  31 + helpers.createProviderToValue('CommentService', commentService),
  32 + helpers.createProviderToValue('NotificationService', helpers.mocks.notificationService),
  33 + helpers.createProviderToValue('SessionService', helpers.mocks.sessionWithCurrentUser({})),
  34 + new Provider('PostCommentEventService', { useValue: postCommentEventService })
  35 + ].concat(helpers.provideFilters("translateFilter"));
  36 +
28 37 return helpers.quickCreateComponent({
29 38 providers: providers,
30 39 directives: [CommentsComponent],
... ... @@ -49,10 +58,9 @@ describe(&quot;Components&quot;, () =&gt; {
49 58 });
50 59  
51 60 it("update comments list when receive an reply", done => {
52   - properties.parent = { id: 2 };
  61 + properties.parent = { id: 3 };
53 62 createComponent().then(fixture => {
54   - fixture.debugElement.getLocal("$rootScope").$emit(PostCommentComponent.EVENT_COMMENT_RECEIVED, { id: 1, reply_of: properties.parent });
55   - fixture.debugElement.getLocal("$rootScope").$apply();
  63 + emitEvent(<noosfero.Comment>{ id: 1, reply_of: { id: 3 } });
56 64 expect(fixture.debugElement.queryAll("noosfero-comment").length).toEqual(3);
57 65 done();
58 66 });
... ...
src/app/article/comment/comments.component.ts
  Diff comments   View file @132b5d0
... ... @@ -2,13 +2,14 @@ import { Inject, Input, Component, provide } from &#39;ng-forward&#39;;
2 2 import { PostCommentComponent } from "./post-comment/post-comment.component";
3 3 import { CommentService } from "../../../lib/ng-noosfero-api/http/comment.service";
4 4 import { CommentComponent } from "./comment.component";
  5 +import { PostCommentEventService } from "./post-comment/post-comment-event.service";
5 6  
6 7 @Component({
7 8 selector: 'noosfero-comments',
8 9 templateUrl: 'app/article/comment/comments.html',
9 10 directives: [PostCommentComponent, CommentComponent]
10 11 })
11   -@Inject(CommentService, "$rootScope")
  12 +@Inject(CommentService, PostCommentEventService, "$scope")
12 13 export class CommentsComponent {
13 14  
14 15 comments: noosfero.Comment[] = [];
... ... @@ -19,14 +20,7 @@ export class CommentsComponent {
19 20 protected perPage = 5;
20 21 protected total = 0;
21 22  
22   - constructor(protected commentService: CommentService, protected $rootScope: ng.IScope) {
23   - $rootScope.$on(PostCommentComponent.EVENT_COMMENT_RECEIVED, (event: ng.IAngularEvent, comment: noosfero.Comment) => {
24   - if ((!this.parent && !comment.reply_of) || (comment.reply_of && this.parent && comment.reply_of.id === this.parent.id)) {
25   - if (!this.comments) this.comments = [];
26   - this.comments.push(comment);
27   - }
28   - });
29   - }
  23 + constructor(protected commentService: CommentService, private postCommentEventService: PostCommentEventService, private $scope: ng.IScope) { }
30 24  
31 25 ngOnInit() {
32 26 if (this.parent) {
... ... @@ -34,6 +28,13 @@ export class CommentsComponent {
34 28 } else {
35 29 this.loadNextPage();
36 30 }
  31 + this.postCommentEventService.subscribe((comment: noosfero.Comment) => {
  32 + if ((!this.parent && !comment.reply_of) || (comment.reply_of && this.parent && comment.reply_of.id === this.parent.id)) {
  33 + if (!this.comments) this.comments = [];
  34 + this.comments.push(comment);
  35 + this.$scope.$apply();
  36 + }
  37 + });
37 38 }
38 39  
39 40 loadComments() {
... ...
src/app/article/comment/post-comment/post-comment-event.service.spec.ts 0 → 100644
  Diff comments   View file @132b5d0
... ... @@ -0,0 +1,26 @@
  1 +import {PostCommentEventService} from "./post-comment-event.service";
  2 +import {ComponentTestHelper, createClass} from '../../../../spec/component-test-helper';
  3 +import * as helpers from "../../../../spec/helpers";
  4 +import {Provider} from 'ng-forward';
  5 +import {ComponentFixture} from 'ng-forward/cjs/testing/test-component-builder';
  6 +
  7 +describe("Services", () => {
  8 + describe("Comment Paragraph Event Service", () => {
  9 + let eventService: PostCommentEventService;
  10 +
  11 + beforeEach(() => {
  12 + eventService = new PostCommentEventService();
  13 + eventService['eventEmitter'] = jasmine.createSpyObj("eventEmitter", ["next", "subscribe"]);
  14 + });
  15 +
  16 + it('subscribe to post comment event', () => {
  17 + eventService.subscribe(() => { });
  18 + expect(eventService['eventEmitter'].subscribe).toHaveBeenCalled();
  19 + });
  20 +
  21 + it('emit event when post comment', () => {
  22 + eventService.emit(<noosfero.Comment>{});
  23 + expect(eventService['eventEmitter'].next).toHaveBeenCalled();
  24 + });
  25 + });
  26 +});
... ...
src/app/article/comment/post-comment/post-comment-event.service.ts 0 → 100644
  Diff comments   View file @132b5d0
... ... @@ -0,0 +1,19 @@
  1 +import {Injectable, EventEmitter} from "ng-forward";
  2 +
  3 +@Injectable()
  4 +export class PostCommentEventService {
  5 +
  6 + private eventEmitter: EventEmitter<noosfero.Comment>;
  7 +
  8 + constructor() {
  9 + this.eventEmitter = new EventEmitter();
  10 + }
  11 +
  12 + emit(comment: noosfero.Comment) {
  13 + this.eventEmitter.next(comment);
  14 + }
  15 +
  16 + subscribe(fn: (comment: noosfero.Comment) => void) {
  17 + this.eventEmitter.subscribe(fn);
  18 + }
  19 +}
... ...
src/app/article/comment/post-comment/post-comment.component.spec.ts
  Diff comments   View file @132b5d0
... ... @@ -11,11 +11,13 @@ describe(&quot;Components&quot;, () =&gt; {
11 11 beforeEach(angular.mock.module("templates"));
12 12  
13 13 let commentService = jasmine.createSpyObj("commentService", ["createInArticle"]);
  14 + let postCommentEventService = jasmine.createSpyObj("postCommentEventService", ["emit"]);
14 15 let user = {};
15 16 let providers = [
16 17 new Provider('CommentService', { useValue: commentService }),
17 18 new Provider('NotificationService', { useValue: helpers.mocks.notificationService }),
18   - new Provider('SessionService', { useValue: helpers.mocks.sessionWithCurrentUser(user) })
  19 + new Provider('SessionService', { useValue: helpers.mocks.sessionWithCurrentUser(user) }),
  20 + new Provider('PostCommentEventService', { useValue: postCommentEventService })
19 21 ].concat(helpers.provideFilters("translateFilter"));
20 22  
21 23 @Component({ selector: 'test-container-component', directives: [PostCommentComponent], template: htmlTemplate, providers: providers })
... ... @@ -35,9 +37,8 @@ describe(&quot;Components&quot;, () =&gt; {
35 37 helpers.createComponentFromClass(ContainerComponent).then(fixture => {
36 38 let component: PostCommentComponent = fixture.debugElement.componentViewChildren[0].componentInstance;
37 39 commentService.createInArticle = jasmine.createSpy("createInArticle").and.returnValue(helpers.mocks.promiseResultTemplate({ data: {} }));
38   - component["$scope"].$emit = jasmine.createSpy("$emit");
39 40 component.save();
40   - expect(component["$scope"].$emit).toHaveBeenCalledWith(PostCommentComponent.EVENT_COMMENT_RECEIVED, jasmine.any(Object));
  41 + expect(postCommentEventService.emit).toHaveBeenCalled();
41 42 done();
42 43 });
43 44 });
... ...
src/app/article/comment/post-comment/post-comment.component.ts
  Diff comments   View file @132b5d0
... ... @@ -2,12 +2,13 @@ import { Inject, Input, Component } from &#39;ng-forward&#39;;
2 2 import { CommentService } from "../../../../lib/ng-noosfero-api/http/comment.service";
3 3 import { NotificationService } from "../../../shared/services/notification.service";
4 4 import { SessionService } from "../../../login";
  5 +import { PostCommentEventService } from "./post-comment-event.service";
5 6  
6 7 @Component({
7 8 selector: 'noosfero-post-comment',
8 9 templateUrl: 'app/article/comment/post-comment/post-comment.html'
9 10 })
10   -@Inject(CommentService, NotificationService, "$scope", SessionService)
  11 +@Inject(CommentService, NotificationService, SessionService, PostCommentEventService)
11 12 export class PostCommentComponent {
12 13  
13 14 public static EVENT_COMMENT_RECEIVED = "comment.received";
... ... @@ -18,7 +19,10 @@ export class PostCommentComponent {
18 19 comment = <noosfero.Comment>{};
19 20 private currentUser: noosfero.User;
20 21  
21   - constructor(private commentService: CommentService, private notificationService: NotificationService, private $scope: ng.IScope, private session: SessionService) {
  22 + constructor(private commentService: CommentService,
  23 + private notificationService: NotificationService,
  24 + private session: SessionService,
  25 + private postCommentEventService: PostCommentEventService) {
22 26 this.currentUser = this.session.currentUser();
23 27 }
24 28  
... ... @@ -27,7 +31,7 @@ export class PostCommentComponent {
27 31 this.comment.reply_of_id = this.parent.id;
28 32 }
29 33 this.commentService.createInArticle(this.article, this.comment).then((result: noosfero.RestResult<noosfero.Comment>) => {
30   - this.$scope.$emit(PostCommentComponent.EVENT_COMMENT_RECEIVED, result.data);
  34 + this.postCommentEventService.emit(result.data);
31 35 this.comment.body = "";
32 36 this.notificationService.success({ title: "comment.post.success.title", message: "comment.post.success.message" });
33 37 });
... ...