ui组件如何进行单元测试,该测试那些内容呢

在写一个 vue2 的 UI库, 纠结要不要写单元测试,但是又不知道要测试那些东西。。

回答:

通用性越高的库或框架,就越必要添加单元测试。

对于一个完整的 UI 库而言,通常应该包含如下内容:

  • 代码;

  • 文档;

  • 示例;

  • 自动化测试。

其中,文档与示例用于提供给库的使用者,示例使其能够直观地判断这个库是否能够满足自己的需求,而文档可以指导其在自己的项目中集成并使用该库。

而自动化测试,是提供给 UI 库的开发及维护人员,它能够带来以下好处:

  • 降低人工测试的成本;虽然编写及维护测试脚本需要付出额外的成本,但从长远来看,这些成本通常远比采用人工测试要低地多;

  • 保证该库在后续的开发维护过程中不会出现意料之外的问题;在修改代码「比如优化、重构、修改或添加新的功能等」后,往往需要重新进行测试,这时人工测试通常无法保证覆盖到每一个测试点,这时就会为项目带来隐患;

  • 评估其可用性;一般编写测试的过程就是使用这个库的过程,这时我们可以方便地评估这个库的可用性是否良好;

  • 提供稳定可靠的印象;一般情况下,开发人员更偏向于使用提供单元测试的库,这会避免一些不必要的风险。

当然,以上观点只是对于通用性较高的库而言的。

而对于与业务相关的 UI 部分,通常由于其界面变动较为频繁,维护其测试脚本的成本会很高,与其专门招一两个懂得自动化测试的工程师来维护测试脚本,还不如用比较低的工资招聘几个人进行人工测试来的成本低,这时就需要根据项目所需的稳定程度来仔细权衡了。

回答:

之前也纠结过是否给单个React组件做单测,后来我的基本原则是:

是否能帮助更早,或更快地找到bug~

只要目的不要偏,不要头重脚轻,写测试的成本比开发的成本还大~

回答:

UI库大致可以分为3类:

  • 工作中使用(整个系统的基础模块甚至全公司共享的模块)

  • 贡献开源社区

  • 自己练手

对于自己练手的库,完全不需要,会浪费时间。但如果是学习怎么写这方面的测试,可以写一两个,熟悉流程,做到心中有数,具体操作看下面。

对于以工作中使用和开源社区为目的,只需要单元测试而且是完全必要的。原因如下:

  • 虽然单元测试需要花费时间且所花时间会比模块本身更多,但是性价比却是随着使用的次数越来越高

  • 在工作中或开源社区中,我们写库的目的都是为了能更好的为别人使用,这个时候单元测试应该是必须的。

  • 好的单元测试可以作为优秀的文档,并且保证模块行为的确定性。

  • UI库并不设计业务逻辑,所以只写单元测试已经足够

学习怎么测试Vue:

  1. 看官方网站怎么写单元测试,https://cn.vuejs.org/v2/guide…

  2. 学习已有库的单元测试,如:https://github.com/sagalbot/v…

该测哪些方面:

  • 模块应被渲染的DOM树是否正确

  • 模块的属性传递是否正确,(属性是方法则是否被正确调用,属性是布尔值或对象则是否被正确传递且达到预期的目的)

  • 模块内的各个行为是否正确

  • 甚至你还可以测试各个DOM节点是否被应用预期的class,且这些class是不是预期的样式

希望能帮到你

回答:

一个简单好用的UI测试工具https://github.com/360hnjd-fe…

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注