karma-jasmine-jquery

A Karma plugin for Jasmine-jQuery.

Installation

npm install karma jasmine-core karma-jasmine jasmine-jquery @metahub/karma-jasmine-jquery --save-dev

Note: @metahub/karma-jasmine-jquery depends on Jasmine, Karma-Jasmine, and Jasmine-jQuery but they are not bundled, just defined as peer-dependencies. This allow you to use any version independently of @metahub/karma-jasmine-jquery.

Configuration

Standard

module.exports = function(config) {
  config.set({
    plugins: ['@metahub/karma-jasmine-jquery', 'karma-*'],
    frameworks: ['jasmine-jquery'],
  });
};

Note: Karma can auto-load plugins named karma-* (see plugins). Unfortunatly it doesn't work with scoped packages, therefore @metahub/karma-jasmine-jquery has to be explicitly added to the plugins configuration. In order to continue to automatically load other plugins you can add karma-* to the plugins configuration.

Note: @metahub/karma-jasmine-jquery will automatically import the necesary files from jQuery, Jasmine and Karma-Jasmine. No need to add them to plugins or frameworks.

In your Jasmine tests, jQuery will be accessible with $ or jQuery:

describe('Jasmine tests with Jasmine-jQuery', () => {
  it('shoud allow to use jQuery', () => {
    setFixtures('<div id="fixture" class="fixture-class">fixture content</div>');
    expect($('#fixture')).toHaveText('fixture content');
    expect(jQuery('#fixture')).toHaveClass('fixture-class');
  });
});

With a custom jQuery version

@metahub/karma-jasmine-jquery uses a recent version of jQuery but it might be desirable to use the specific version of jQuery used in your application for executing the Jasmine tests.

In that case you can use Karma-jQuery:

npm install karma-jquery --save-dev

module.exports = function(config) {
  config.set({
    plugins: ['@metahub/karma-jasmine-jquery', 'karma-*'],
    frameworks: ['jasmine-jquery', 'jquery-1.8.3'],
  });
};

In your Jasmine tests, the version of jQuery configured with Karma-jQuery will be accessible with $ or jQuery. The version of jQuery used by @metahub/karma-jasmine-jquery will be accessible with $j or jasmineJQuery:

describe('Jasmine tests with Jasmine-jQuery and Karma-jQuery', () => {
  it('shoud allow to use a specific version jQuery', () => {
    expect($.fn.jquery).toBe('1.8.3');
    $.fn.jquery // 1.8.3 => version installed by Karma-jQuery
    jQuery.fn.jquery // 1.8.3 => version installed by Karma-jQuery

    expect($j.fn.jquery).toBe('3.2.1');
    $j.fn.jquery // 3.2.1 => version installed by @metahub/karma-jasmine-jquery
    jasmineJQuery.fn.jquery // 3.2.1 => version installed by @metahub/karma-jasmine-jquery
  });
});