Vue 关于单元测试 - javascript

Question

我看到了许多测试真实 DOM 元素的单元测试示例。

前任：

expect(vm.$el.querySelector('div').textContent).toBe('xxx')

检查 DOM 元素的文本的目的是什么？

有人说你可以测试计算值，但不是使用nextTick测试计算值吗？

另外，人们说 HTML 标签会影响元素的文本：

<htmlTag><a><p>{{user.name}}</p></a></htmlTag>

如果产品有多种语言怎么办？

我相信我们应该测试应该在 HTML 模板中正确显示的数据、状态、函数和元素。

你们都在用 Vue 的单元测试做什么？

Answer 1

您提出不同的问题，但我将尝试回答有关 DOM 中单元测试的“一般”问题。

由于不同的原因，DOM 元素中的单元测试可能很有用，但最重要的通常是这些：

• 测试简单的用户操作

  简单用户操作示例：

  单击切换 DOM 元素可见性的链接 提交触发表单验证的表单 (...) 这些操作可以通过模拟 DOM 事件轻松测试

• 分析网络特征

  操纵 JavaScript 以确定浏览器内的各种网络特征。 这里有一个例子

• 测试 DOM 突变和操作

  这里解释了一个很好的例子

正如您所说，最好直接测试状态/变量/方法，但有时唯一的方法是使用真实或虚拟 DOM。

要了解更多信息，您可以Unit Testing in JavaScript此处查看GitHub 上的Unit Testing in JavaScript （很棒的）指南

希望它澄清并帮助你！