vendredi 30 janvier 2015

Mocking the web browserorientationchange event to test bound event handler function with jasmine

I have an angularjs directive to create an event handler for the orientation change event to add a classname when the orientation change is landscape (it still needs improvement so bear with me for now):



angular.module('myApp')
.directive('orientationHandler', function ($rootScope, $timeout, $window) {
return function(scope, element, attrs) {
var className = 'mobile_landscape';
var mediaQuery = 'only screen and (max-width: 768px) and (orientation: landscape)';
var orientationCheck = function() {
if ($window.matchMedia(mediaQuery).matches) {
element.addClass(className);
$rootScope.$broadcast('Orientation.change', 'landscape');
} else {
element.removeClass(className);
$rootScope.$broadcast('Orientation.change', 'portrait');
}
};
$window.addEventListener('orientationchange', function() {
$timeout(orientationCheck, 100);
$timeout(orientationCheck, 200);
},
false
);
$rootScope.$on('$viewContentLoaded', function() {
$timeout(orientationCheck, 100);
$timeout(orientationCheck, 200);
});
};
});


Now I would like to test on jasmine such a directive:



//TODO: Find a way to test orientation change events
describe('Directive: orientationHandler', function () {

// load the directive's module
beforeEach(module('myApp'));

var element,
scope,
$window;

beforeEach(inject(function ($rootScope, $compile, $httpBackend, _$window_) {
$window = _$window_;
scope = $rootScope.$new();
element = angular.element('<div orientation-handler></div>');
element = $compile(element)(scope);
$httpBackend.whenGET(/.*/).respond(200);
}));

it('should broadcast an event when changed the orientation', function () {
var message;
scope.$on('Orientation.change', function(event, value) {
message = value;
});
angular.element($window).trigger('orientationchange');
scope.$apply();
expect(message).toBeDefined();
expect(angular.isString(message)).toBe(true);
});
});


So, is there a way to programatically trigger the orientation change event, or mocking it somehow to test the bound event handler?


Thanks!


Aucun commentaire:

Enregistrer un commentaire