Ketcher项目单体选择器自动化测试重构实践

Ketcher项目单体选择器自动化测试重构实践

【免费下载链接】ketcher Web-based molecule sketcher 【免费下载链接】ketcher 项目地址: https://gitcode.com/gh_mirrors/ke/ketcher

在化学结构编辑器Ketcher的自动化测试开发过程中,测试代码中存在着大量直接通过单体名称字符串常量来定位和操作单体元素的实现方式。这种硬编码方式不仅降低了代码的可维护性,也增加了测试用例的脆弱性。本文介绍我们如何通过引入枚举类型和专用选择器函数来优化这一设计。

问题背景

在Ketcher的测试代码中,经常会出现类似这样的实现:

await page.getByText('D-Hyp').locator('..').first().click();

这种直接使用字符串常量'D-Hyp'来定位单体的方式存在几个明显问题:

  1. 字符串常量分散在各处,难以统一管理
  2. 单体名称变更时需要修改多处代码
  3. 缺乏类型检查,容易拼写错误
  4. 代码可读性较差,无法直观理解单体类型

解决方案设计

我们设计了以下改进方案:

  1. 建立单体枚举类型:在templateModal.ts中定义Sugars(糖类)、Bases(碱基)、Phosphates(磷酸盐)、Peptides(肽类)和CHEMs(化学物质)等枚举类型,为每种单体赋予明确的标识符。

  2. 创建专用选择器函数

async function selectMonomer(
  page: Page,
  monomerType: Sugars | Bases | Phosphates | Peptides
)
  1. 重构命名规范:将一些不符合常规命名规则的枚举成员重命名,如将TwelveddR改为_12ddR,使其更符合编程规范。

实施细节

枚举类型定义示例

enum Peptides {
  D_Hyp = 'D-Hyp___trans-4-hydroxy-D-proline'
  // 其他肽类单体...
}

选择器函数实现

选择器函数内部封装了单体元素的定位逻辑,测试代码只需关心使用哪个单体,而不需要知道具体的DOM结构。

重构前后对比

重构前:

await page.getByText('D-Hyp').locator('..').first().click();

重构后:

await selectMonomer(page, Peptides.D_Hyp);

技术优势

  1. 类型安全:通过TypeScript的枚举类型和参数类型检查,避免了字符串拼写错误。

  2. 集中管理:所有单体定义集中在一处,便于统一维护。

  3. 可读性提升:代码意图更加明确,Peptides.D_Hyp比字符串'D-Hyp'更能表达业务含义。

  4. 可维护性增强:当单体名称或定位方式变化时,只需修改选择器函数或枚举定义,而不需要修改所有测试用例。

  5. 一致性保证:统一了单体选择的操作方式,避免了不同测试用例中定位逻辑的差异。

实施效果

该重构完成后,Ketcher项目的自动化测试代码在以下几个方面得到了显著改善:

  1. 减少了约30%与单体选择相关的代码量
  2. 提高了测试用例的稳定性
  3. 降低了后续维护成本
  4. 为新增单体的测试支持提供了标准化方式

这种模式也为项目中其他类似的元素选择场景提供了参考,可以推广到更广泛的测试元素定位场景中。

经验总结

在UI自动化测试中,直接使用文本内容或DOM结构进行元素定位是一种常见的反模式。通过引入业务相关的抽象层,可以显著提高测试代码的质量。Ketcher项目的这一实践证明了:

  1. 即使是测试代码,也应该遵循良好的软件设计原则
  2. 适当的抽象可以平衡测试的稳定性和可维护性
  3. 类型系统在测试开发中同样能发挥重要作用
  4. 统一的命名规范对长期维护至关重要

这一改进不仅提升了Ketcher项目测试代码的质量,也为其他化学信息学软件的测试开发提供了有价值的参考模式。

【免费下载链接】ketcher Web-based molecule sketcher 【免费下载链接】ketcher 项目地址: https://gitcode.com/gh_mirrors/ke/ketcher

创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值