Question

export class ComponentDetailsComponent implements OnInit {   
    @ViewChild('treeGridReference') treeGrid: jqxTreeGridComponent;
....more code....
  this.treeGrid.clearSelection();// how do I mock this?
}

如果是构造函数依赖项，我本可以使用空的jqxTreeGridComponent方法为clearSelection创建一个存根，类似于：

class jqxTreeGridComponentStub{
  clearSelection(){}
  }
}
{ provide: jqxTreeGridComponent, useClass: jqxTreeGridComponentStub },

Answer 1

provide用于提供者。

在这里，您有一个模板参考。

要模拟它，只需在beforeEach中进行：

component.jqxTreeGridComponent = myTreeGridMock;

并声明myTreeGridMock，以便它包括整个组件中使用的所有方法和属性（显然，也可以模拟那些函数和变量）

Answer 2

您可以在configure Testing模块的声明数组中提供一个模拟组件，

@Component({selector: 'jqxTreeGridComponent-selector', template: ''})
class jqxTreeGridComponent{
   clearSelection(){}
}

describe('', () => {
    beforeEach(async(() => {
            TestBed.configureTestingModule({
                declarations: [ ComponentDetailsComponent , jqxTreeGridComponent],
            }).compileComponents();
        }));
    })
}

要了解有关存根组件的更多信息，请阅读文档中的here。

如何模拟不依赖于构造函数的第三方组件？

2 个答案: