自动化 End-End 测试 Nightwatch.js 简易化 selector

在 E2E 测试撰写时,除了可以利用 aria-label 外,使用客制化的 testing tag 来抓取测试元件是更好的方式

aria-label

指定 aria-label 可以使一个标签被标记为特定的字符串,且会替换任何其他原生标记机制

为了避免 aria-label 替换的问题,可以使用客制化的 testing tag,如:data-qa

Slack

<button class="c-button-unstyled p-top_nav__button p-top_nav__history_menu" aria-label="显示历程" data-qa="top-nav-history-menu" delay="150" aria-haspopup="menu" aria-expanded="false" data-sk="tooltip_parent" type="button"><i class="c-icon c-icon--clock-o" type="clock-o" aria-hidden="true"></i></button>

上面这段截自 slack 的上面的 Navbar

如此 E2E 就可以使用 data-qa 来抓取

browser.click('[data-qa=top-nav-history-menu]')

或是写成一个 pure function

// dataqa.js

module.exports = type => string => `[data-${type}="${string}"]`;
// test.spec.js

const dataQa = dataAttrSelector('qa');
browser.click(dataQA('top-nav-history-menu'))

<<:  day27: function composition

>>:  【资料视觉化】COVID新冠疫苗施打一览 Seaborn

[Day 29] -『 GO语言学习笔记』- 复合型别 - 切片(Slice) (I)

以下笔记摘录自『 The Go Workshop 』。 切片的核心其实还是阵列,切片只是在阵列外套上...

Wondershare Recoverit档案救援软件替代救援方案

如果家里、公司或学校电脑上的重要档案损坏或丢失,您一定会非常着急。不要担心,本文将爲您介绍一款适合任...

【没钱买ps,PyQt自己写】Day 11 - 以 Qlabel 在 PyQt 中显示图片 (基於 QImage 使用 OpenCV)

看完这篇文章你会得到的成果图 前言 我们接下来的讨论,会基於读者已经先读过我 day5 文章 的架构...

Day 21 利用transformer自己实作一个翻译程序(三) 文字标签化和去标签化

前言 昨天讲到要怎麽建立环境和下载资料集,今天要来讲文字的处理 文字标签化和去标签化 由於模型没有办...

安装kubeadmin

安装kubeadmin 在前一篇提到, 後续范例使用到的工具可以自建或使用现成的工具, 会将自建工具...