Testing Library - 简介

2024-03-09 06:44
文章标签 简介 library testing

本文主要是介绍Testing Library - 简介,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

@testing-library 软件包系列以用户为中心的方式帮助您测试 UI 组件。

你的测试越接近你的软件使用方式,它们能给你提供的信心就越多。

核心库 DOM Testing Library,是一个轻量级的解决方案,用于通过查询和与DOM节点(无论是使用JSDOM/Jest模拟还是在浏览器中)进行交互来测试网页。它提供的主要实用程序涉及以类似于用户在页面上查找元素的方式查询DOM中的节点。这样,该库有助于确保您的测试使您对应用程序在实际用户使用时的表现充满信心。

核心库已经被封装,为包括 React、Angular 和 Vue 在内的几个框架提供了人性化的 API。还有一个插件可以使用 Cypress 中的 testing-library 查询进行端到端测试,以及一个 React Native 的实现。

DOM Testing Library适用于任何提供 DOM API 的环境,例如 Jest、Mocha + JSDOM 或真正的浏览器。

使用测试库应避免的事项

您可能希望避免以下实现详细信息:
1、组件的内部状态

2、组件的内部方法

3、组件的生命周期方法

4、子组件

指导原则

我们尝试只提供那些鼓励你编写与实际使用方式相似的网页测试的方法和实用工具。

本项目中公共设施的配置基于以下指导原则:

1、如果它与渲染组件相关,那么它应该处理 DOM 节点而不是组件实例,并且它不应该鼓励处理组件实例。

2、它通常对于以用户会使用的方式测试应用程序组件很有用。我们在这里做出了一些权衡,因为我们正在使用计算机和通常是一个模拟的浏览器环境,但总的来说,实用程序应该鼓励以预期的方式使用组件的测试。

3、实用工具和API应该简单且灵活。

4、说到底,我们想要的是一个轻便、简单、易于理解的库。

FAQ

1、我应该使用哪种 get 方法?

答:参照:Which Query Should I Use

2、我可以用这个库编写单元测试吗?

答:当然可以!您可以使用这个库编写单元测试、集成测试和端到端测试。

       在编写测试时,请记住:

       您的测试越接近软件的实际使用方式,它们给您的信心就越多。

3、如果我的应用已本地化,而我无权访问测试中的文本,该怎么办?

这是相当常见的。我们的第一个建议是尝试获取测试中使用的默认文本。这将使一切变得更加容易(而不仅仅是使用此实用程序)。如果这不可能,那么您可能最好坚持使用data-testids(这本身也不错)。

4、我真的不喜欢 data-testids,但其他查询都没有意义。我必须使用 data-testid 吗?

当然不是。不过,人们不喜欢 data-testid 属性的一个常见原因是,他们担心将其发送到生产环境。我建议,你可能需要一些在生产环境中偶尔运行的简单端到端测试,以确保一切正常。在这种情况下,data-testid 属性将非常有用。即使你不在生产环境中运行这些测试,你可能也想在即将发送到生产环境的相同代码上运行一些端到端测试。在这种情况下,data-testid 属性也会在那里很有价值。

话虽如此,如果你真的不想发送 data-testid 属性,那么你可以使用这个简单的 babel 插件来删除它们。

如果你根本不想使用它们,那么你可以简单地使用常规的 DOM 方法和属性来查询容器中的元素。

const firstLiInDiv = container.querySelector('div li')
const allLisInDiv = container.querySelectorAll('div li')
const rootElement = container.firstChild

5、如果我正在迭代要放置 data-testid=“item” 属性的项目列表,该怎么办?如何区分它们?

你可以在选择器中包含:nth-child来让你的选择器只选择你想要的元素。

const thirdLiInUl = container.querySelector('ul > li:nth-child(3)')

或者,你可以使用getAllByRole查询 listitem 角色,并访问有问题的索引:

const items = [/* your items */
]
const {container} = render(/* however you render this stuff */)
const thirdItem = getAllByRole(container, 'listitem')[2]

6、我无法访问组件方法或组件实例!

这是有意的。

我们希望您将注意力集中在测试用户观察到的组件的输出和功能上,并避免担心组件的实现细节。

我们相信这会导致更少的脆弱和更有意义的测试代码。

请参阅此测试库的指导原则以获取更多信息。

这篇关于Testing Library - 简介的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/789844

相关文章

ASIO网络调试助手之一:简介

多年前,写过几篇《Boost.Asio C++网络编程》的学习文章,一直没机会实践。最近项目中用到了Asio,于是抽空写了个网络调试助手。 开发环境: Win10 Qt5.12.6 + Asio(standalone) + spdlog 支持协议: UDP + TCP Client + TCP Server 独立的Asio(http://www.think-async.com)只包含了头文件,不依

业务协同平台--简介

一、使用场景         1.多个系统统一在业务协同平台定义协同策略,由业务协同平台代替人工完成一系列的单据录入         2.同时业务协同平台将执行任务推送给pda、pad等执行终端,通知各人员、设备进行作业执行         3.作业过程中,可设置完成时间预警、作业节点通知,时刻了解作业进程         4.做完再给你做过程分析,给出优化建议         就问你这一套下

容器编排平台Kubernetes简介

目录 什么是K8s 为什么需要K8s 什么是容器(Contianer) K8s能做什么? K8s的架构原理  控制平面(Control plane)         kube-apiserver         etcd         kube-scheduler         kube-controller-manager         cloud-controlle

【Tools】AutoML简介

摇来摇去摇碎点点的金黄 伸手牵来一片梦的霞光 南方的小巷推开多情的门窗 年轻和我们歌唱 摇来摇去摇着温柔的阳光 轻轻托起一件梦的衣裳 古老的都市每天都改变模样                      🎵 方芳《摇太阳》 AutoML(自动机器学习)是一种使用机器学习技术来自动化机器学习任务的方法。在大模型中的AutoML是指在大型数据集上使用自动化机器学习技术进行模型训练和优化。

SaaS、PaaS、IaaS简介

云计算、云服务、云平台……现在“云”已成了一个家喻户晓的概念,但PaaS, IaaS 和SaaS的区别估计还没有那么多的人分得清,下面就分别向大家普及一下它们的基本概念: SaaS 软件即服务 SaaS是Software-as-a-Service的简称,意思是软件即服务。随着互联网技术的发展和应用软件的成熟, 在21世纪开始兴起的一种完全创新的软件应用模式。 它是一种通过Internet提供

LIBSVM简介

LIBSVM简介 支持向量机所涉及到的数学知识对一般的化学研究者来说是比较难的,自己编程实现该算法难度就更大了。但是现在的网络资源非常发达,而且国际上的科学研究者把他们的研究成果已经放在网络上,免费提供给用于研究目的,这样方便大多数的研究者,不必要花费大量的时间理解SVM算法的深奥数学原理和计算机程序设计。目前有关SVM计算的相关软件有很多,如LIBSVM、mySVM、SVMLight等,这些

urllib与requests爬虫简介

urllib与requests爬虫简介 – 潘登同学的爬虫笔记 文章目录 urllib与requests爬虫简介 -- 潘登同学的爬虫笔记第一个爬虫程序 urllib的基本使用Request对象的使用urllib发送get请求实战-喜马拉雅网站 urllib发送post请求 动态页面获取数据请求 SSL证书验证伪装自己的爬虫-请求头 urllib的底层原理伪装自己的爬虫-设置代理爬虫coo

新一代车载(E/E)架构下的中央计算载体---HPC软件架构简介

老规矩,分享一段喜欢的文字,避免自己成为高知识低文化的工程师: 屏蔽力是信息过载时代一个人的特殊竞争力,任何消耗你的人和事,多看一眼都是你的不对。非必要不费力证明自己,无利益不试图说服别人,是精神上的节能减排。 无人问津也好,技不如人也罢,你都要试着安静下来,去做自己该做的事.而不是让内心的烦躁、焦虑、毁掉你本就不多的热情和定力。 时间不知不觉中,快要来到夏末秋初。一年又过去了一大半,成

AI学习指南深度学习篇-带动量的随机梯度下降法简介

AI学习指南深度学习篇 - 带动量的随机梯度下降法简介 引言 在深度学习的广阔领域中,优化算法扮演着至关重要的角色。它们不仅决定了模型训练的效率,还直接影响到模型的最终表现之一。随着神经网络模型的不断深化和复杂化,传统的优化算法在许多领域逐渐暴露出其不足之处。带动量的随机梯度下降法(Momentum SGD)应运而生,并被广泛应用于各类深度学习模型中。 在本篇文章中,我们将深入探讨带动量的随

OpenGL ES学习总结:基础知识简介

什么是OpenGL ES? OpenGL ES (为OpenGL for Embedded System的缩写) 为适用于嵌入式系统的一个免费二维和三维图形库。 为桌面版本OpenGL 的一个子集。 OpenGL ES管道(Pipeline) OpenGL ES 1.x 的工序是固定的,称为Fix-Function Pipeline,可以想象一个带有很多控制开关的机器,尽管加工