Question

我需要编写一个Jasmine.js测试来测试一个菜单图标，看看点击它时会发生什么，（菜单栏在第一次点击时会滑入，当点击它时会弹出它第二次，但我的测试无法证明它）

我提出了这个想法，但是规范运行者显示（预计错误是真的）。什么可能是问题的任何帮助？

  componentWillMount() {
    var time = 60;
    this.interval = setInterval(this.tick.bind(this, time), 1000);
  }

 tick(time) {
    time = Number.parseInt(time) // This does nothing for some reason
    console.log(time);
    time = time - 1;
    if (time <= 0) {
      console.log('Hi');
    } return time;
  }

Answer 1

看起来您已经在使用Jasmine和JQuery了，所以我建议您使用jasmine-jquery.js库来帮助您跟踪状态？

这是一个很好的参考：Testing That A DOM Event Was Fired

要使下面的代码生效，只需在项目文件夹中包含jasmine-jquery.js，然后链接＆lt; \ script＆gt;通过index.html的＆lt; \ head＆gt;和你的设置。希望这可以帮助。

describe('The menu', function() {
    // Add a spyOnEvent
    let spyEvent, menu;

    beforeEach(function() {
        // I assumed your menu icon has a unique ID of 'menuIconID'
        // so I passed onto a spy listener.
        spyEvent = spyOnEvent('#menuIconID', 'click');
    });
    it('the menu changes visibility when the menu icon is clicked', function() {

        // Click once
        $("#menuIconID").trigger("click");
        expect('click').toHaveBeenTriggeredOn('#menuIconID');
        expect(spyEvent).toHaveBeenTriggered();
        menu = $('body').attr('class'); // assign the new class
        expect(menu).toBe('');

        // Click again
        $("#menuIconID").trigger("click");
        expect('click').toHaveBeenTriggeredOn('#menuIconID');
        expect(spyEvent).toHaveBeenTriggered();
        menu = $('body').attr('class'); // update the new class
        expect(menu).toBe('menu-hidden');
    });
});

使用jasmine测试点击事件？

1 个答案: