Dart 尝试在组件测试中使用“角度组件”的“材质下拉选择”
我正在使用最新的Dart 尝试在组件测试中使用“角度组件”的“材质下拉选择”,dart,angular-dart,Dart,Angular Dart,我正在使用最新的angular\u组件-0.6.0-alpha+2包进行一些测试,因为我想在我的angular应用程序中对我的组件进行单元测试。我基本上想使用pageloader包在测试期间单击并打开下拉选择,以单击选项 现在,我正试图在我的自定义中安装(由角度组件生成) 但是,我的问题是,由于某种原因,提供程序没有被覆盖 我创建了一个示例应用程序,它是angular\u components\u示例应用程序的简化版本,用于演示我的问题。如果您运行应用程序,然后打开下拉选择,然后检查DOM,您将
angular\u组件-0.6.0-alpha+2
包进行一些测试,因为我想在我的angular应用程序中对我的
组件进行单元测试。我基本上想使用pageloader
包在测试期间单击并打开下拉选择,以单击选项
现在,我正试图在我的自定义
中安装
(由角度组件生成)
但是,我的问题是,由于某种原因,提供程序没有被覆盖
我创建了一个示例应用程序,它是
angular\u components\u示例
应用程序的简化版本,用于演示我的问题。如果您运行应用程序,然后打开下拉选择,然后检查DOM,您将看到角度组件\u示例的
没有按照我的意愿安装在我的
下。下面是我的示例应用程序:您非常接近。我们在指定不同的OverlyContainerParent
时做了一些非常类似的事情。问题是顶级可注入不是OverlyContainerParent
。依赖关系树如下所示:
OverlyService
->OverlyDomainRenderService
->OverlyContainerToken
->OverlyContainerParent
角度注入的工作方式是当请求overlyservice
的实例时,它将沿着注入树走到找到绑定为止。然后,在树中的该级别,它将获得相同级别和更高级别的依赖项。因此,在这种情况下,您在注入树的下方指定了一个不同的OverlyContainerParent
实现,因此除非您要求直接注入该令牌,否则它永远不会被使用
在我们的测试中,我们的提供商看起来像这样:
const[popubindings,const Provider(OverlyContainerParent,
useFactory:GetOverlyContainerParent,deps:const[文档]
这将确保在树中的同一级别指定覆盖绑定,并且您的值将覆盖popubindings
中的值
注意:如果您直接将其放在组件上,您将得到一个关于嵌套覆盖绑定的日志错误。这是因为工程师直接在组件上指定弹出绑定,并且无法使用其他容器进行测试,因为他们无法覆盖测试中的值(注入树中的非测试绑定总是比我们可以提供测试绑定的任何地方都要低。)
更好的解决方案是使用angular\u test
中的NgTestBed
,并使用addProviders
在顶层指定这些提供程序。现在解决了这个问题,您可以找到通过测试的工作示例。
<my-app>Loading...</my-app>
<div id="my-container"></div>
</body>
</html>
HtmlElement getOverlayContainerParent(Document doc) =>
doc.querySelector('#my-container');
@Component(
selector: 'material-select-demo',
styleUrls: const ['material_select_demo.css'],
templateUrl: 'material_select_demo.html',
directives: const [
CORE_DIRECTIVES,
DisplayNameRendererDirective,
ExampleRendererComponent,
MaterialCheckboxComponent,
MaterialDropdownSelectComponent,
MaterialSelectComponent,
MaterialSelectItemComponent,
],
providers: const [
const Provider(overlayContainerParent,
useFactory: getOverlayContainerParent, deps: const [Document]),
],
)
class MaterialSelectDemoComponent {