中文

HTML5 <canvas> 游戏中视觉缺陷的自动检测

软件工程 2022-08-05 v1

摘要

HTML5 <canvas> 用于在网页应用程序(如网页游戏,即 <canvas> 游戏)中显示高质量图形。然而,使用现有的网页测试技术和工具无法自动测试 <canvas> 游戏,而手动测试则费力。许多广泛使用的网页测试工具依赖文档对象模型(DOM)来驱动网页测试自动化,但 <canvas> 的内容并未在 DOM 中表示。主要的替代方法——快照测试,涉及使用图像相似性度量将预言快照图像与测试时快照图像进行比较,以捕获视觉缺陷,即网页应用程序图形中的缺陷。然而,为 <canvas> 游戏创建和维护预言快照图像是繁重的,违背了测试自动化的初衷。在本文中,我们利用 <canvas> 上对象的内部表示,将快照图像分解为一组对象图像,每张对象图像使用四种相似性度量(百分比重叠、均方误差、结构相似性和嵌入相似性)与相应的预言资源(如精灵图)进行比较。我们通过向一个自定义 <canvas> 游戏中注入 24 个视觉缺陷来评估我们的方法,发现我们的方法达到了 100% 的准确率,而传统快照测试的准确率为 44.6%。

关键词

引用

@article{arxiv.2208.02335,
  title  = {Automatically Detecting Visual Bugs in HTML5 <canvas> Games},
  author = {Finlay Macklon and Mohammad Reza Taesiri and Markos Viggiato and Stefan Antoszko and Natalia Romanova and Dale Paas and Cor-Paul Bezemer},
  journal= {arXiv preprint arXiv:2208.02335},
  year   = {2022}
}

备注

Accepted at ASE 2022 conference