2016-04-13 2 views
0

Я, имеющий этот directive, который просто работает отлично:Угловое - триггер нажмите событие в тесте не работает

(function() { 
    'use strict'; 
    angular 
    .module('app.core') 
    .directive('selectOnClick', selectOnClick); 

    // @ngInject 
    function selectOnClick() { 
     return { 
      restrict : 'A', 
      link : function (scope, element) { 
       element.on('click', function() { 
        this.select(); 
        scope.testValue++; // only to test if it is triggered 
       }); 
      } 
     }; 
    } 
})(); 

В моем тесте, я хочу, чтобы проверить, если событие щелчка срабатывает и если элемент выбран. Как вы можете видеть ниже, я запускаю событие click в тесте и запускаю $scope.$digest(), но ни переменная области не увеличивается, ни событие клика не запускается. Любые идеи, почему?

describe('test selectOnClickDirective', function() { 
    'use strict'; 
    var $scope, 
    $compile, 
    element; 
    beforeEach(module('app.core')); 
    beforeEach(inject(function (_$rootScope_, _$compile_) { 
      $scope = _$rootScope_.$new(); 
      $compile = _$compile_; 
      element = $compile('<input select-on-click type="text">')($scope); 
      $scope.$digest(); 
     })); 

    it('should trigger an click event', function() { 
     $scope.testValue = 10; 
     var input = element.find('input'); 
     input.trigger('click'); 
     $scope.$digest(); 

     expect('click').toHaveBeenTriggeredOn(input); 
     expect($scope.testValue).toEqual(11); 
    }); 

    it('should select the element when clicked on it', function() { 
     //expect(element.find('input').is(':selected')).toBe(true); 
    }); 
}); 
+0

первого добавить сферы $ применяются для того, чтобы иметь угловые проверки изменения цикла и применять их в обратном вызове события или он не будет работать – Walfrat

ответ

1

Проблема заключалась в том, что element.find ищет дочерних элементов в этом элементе. Поэтому мне пришлось просто использовать element. решения будет таким:

it('should trigger an click event', function() { 
    $scope.testValue = 10; 
    element.trigger('click'); 
    $scope.$digest(); 

    expect('click').toHaveBeenTriggeredOn(element); 
    expect($scope.testValue).toEqual(11); 
}); 
1

Попробуйте

input.triggerHandler('click'); 

вместо вашего

input.trigger('click'); 
+0

же проблемы с этим. ... – kinske

0

Вы можете использовать element, что вы компилируетесь и использовать triggerHandler, который проходит фиктивный объект события для обработчиков.

От Angular Docs: triggerHandler() - Пропускает объект фиктивного события для обработчиков.

Так что вам нужно написать:

element.triggerHandler('click');