jQuery Jasmine click event: Expected event [object Object] to have been triggered on [object Object]

Question

I have a small test (Jasmine + jasmine-jquery) to check if a btn have been clicked and test if its callbacks were correctly executed, but I am facing some strange errors:

Here is the test:

it("Check if pagination arrows/btns had been clicked", function() {
    // beforeEach to spy on callbacks:
    beforeEach(function() {
        spyOn(comp, "_pageUp");
    });

    var arrowUp = $('.arrow-up').eq(0);
    var spyEvent = spyOnEvent(arrowUp, 'click');

    // Trigger the event:
    $(arrowUp).click();

    expect('click').toHaveBeenTriggeredOn(arrowUp);
    expect(spyEvent).toHaveBeenTriggered();

    // Check if the click callback was correctly called:
    expect(comp._pageUp).toHaveBeenCalled();

});

The comp variable is a JS Object. What I want is, when its $('.arrow-up').eq(0); button gets clicked, the _pageUp method is called. After that, there are the tests to those methods (comp._pageUp() and comp._pageDown()).

The error message I have is:

    Expected event [object Object] to have been triggered on [object Object]

Also, a last reminder: I am pretty sure the fixture is corrected loaded and the test is running after the window.onload event.

Could someone help me understand what am I doing wrong?

Thank you, guys.

score 0 · Answer 1 · edited May 23 '17 at 11:45

guys.

As mentioned here, the main problem was about the prototype approach.

So, fixing some errors and the prototype spyOn declaration, what worked for me was:

it("OverlayNavComponent pagination btn had been clicked", function() {
    // spyOn prototype BEFORE instantiate the component:
    spyOn(OverlayNavComponent.prototype, "_pageUp");
    var comp = new OverlayNavComponent();
    comp.init($("#scroll-up-icon"), $("#btn-toggle-menu"), 4);

    var btnId = "#scroll-up-icon";

    // spyOnEvent gets the query string and NOT the element itself as I was doing before:
    var spyEvent = spyOnEvent(btnId, "click");
    // Note: $(btnId).click() did not work:
    $(btnId).trigger("click");

    expect('click').toHaveBeenTriggeredOn(btnId);
    expect(spyEvent).toHaveBeenTriggered();
    expect(comp._pageUp).toHaveBeenCalled();
});

Also, I had to load the fixture inside a "beforeEach" method:

beforeEach(function() {
    jasmine.getFixtures().fixturesPath = "/fixtures";
    loadFixtures('overlaynavcomp.html');
});

Now, all tests are ok.

jQuery Jasmine click event: Expected event [object Object] to have been triggered on [object Object]

1 Answers1