如何能进深圳好的设计公司网站,十大免费云空间,wordpress移动显示,农业基本建设项目信息网站HTML5引入了一个很棒的新元素#xff0c;可以用来在窗格上绘制任意内容#xff1a; canvas元素。 数十年来#xff0c;胖客户端应用程序的标准功能现已引入Web应用程序领域。 Web开发人员不再需要使用专有插件在其应用程序中绘制图像或图表。 但是#xff0c;在进行测试时… HTML5引入了一个很棒的新元素可以用来在窗格上绘制任意内容 canvas元素。 数十年来胖客户端应用程序的标准功能现已引入Web应用程序领域。 Web开发人员不再需要使用专有插件在其应用程序中绘制图像或图表。 但是在进行测试时此新功能给Web开发社区带来了新的挑战。 如何在某个时间点测试canvas元素是否处于适当的状态 硒等标准技术专注于由Web服务器生成的标记而不关注画布上绘制的像素。 在该领域中更有前途的是使用图像处理来验证应用程序正确呈现其数据的技术。 这些框架之一是sikuli 。 Sikuli是一个开放源代码研究项目始于MIT现在由Raimund Hocke维护。 为了更实际地进行介绍我们假设有一个简单的Web应用程序该应用程序使用HTML5 canvas元素实现一些简单的图像处理功能例如灰度增亮和阈值过滤器以及撤消按钮此应用程序的代码可以照常在github上找到 sikuli的安装当然取决于平台。 可以从sikuli下载页面下载的安装程序是一个Java Swing应用程序询问您典型的使用模式。 由于我们不想使用python IDE因此从选项列表中选择选项4。 然后下载实际的jar文件并为我们的操作系统做好准备。 安装过程完成后我们会在安装目录中找到与OS相关的jar文件。 由于我们的示例项目使用maven作为构建系统因此在将库复制到lib文件夹后我们必须引入系统范围的依赖关系 dependencygroupIdorg.sikuli/groupIdartifactIdsikuli/artifactIdversion1.0/versionscopesystem/scopesystemPath${basedir}/lib/sikuli-java.jar/systemPath
/dependency 首次使用sikuli时它将一些本机库提取到一个新文件夹中在我们的示例中为$ {basedir} / lib / libs。 该文件夹必须添加到用户的路径环境变量中。 现在我们已经安装了sikuli让我们设置arquillian以便编写我们的第一个单元测试。 例如 此处介绍了如何设置Arquillian。 由于我不想重复所有操作因此在下面您将仅找到单元测试类 RunWith(Arquillian.class)
public class FilterTest {public static final String WEBAPP_SRC src/main/webapp;ArquillianResourceURL deploymentURL;private Screen screen;Beforepublic void before() throws URISyntaxException, IOException {screen new Screen();if (Desktop.isDesktopSupported()) {Desktop.getDesktop().browse(deploymentURL.toURI());} else {fail();}}Deploymentpublic static WebArchive createDeployment() {return ShrinkWrap.create(WebArchive.class, html5-sikuli-webapp.war).addClasses(HomeBackingBean.class).addAsWebResource(new File(WEBAPP_SRC, home.xhtml)).addAsWebResource(new File(WEBAPP_SRC, resources/css/style.css), resources/css/style.css).addAsWebResource(new File(WEBAPP_SRC, resources/images/rom.jpg), resources/images/rom.jpg).addAsWebResource(new File(WEBAPP_SRC, resources/js/html5Sikuli.js), resources/js/html5Sikuli.js).addAsWebResource(new File(WEBAPP_SRC, resources/js/jquery-2.0.3.js), resources/js/jquery-2.0.3.js).addAsWebInfResource(EmptyAsset.INSTANCE, beans.xml).setWebXML(new File(WEBAPP_SRC, WEB-INF/web.xml));} createDeployment方法设置战争存档由arquillian部署到JBoss AS 7.1.1.Final请参阅arquillian.xml文件。 在Before方法中我们使用SDK类Desktop来打开默认浏览器并将其指向部署URL。 在这里我们还创建了sikuli类Screen的实例。 此类提供了与我们的应用程序进行交互所需的所有方法。 让我们更详细地看一下 Test
RunAsClient
public void testGrayScale() throws FindFailed {screen.wait(getFullPath(originalImage.png));screen.find(getFullPath(btnUndo_disabled.png));screen.click(getFullPath(btnGrayscale.png));screen.find(getPattern(grayscaleImage.png, 0.9f));screen.click(getFullPath(btnUndo_enabled.png));screen.click(getPattern(originalImage.png, 0.9f));
}private Pattern getPattern(String path, float similarity) {Pattern p new Pattern(getFullPath(path));return p.similar(similarity);
}private String getFullPath(String path) {return src/test/resources/img/ path;
} 由于sikuli基于图像处理因此我们可以定义之前单击的屏幕快照中要单击的位置和要验证的内容。 在这个简单的示例中我将所有屏幕截图都以png文件的形式存储在我们项目的src / test / resources / img文件夹中。 更高级的项目可能需要更复杂的文件夹层次结构。 如您所见我们首先等待应用程序显示。 一旦sikuli找到了第一个屏幕截图我们将确认“撤消”按钮已被禁用。 这是通过调用带有禁用按钮图像的find方法来完成的。 现在我们可以单击按钮“灰度”同样由该按钮的图像指定然后验证是否在屏幕上找到了该图像的灰度版本。 Sikuli不仅逐像素比较两个图像而且如果您愿意它还可以计算找到的屏幕区域与请求区域的相似度。 当您需要更宽容时例如如果您想在不同的浏览器中测试应用程序并且这些会使按钮稍微不同这将有所帮助。 相似性属性的默认值为0.7f但是如果将其增加到1.0f则可以进行简单的逐像素比较。 但这并不是全部。 有了sikuli您几乎可以完成人类交互者可以做的所有事情 使用screen.type输入字符 用screen.doubleClick双击 使用screen.dragDrop执行拖放操作 使用鼠标滚轮 … 结论 Sikuli是一个功能强大且易于使用的工具可以对严重依赖HTML5的canvas对象的Web应用程序执行集成测试。 对于标准胖客户端应用程序SwingJavaFX当然也是如此。 您可以与Arquillian一起设置涵盖许多“真实”用例的综合测试套件。 参考在Martins Developer World博客上我们的JCG合作伙伴 Martin Mois 使用sikuli和arquillian测试HTML5 canvas应用程序 。 翻译自: https://www.javacodegeeks.com/2013/11/testing-html5-canvas-applications-with-sikuli-and-arquillian.html
