Question

我正在将Angular 2应用升级到版本4.0.1，并且我遇到了一些测试问题。

我正在尝试获取子组件的属性并测试给定的值是否正确。

不幸的是，在测试上下文中似乎未定义属性，即使组件在JiT构建和AoT构建中表现正确。

更新到Angular 4.0.1后，测试才破裂

我父组件的模板：

<div>
  <div *ngIf="isComponentEnabled">
    <child-component
      superBaseUrl="super_url" i18n-superBaseUrl="frk|"
      [slug]="slug"
      [name]="name"
      [age]="age">
    </child-component>
    .....

  </div>
</div>

测试中断：

     it(`GIVEN parent-component
      THEN it should have correct attribute values`, () => {
      componentInstance.name = 'Bar';
      componentInstance.age = 90;
      componentInstance.slug = 'foo';

      attributes = specService.queryAttributes(
        componentFixture, 'child-component');

      console.log('HEYA -> ', specService.queryDebugElement(
        componentFixture, 'child-component'));
      expect(attributes['superbaseurl']).toBe('super_url');
      expect(attributes['i18n-superbaseurl']).toBe('frk|');
      expect(attributes['ng-reflect-slug']).toBe('foo');
      expect(attributes['ng-reflect-name']).toBe('Bar');
      expect(attributes['ng-reflect-age']).toBe('90');
    });

破坏测试的输出：

Expected undefined to be 'foo'.
Expected undefined to be 'Bar'.
Expected undefined to be '90'.

测试中的控制台日志：

<child-component _ngcontent-c115="" i18n-superbaseurl="frk|" superbaseurl="super_url">
</child-component>

所以我不明白为什么在版本4中没有在这种情况下生成属性。在版本2.X.X中，我们有ng-reflect，但似乎不再是这种情况。

我还试图在模板中添加一个基本属性（toto =“toto”），这个属性出现在测试的console.log中。

是否有人知道为什么属性不再显示？

P.S：specService.queryAttributes只是一个在查询属性之前调用detectChanges的包装器。

Answer 1

发现它！

对于任何感兴趣的人，如果您希望属性可查询，则必须添加每个子组件并在TestBed中的4.0.1版中进行编译。

在版本2.X中，这不是必需的。

修改

此外，请参阅https://github.com/angular/angular/issues/15822，因为我不知道这是否有意。

Angular 4 Unit Tests子组件的属性

1 个答案: