Question

Struggling on writing the testcases on click,toggle,slideUp,fade events.

How do I write jasmine test cases to check if div is clicked or not and the slideUp and down and toggle events. Is there a provision in jasmine to test them.

列出了我的代码，点击了测试用例以供参考。

SpecRunner.html file 

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>Jasmine Spec Runner v2.3.4</title>
  <link rel="shortcut icon" type="image/png" href="lib_jasmine/jasmine-   2.3.4/jasmine_favicon.png">
  <link rel="stylesheet" href="lib_jasmine/jasmine-2.3.4/jasmine.css">
  <script src="scripts/jquery.js"></script>
  <script src="lib_jasmine/jasmine-2.3.4/jasmine.js"></script>
  <script src="lib_jasmine/jasmine-2.3.4/jasmine-html.js"></script>
  <script src="lib_jasmine/jasmine-2.3.4/boot.js"></script>
  <script src="lib_jasmine/jasmine-2.3.4/jasmine-jquery.js"></script>
  <!-- include source files here... -->
  <script type="text/javascript" src="js/eigMain.js"></script>
  <script type="text/javascript" src="js/sinon.js"></script>
  <!-- include spec files here... -->
  <script type="text/javascript" src="js/specEig.js"></script>
</head>
<body>
</body>
</html>

 js file for reference

    $('#screenPane').click(function(e){
            $('#Panel,.FixedHeader').toggleClass('fullscreen'); 
            $('#eIcon').toggle();
            $('#cIcon').toggle();
            $(".Col").toggle();
            $('html, body').animate({scrollTop: $('#total-results').offset().top}, 800);
            $('#nav_up').fadeIn('slow'); 
            $('#nav_down').hide(); 
                });

具有点击事件测试用例的Spec.js文件。它给了我ERROR：在[object Object]上触发了预期的事件[object Object]。此外，切换测试用例无法执行。

it ("should invoke the screenPane click event.", function() {
    spyOnEvent($('#screenPane'), 'click');
    $('#screenPane').click();
    expect('click').toHaveBeenTriggeredOn($('#screenPane'));
  });

请帮忙

Answer 1

虽然大多数标签接受或响应点击事件，但在各种平台和浏览器上检测它可能会很困难。你可能会更好地检查toggle()处理的CSS类是否已经被交换以响应点击。要检查要移动的任何东西，只需检查起始X / Y坐标，然后将它们与动画结束时的坐标进行比较，然后检查它们是否不同（以免造成脆弱情况）严格定义的值。）

//Checking coordinates
it ("should invoke the screenPane click event.", function() {
    var coords = $('screenPane').offset();
    $('#screenPane').click();
    var newCoords = $('screenPane').offset();
    expect(newCoords).not.toEqual(coords);
  });

//Checking classes
it ("should invoke the screenPane click event.", function() {
    var classes = $('screenPane').val('class');
    $('#screenPane').click();
    var newClasses = $('screenPane').val('class');
    expect(classes).not.toEqual(newClasses);
  });

用于点击和切换事件的Jasmine测试用例

1 个答案: