用<compose>测试Aurelia组件

Question

我正在尝试测试与aurelia-dialog一起使用的自定义对话框组件，该组件通过activate()方法获得它的属性绑定。为了测试组件，我使用一个<compose>元素设置测试，该元素还使用了如下所示的activate()方法：

beforeEach(() => {
  component = StageComponent
    .withResources('path/to/dialogComponent')
    .inView(`<compose view-model="path/to/dialogComponent" model.bind="mockModel">
             </compose>`)
    .boundTo(mockModel);
});

然而，当我测试绑定属性的视图模型时，我得到了一个空值，而实际的视图模型过去是这样的。

describe('#someComponentMethod()', () => {
  it('Should exist', done => {
    // In the past, I succesfully accessed child viewModels for
    // compose through the following property, after a general package update, 
    // this seems not to work anymore
    let viewModel = component.viewModel.currentViewModel

    expect(viewModel.someComponentMethod).toBeDefined(); 
    // ==> Runtime error, since currentViewModel === null

    done();
  });
});

是否有已知或更好的方法来测试没有可绑定属性但依赖于要由activate()绑定的模型的自定义元素？

此外，为了测试呈现:似乎有一个类似的问题，可能是相关的：Aurelia Testing Composed Custom Element

Answer 1

您可以调用create函数并传入从aurelia-bootstrapper导入的引导程序，如下所示：

import { bootstrap } from 'aurelia-bootstrapper';

...

component.create(bootstrap);

当我调用create时，就会生成并填充viewModel。create函数是可创建的，因此您可以访问.then(() => component.viewModel)中的viewmodel属性，也可以使用异步/等待，如下所示：

await component.create(bootstrap);