如何配置SystemJS以将新模块实例加载到Jasmine测试套件中

时间:2015-06-04 20:53:41

标签: javascript jasmine karma-jasmine jspm systemjs

我们一直在使用RequireJS,Bower和npm。现在我们对jspm和SystemJS印象深刻。

我们喜欢他们:

  • 与AMD合作,最大限度地减少转换现有代码的痛苦
  • 允许我们使用新功能编写ES2015模块
  • 有一个与他们维护的RequireJS类似的配置文件。
  • 允许我们从Node和GitHub中提取不需要在凉亭注册的库

我们唯一可以发现禁止我们进行切换的方法是,我们需要一种方法来告诉SystemJS为我们提供所需模块的新实例,这些实例被加载到包含Jasmine测试套件的模块中。

使用RequireJS,我们通过向窗口添加createRequireContext来实现这一点

(function (window) {
    var contextId = 0;

    window.createRequireContext = function () {
        var config = $.extend(true, window.globalRequireConfig, {
            baseUrl: '/base/src',
            context: 'new-context' + contextId++,
            paths: {
                'testData': '../test/data',
                'testFiles': '../test/testFiles'
            }
        }), 
        context = requirejs.config(config);

        return context.apply(this, arguments);
    };
})(window);

然后我们在Jasmine测试套件中调用createRequireContext:

define(function () {
    var simpleObject;

    describe('new context for each test', function () {
        beforeEach(function (done) {
            createRequireContext(['testFiles/SimpleObjectModule'], function (newSimpleObject) {
                simpleObject = newSimpleObject;
                done();
            });
        });

        describe("createRequireContext", function () {
            it("retrieves a module with a new context and change a variable", function () {
                expect(simpleObject.foo).toBe('bar');
                simpleObject.foo = 'Old Data';
                expect(simpleObject.foo).toBe('Old Data');
            });
            it("retrieves a module with a new context and has original value", function () {
                expect(simpleObject.foo).toBe('bar');
            });
        });
    });

    describe('new context for each test suite', function () {
        beforeAll(function (done) {
            createRequireContext(['testFiles/SimpleObjectModule'], function (newSimpleObject) {
                simpleObject = newSimpleObject;
                done();
            });
        });

        describe("createRequireContext", function () {
            it("retrieves a module with a new context and change a variable", function () {
                expect(simpleObject.foo).toBe('bar');
                simpleObject.foo = 'New Data';
                expect(simpleObject.foo).toBe('New Data');
            });
            it("retrieves a module with a new context and has changed value", function () {
                expect(simpleObject.foo).toBe('New Data');
            });
        });
    });
});

在beforeEach中创建新上下文可隔离每个测试所需的模块。在beforeAll中创建新上下文将所需的模块与其他测试套件中的模块隔离开来。

我们有办法用SystemJS和jspm吗?

1 个答案:

答案 0 :(得分:0)

我知道的唯一方法是在ES6中编写测试,然后只需在测试文件中导入模块:

import {SimpleObject} from '../../../src/SimpleObject';

let simpleObject;

describe('new context for each test',() => {
    beforeEach(() => {
          simpleObject = new SimpleObject();
    });

    describe("createRequireContext", () => {
        it("retrieves a module with a new context and change a variable", () => {
            expect(simpleObject.foo).toBe('bar');
            simpleObject.foo = 'Old Data';
            expect(simpleObject.foo).toBe('Old Data');
        });
        it("retrieves a module with a new context and has original value", function () {
            expect(simpleObject.foo).toBe('bar');
        });
    });
});

在这里你可以看到working project它是用TypeScript编写的,但是使用ES6它的工作方式非常相似。您可以删除TS支持(类型,装饰器和更多奖金)将转换器更改为babel并将文件扩展名更改为* .js;)