Unit testing 使用可绑定和依赖项测试aurelia customElement

我正在使用Aurelia的1.0.0-beta.1，并尝试编写一些单元测试

我有这样一个自定义元素：

...
@inject(BindingEngine, Class1, Class2)
export class MyElement{

@bindable data;

constructor (bindingEngine, class1, class2) {
    ...
}
...

import {TemplatingEngine} from 'aurelia-templating';
import {Container} from 'aurelia-dependency-injection';
import {BindingEngine} from 'aurelia-binding';

import { Class1Mock, Class2Mock } from './myMocks';

describe('The MyElement customElement', () => {
    let container;
    let bindingEngine;
    let templateEngine;

    let myElement;

    beforeEach(() => {
        container = new Container();

        //Add my mocks to DI container?
        container.registerInstance('Class1', new Class1Mock());
        container.registerInstance('Class2', new Class2Mock());

        templateEngine = container.get(TemplatingEngine);
        bindingEngine  = container.get(BindingEngine);

        myElement = templateEngine.createViewModelForUnitTest(MyElement);
    }

    it('should be initialized', (done) => {

        expect(myElement).not.toBe(null);
        expect(myElement).not.toBe(undefined);
        done();
    });
}

我想创建一个MyElement的可测试实例，模拟Class1和Class2 以及处理可绑定的字段数据

到目前为止，我发现，由于API的变化，使用BehaviorInstance的示例不再有效

在查看了， 我的方法现在看起来像这样：

...
@inject(BindingEngine, Class1, Class2)
export class MyElement{

@bindable data;

constructor (bindingEngine, class1, class2) {
    ...
}
...

import {TemplatingEngine} from 'aurelia-templating';
import {Container} from 'aurelia-dependency-injection';
import {BindingEngine} from 'aurelia-binding';

import { Class1Mock, Class2Mock } from './myMocks';

describe('The MyElement customElement', () => {
    let container;
    let bindingEngine;
    let templateEngine;

    let myElement;

    beforeEach(() => {
        container = new Container();

        //Add my mocks to DI container?
        container.registerInstance('Class1', new Class1Mock());
        container.registerInstance('Class2', new Class2Mock());

        templateEngine = container.get(TemplatingEngine);
        bindingEngine  = container.get(BindingEngine);

        myElement = templateEngine.createViewModelForUnitTest(MyElement);
    }

    it('should be initialized', (done) => {

        expect(myElement).not.toBe(null);
        expect(myElement).not.toBe(undefined);
        done();
    });
}

在从DI容器请求bindingEngine时，或者在创建MyElement模型时，它已经失败了

Error: Error invoking TaskQueue. Check the inner error for details.
    ------------------------------------------------
    inner error: TypeError: _aureliaPal.DOM.createMutationObserver is not a function
        at makeRequestFlushFromMutationObserver (.../jspm_packages/npm/aurelia-task-queue@1.0.0-beta.1/aurelia-task-queue.js:13:36)
        at new TaskQueue (.../jspm_packages/npm/aurelia-task-queue@1.0.0-beta.1/aurelia-task-queue.js:59:41)
        at Object.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:334:14)
        at InvocationHandler.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:309:168)
        at Container.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:557:25)
        at StrategyResolver.get (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:145:37)
        at Container.get (../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:488:41)
        at Object.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:354:33)
        at InvocationHandler.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:309:168)
        at Container.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:557:25)
        at StrategyResolver.get (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:145:37)
        at Container.get (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:488:41)
        at Object.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:354:33)
        at InvocationHandler.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:309:168)
        at Container.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:557:25)
        at StrategyResolver.get (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:145:37)
        at Container.get (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:488:41)
        at new AggregateError (.../jspm_packages/npm/aurelia-pal@1.0.0-beta.1/aurelia-pal.js:20:13)
        at Container.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:559:15)
        at Object.invoke (.../jspm_packages/npm/aurelia-dependency-injection@1.0.0-beta.1/aurelia-dependency-injection.js:344:33)

那么，我该怎么做才对呢

------编辑：

迈克尔·马龙的答案完美无瑕。对于提出这个问题的任何人来说，我的例子就是这样的：

import {TemplatingEngine} from 'aurelia-templating';
import {Container} from 'aurelia-dependency-injection';
import {BindingEngine} from 'aurelia-binding';
import {initialize} from 'aurelia-pal-browser';

import { Class1Mock, Class2Mock } from './myMocks';

describe('The MyElement customElement', () => {
    let container;
    let bindingEngine;
    let templateEngine;

    let myElement;

    initialize();

    beforeEach(() => {
        container = new Container();

        //Add my mocks to DI container?
        container.registerInstance('Class1', new Class1Mock());
        container.registerInstance('Class2', new Class2Mock());

        templateEngine = container.get(TemplatingEngine);
        bindingEngine  = container.get(BindingEngine);

        myElement = templateEngine.createViewModelForUnitTest(MyElement);
    }

    it('should be initialized', (done) => {

        expect(myElement).not.toBe(null);
        expect(myElement).not.toBe(undefined);
        done();
    });
}

---

在测试中，您需要执行以下操作：

import {initialize} from 'aurelia-pal-browser';

initialize();

（由于它是内联执行的，所以只需要在您的测试中的某个地方。我们将它放在一个单独的

initialize.spec.js

文件中）

谢谢！最后…=）你是我今天的英雄！