如何对自定义元素进行单元测试

问题描述 投票:1回答:1

我有一个扩展HTMLElement的课程。从阅读这个线程

https://github.com/Microsoft/TypeScript/issues/574#issuecomment-231683089

我看到我无法实例化一个自定义元素而没有获得Illegal constructor。另外,registerElement看起来很有前途,因为它返回了自定义元素的构造函数,但现在不推荐使用CustomElementRegistry.define(),它存在于窗口对象上,而2.返回void。任何解决方案将不胜感激,谢谢。

对于这个特定的设置,我试图使用本机自定义元素而不是Web组件框架,因为我只需要自定义元素。此外,我正在使用TypeScript并尝试使用Jest来测试它。

javascript typescript web-component jest custom-element
1个回答
3
投票

根据您的元素究竟在做什么,您可以考虑将设计原则“关注点分离”和“控制反转”考虑在内。

当在不同的类中实现不同的事物时,将实现关注的分离。这也意味着可以在不实例化具体HtmlElement的情况下测试分离的东西。

控制的反转在这一点上派上用场,因为如果可以从类外部设置分离类(可能是HtmlElement)的依赖关系,则可以通过给测试实例提供存根来轻松地存根或模拟HtmlElement。

我们的想法是设计您的代码,使其独立于单元测试中无法访问或控制的内容。

© www.soinside.com 2019 - 2024. All rights reserved.