CODEWITHSUNDEEP
javascriptjasmine
Willing
Willing

Reputation: 612

Jasmine code for jquery

I am very new in jasmine test. I only know how to install and simple cmd like toEqual, toBe etc. But I dont know, how to write test code for this jquery in jasmine.

if ($('.products').length > 0) {
  $('a[data-toggle="pill"]').on('shown', function (e) {
    var elem = $(e.target).attr('href');
    elem = elem.replace('#', '');
    var obj = $('.products').siblings('.hero');
    $('.prod-title,.prod-subtitle').removeClass('active');
    $('.' + elem, obj).addClass('active');
  });
}

Any one can tell me plz, how to write test code for about this program. Thank you for your answer.

Upvotes: 2

Views: 428

Answers (1)

Yuriy Bilogub
Yuriy Bilogub

Reputation: 377

First of all your tests involve dom interactions thus you need to use https://github.com/velesin/jasmine-jquery - jasmine-jquery plugin, it has fixture routines and a bunch of jquery DOM matchers such as toBeVisible, toBeHidden and so on.

Next you should create a condition for your if to be true:

describe("We have at least one product", function() {

  beforeEach(function() {
    loadFixtures('several-products-fixture.html');        
  });

  it("should do some stuff in this example", function() {
    var $target = $('a[data-toggle="pill"]');
    $target.trigger('shown');

    var elem = $target.attr('href').replace('#', '');
    var obj = $('.products').siblings('.hero');

    expect($('.prod-title,.prod-subtitle')).not.toHaveClass('active');
    expect($('.' + elem, obj)).toHaveClass('active');
  });
});

// Next context
describe("We have not any product", function() {
  ...
});

Also you can look at my jquery plugin on github it is tested with Jasmine and fixtures: https://github.com/belogub/searchin

Upvotes: 1

Related Questions