From c4454156c48dc84f12eb4e254abae178f8016972 Mon Sep 17 00:00:00 2001 From: Gustavo Martin Morcuende Date: Sat, 19 Sep 2015 15:37:40 +0200 Subject: [PATCH] showcase: controllers same level and $scope.$on --- .../showcase/app/users/users-child.controller.js | 19 +++++++ .../app/users/users-child.controller.spec.js | 25 ++++++++- .../app/users/users-second-child.controller.js | 42 +++++++++++++++ .../users/users-second-child.controller.spec.js | 63 ++++++++++++++++++++++ .../src/showcase/app/users/users.constants.js | 6 ++- .../src/showcase/app/users/users.controller.js | 2 + .../showcase/src/showcase/app/users/users.html | 20 +++++++ angularjs/showcase/src/showcase/index.html | 1 + 8 files changed, 175 insertions(+), 3 deletions(-) create mode 100644 angularjs/showcase/src/showcase/app/users/users-second-child.controller.js create mode 100644 angularjs/showcase/src/showcase/app/users/users-second-child.controller.spec.js diff --git a/angularjs/showcase/src/showcase/app/users/users-child.controller.js b/angularjs/showcase/src/showcase/app/users/users-child.controller.js index f866e2f..10c3045 100644 --- a/angularjs/showcase/src/showcase/app/users/users-child.controller.js +++ b/angularjs/showcase/src/showcase/app/users/users-child.controller.js @@ -10,10 +10,12 @@ * @name app.users.controller:UsersChildController * * @requires $rootScope + * @requires $scope * *

*
* {@link https://docs.angularjs.org/api/ng/service/$rootScope $rootScope} + * {@link https://docs.angularjs.org/api/ng/type/$rootScope.Scope $scope} *

* * @description @@ -26,10 +28,27 @@ title: 'Snake and Scarlett', fact: 'it is canon' }; + var scopeBroadcastToSecondChild = { + name: 'UsersChild To UsersSecondChild', + lastName: 'scope broadcasting to UsersSecondChild from UserChild', + city: 'UserChild' + }; + var rootScopeBroadcastToSecondChild = { + name: 'UsersChild To UsersSecondChild', + lastName: 'rootscope broadcasting to UsersSecondChild from UserChild', + city: 'UserChild' + }; vm.getEmit = function () { $scope.$emit(USERS.SCOPE.EMIT_FACT, emitFact); }; + vm.broadcastToSencondChild = function () { + // $scope.$broadcast will never be seen by controllers in the same level as this controller. :( + $scope.$broadcast(USERS.SCOPE.BROADCAST_TO_SENCONDCHILD, scopeBroadcastToSecondChild); + // The only way is either using $rootScope or creating a new controllers hierarchy where + // UsersSecondChildController would be in a lower level than UsersChildController. + $rootScope.$broadcast(USERS.ROOTSCOPE.BROADCAST_TO_SENCONDCHILD, rootScopeBroadcastToSecondChild); + }; vm.usersChildOnScopeBroadcast = function (events, broadcastUser) { vm.broadcastUser = broadcastUser; console.log('usersChildOnScopeBroadcast, events.name: ' + events.name); diff --git a/angularjs/showcase/src/showcase/app/users/users-child.controller.spec.js b/angularjs/showcase/src/showcase/app/users/users-child.controller.spec.js index d534ec4..d253c6b 100644 --- a/angularjs/showcase/src/showcase/app/users/users-child.controller.spec.js +++ b/angularjs/showcase/src/showcase/app/users/users-child.controller.spec.js @@ -15,6 +15,8 @@ describe('app.users', function() { $scope = $rootScope.$new(); spyOn($scope, '$emit'); + spyOn($rootScope, '$broadcast'); + jasmine.createSpy($scope, '$scope.$broadcast'); UsersChildController = $controller('UsersChildController', { $rootScope: $rootScope, $scope: $scope, @@ -47,13 +49,34 @@ describe('app.users', function() { city: 'classified' }; var event = { - name: 'USERS.ROOTSCOPE.BROADCAST' + name: USERS.ROOTSCOPE.BROADCAST }; UsersChildController.usersChildOnScopeBroadcast(event, rootScopeBroadcastUser); expect(UsersChildController.broadcastUser).toEqual(rootScopeBroadcastUser); }); + + it('should be called $rootScope.$broadcast', function () { + var scopeBroadcastToSecondChild = { + name: 'UsersChild To UsersSecondChild', + lastName: 'scope broadcasting to UsersSecondChild from UserChild', + city: 'UserChild' + }; + var rootScopeBroadcastToSecondChild = { + name: 'UsersChild To UsersSecondChild', + lastName: 'rootscope broadcasting to UsersSecondChild from UserChild', + city: 'UserChild' + }; + + UsersChildController.broadcastToSencondChild(); + + expect($rootScope.$broadcast).toHaveBeenCalledWith( + USERS.ROOTSCOPE.BROADCAST_TO_SENCONDCHILD, rootScopeBroadcastToSecondChild); + expect($scope.$broadcast).toHaveBeenCalledWith( + USERS.SCOPE.BROADCAST_TO_SENCONDCHILD, scopeBroadcastToSecondChild); + }); + }); }); diff --git a/angularjs/showcase/src/showcase/app/users/users-second-child.controller.js b/angularjs/showcase/src/showcase/app/users/users-second-child.controller.js new file mode 100644 index 0000000..c4bb43d --- /dev/null +++ b/angularjs/showcase/src/showcase/app/users/users-second-child.controller.js @@ -0,0 +1,42 @@ +(function () { + 'use strict'; + + angular + .module('app.users') + .controller('UsersSecondChildController', UsersSecondChildController); + + /** + * @ngdoc controller + * @name app.users.controller:UsersSecondChildController + * + * @requires $scope + * + *

+ *
+ * {@link https://docs.angularjs.org/api/ng/type/$rootScope.Scope $scope} + *

+ * + * @description + * UsersSecondChildController controller. + */ + /* @ngInject */ + function UsersSecondChildController($scope, USERS) { + var vm = this; + + vm.usersSecondChildOnRootScopeBroadcast = function (events, rootScopeBroadcastUser) { + vm.rootScopeBroadcastUser = rootScopeBroadcastUser; + console.log('usersSecondChildOnRootScopeBroadcast, events.name: ' + events.name); + }; + vm.usersSecondChildOnScopeBroadcast = function (events, scopeBroadcastUser) { + vm.scopeBroadcastUser = scopeBroadcastUser; + // You will never see this message because listening for $scope.$broadcast sent by + // controllers in the same level does not work. + console.log('usersSecondChildOnScopeBroadcast, events.name: ' + events.name); + }; + + $scope.$on(USERS.ROOTSCOPE.BROADCAST_TO_SENCONDCHILD, vm.usersSecondChildOnRootScopeBroadcast); + + $scope.$on(USERS.SCOPE.BROADCAST_TO_SENCONDCHILD, vm.usersSecondChildOnScopeBroadcast); + + } +})(); diff --git a/angularjs/showcase/src/showcase/app/users/users-second-child.controller.spec.js b/angularjs/showcase/src/showcase/app/users/users-second-child.controller.spec.js new file mode 100644 index 0000000..0b6f18d --- /dev/null +++ b/angularjs/showcase/src/showcase/app/users/users-second-child.controller.spec.js @@ -0,0 +1,63 @@ +describe('app.users', function() { + 'use strict'; + + var $rootScope; + var $scope; + var USERS; + var UsersSecondChildController; + + beforeEach(function() { + module('app.users'); + + inject(function($controller, _$rootScope_, _USERS_) { + $rootScope = _$rootScope_; + USERS = _USERS_; + $scope = $rootScope.$new(); + + spyOn($scope, '$emit'); + UsersSecondChildController = $controller('UsersSecondChildController', { + $rootScope: $rootScope, + $scope: $scope, + USERS: _USERS_ + }); + }); + }); + + describe('UsersSecondChildController', function () { + + it('should be created successfully', function () { + expect(UsersSecondChildController).toBeDefined(); + }); + + it('should be assigned rootScopeBroadcastUser', function () { + var rootScopeBroadcastUser = { + name: 'UsersChild To UsersSecondChild', + lastName: 'rootscope broadcasting to UsersSecondChild from UserChild', + city: 'UserChild' + }; + var event = { + name: USERS.ROOTSCOPE.BROADCAST_TO_SENCONDCHILD + }; + + UsersSecondChildController.usersSecondChildOnRootScopeBroadcast(event, rootScopeBroadcastUser); + + expect(UsersSecondChildController.rootScopeBroadcastUser).toEqual(rootScopeBroadcastUser); + }); + + it('should be assigned broadcastUser', function () { + var scopeBroadcastUser = { + name: 'UsersChild To UsersSecondChild', + lastName: 'rootscope broadcasting to UsersSecondChild from UserChild', + city: 'UserChild' + }; + var event = { + name: USERS.SCOPE.BROADCAST_TO_SENCONDCHILD + }; + + UsersSecondChildController.usersSecondChildOnScopeBroadcast(event, scopeBroadcastUser); + + expect(UsersSecondChildController.scopeBroadcastUser).toEqual(scopeBroadcastUser); + }); + }); + +}); diff --git a/angularjs/showcase/src/showcase/app/users/users.constants.js b/angularjs/showcase/src/showcase/app/users/users.constants.js index 6fa1c3a..4947956 100644 --- a/angularjs/showcase/src/showcase/app/users/users.constants.js +++ b/angularjs/showcase/src/showcase/app/users/users.constants.js @@ -5,10 +5,12 @@ .module('app.users') .constant('USERS', { ROOTSCOPE: { - BROADCAST: 'USERS_ROOTSCOPE_BROADCAST' + BROADCAST: 'USERS_ROOTSCOPE_BROADCAST', + BROADCAST_TO_SENCONDCHILD: 'USERS_ROOTSCOPE_BROADCAST_TO_SENCONDCHILD' }, SCOPE: { - EMIT_FACT: 'USERS_SCOPE_EMIT_FACT' + EMIT_FACT: 'USERS_SCOPE_EMIT_FACT', + BROADCAST_TO_SENCONDCHILD: 'USERS_SCOPE_BROADCAST_TO_SENCONDCHILD' } }); diff --git a/angularjs/showcase/src/showcase/app/users/users.controller.js b/angularjs/showcase/src/showcase/app/users/users.controller.js index 71b7628..e6086ca 100644 --- a/angularjs/showcase/src/showcase/app/users/users.controller.js +++ b/angularjs/showcase/src/showcase/app/users/users.controller.js @@ -10,10 +10,12 @@ * @name app.users.controller:UsersController * * @requires $rootScope + * @requires $scope * *

*
* {@link https://docs.angularjs.org/api/ng/service/$rootScope $rootScope} + * {@link https://docs.angularjs.org/api/ng/type/$rootScope.Scope $scope} *

* * @description diff --git a/angularjs/showcase/src/showcase/app/users/users.html b/angularjs/showcase/src/showcase/app/users/users.html index ca0f256..4627e0c 100644 --- a/angularjs/showcase/src/showcase/app/users/users.html +++ b/angularjs/showcase/src/showcase/app/users/users.html @@ -18,6 +18,26 @@ +
+ + +
+
+ +
+
name = {{vm.rootScopeBroadcastUser.name}}
+
lastname = {{vm.rootScopeBroadcastUser.lastName}}
+
city = {{vm.rootScopeBroadcastUser.city}}
+ +
+ +
+
name = {{vm.scopeBroadcastUser.name}}
+
lastname = {{vm.scopeBroadcastUser.lastName}}
+
city = {{vm.scopeBroadcastUser.city}}
+
diff --git a/angularjs/showcase/src/showcase/index.html b/angularjs/showcase/src/showcase/index.html index cd6019f..0b2970c 100644 --- a/angularjs/showcase/src/showcase/index.html +++ b/angularjs/showcase/src/showcase/index.html @@ -63,6 +63,7 @@ + -- 2.1.4