javascriptjquerybackbone.jsjasminesinon

I can't test the visibility of elements rendered in my backbone view


I'm working on a Backbone.js application and while adding tests with Jasmine & Sinon I had problems to determine the visibility of some DOM elements: some of them where detected as not visible in the tests while I could see them correctly in my application.

I created a small example that replicates the problem, the same test is run twice on two sets of elements:

The test itself is using jQuery.is(':visible') (via jasmine-jquery's .toBeVisible()) to know if elements are visible or not. It passes for the first set, not for the second one.

I guess I forgot something, or maybe misused a library, but I can't put my finger on it so if you have any clue... :)

Thanks! Maxime


Solution

  • The issue is that your StuffView.el is not attached to DOM, hence is always not visible. You probably misunderstand className and tagName parameters: they aren't used as selectors, but to construct a brand new element.

    This fixes the second test.

    el : "div.container",
    //tagName : 'div',
    //className : 'container',
    

    Alternatively you can attach the view to DOM manually in the test

    $("body").append(this.view.el);