WebStorm - Jasmine jQuery

I'm quite new to the usage of WebStorm, but it's not working as epected. I had a project in the past, but now I try to recreate it and try to unit test my code. I'm very new to unit testing JavaScript code.

So, I have a file karma.conf.js which contains the following:

module.exports = function(config){
    config.set({
        basePath : './',
        files : [
            '../../Resources/External/Bower/angular/angular.js',
            '../../Resources/External/Bower/angular-mocks/angular-mocks.js',
            '../../Resources/Scripts/OfficeUI.js',
            '../../Unit Tests/**/*.Test.js'
        ],
        autoWatch : true,
        frameworks: ['jasmine-jquery', 'jasmine'],
        browsers : ['Chrome']
    });
};

So, I do run my tests with Karma using the Jasmine framework. I've included jasmine-jquery in order to load fixtures to my HTML code on it.

So, I do have a JavaScript function which toggles a class when you press or release the button:

$(function() {
    $('#OfficeUI a.button').on('mousedown mouseup', function(e) {
        $(this).toggleClass('ie-fix');
    });
});

Now, I have written a Unit Test which looks like the following:

describe("Unit: OfficeUI Elements", function() {
    // Load up the HTML page 'OfficeUI.Elements.Test.html' before every test     is executed.
    beforeEach(function() {
        loadFixtures('OfficeUI.Elements.Test.html');
    });

    it("should do some stuff in this example", function() {
        expect(true).toEqual(true);
    });
});

The image below does show the folder structure of my project.

Now, When I do run my tests, I do receive the following error:

Error: Fixture could not be loaded: spec/javascripts/fixtures/OfficeUI.Elements.Test.html (status: error, message: undefined)

I've tried to resolve this by changing the beforeEach method in the Unit Test like the following:

beforeEach(function() {
    jasmine.getFixtures().fixturesPath = '/OfficeUI.Beta/Unit Tests/Pages';
    loadFixtures('OfficeUI.Elements.Test.html');
});

I've tried various things in the fixturesPath but I keep receiving the same error.

Anyone has an idea on how to solve this? Any help is highly appreciated.

Edit: Updated karma config:

module.exports = function(config){
    config.set({
        basePath : '../../',
        files : [
            'Resources/External/Bower/jquery/dist/jquery.js',
            'Resources/External/Bower/angular/angular.js',
            'Resources/External/Bower/angular-mocks/angular-mocks.js',
            'Resources/Scripts/OfficeUI.js',
            'Resources/Scripts/Elements/OfficeUI.Elements.js',
            'Unit Tests/**/*.Test.js',

            { pattern: 'Resources/Unit Tests/*.html', watched: true, served:         true, included: false },
        ],
        autoWatch : true,
        watched: true,
        server: true,
        include: false,
        frameworks: ['jasmine-jquery', 'jasmine'],
        browsers: ['Chrome']
    });
};

回答1:

Change in your OfficeUI.Elements.Test.js file the following line:

jasmine.getFixtures().fixturesPath = '/Tests/';

to:

jasmine.getFixtures().fixturesPath = 'base/Tests/';

that works fine for me

回答2:

In my karma config file, I have to tell karma that it serves the fixture files for jasmine.

Try to insert the following in the files section of your karma config file:

 // fixtures
 { pattern: '../../Resources/Unit Tests/Pages/*.*', watched: true, served: true, included: false },