2015-11-25 2 views
3

Я пытаюсь проверить события mouseover и mouseout в директиве D3. Вот часть коды я пытающийся тест:Тесты мыши и события мыши в угловой директиве

var nodeEnter = node.enter().append('svg:g') 
    .attr('class', 'node') 
    .attr('transform', function(d) { 
    return 'translate(' + d.x + ',' + d.y + ')'; 
    }) 
    .attr('filter', 'url(' + $location.path() + '#drop-shadow)') 
    .on('mouseover', function(d) { 
    tooltip.transition() 
     .duration(200) 
     .style('opacity', 0.75); 
    tooltip.html(d.email) 
     .style('left', (d3.event.pageX - 50) + 'px') 
     .style('top', (d3.event.pageY - 50) + 'px'); 
    d.scale = 1.5; 
    tick(); 
    }) 
    .on('mouseout', function(d) { 
    tooltip.transition() 
     .duration(200) 
     .style('opacity', 0); 
    d.scale = 1; 
    tick(); 
    }) 

Вот соответствующий код жасмина для этих конкретных тестов:

it('should trigger mouse events', function() { 
    element.find('.node').triggerHandler('mouseover'); 
    element.find('.node').triggerHandler('mouseout'); 
}); 

Функции, которые должны быть вызваны на этих событиях мышей остается красным мой охват кода, если они никогда не запускались. У кого-то есть идея, почему это было бы?

ответ

1

This разработал для меня:

Использование JQuery:

beforeEach(function(){ 
    $.fn.triggerSVGEvent = function(eventName) { 
     var event = document.createEvent('SVGEvents'); 
     event.initEvent(eventName, true, true); 
     this[0].dispatchEvent(event); 
     return $(this) 
    } 
}) 

, а затем в тесте:

it('should trigger mouse events', function() { 
    $(yourSelector).triggerSVGEvent('mouseover'); 
    $(yourSelector).triggerSVGEvent('mouseout'); 
}) 
Смежные вопросы