如何使用 Selenium、Java 自动化图表答案

【问题标题】：How to automate graphs using Selenium, Java如何使用 Selenium、Java 自动化图表
【发布时间】：2014-06-01 11:09:57
【问题描述】：

我将数据注入 Web 应用程序，它会生成图形和饼图。我想通过 Selenium 测试图表上的结果是否与给定数据一致。有任何想法吗？谢谢，最好的问候！！！

【问题讨论】：

如果您的应用程序将图形和饼图作为图像提供。那么就无法通过 selenium 实现自动化。
你看到这些答案是多么的无处不在吗？那是因为你没有为任何人提供足够的信息来帮助你。如果您包含 DOM 的提取，以了解如何有效地使用 Selenium 从文档模型中提取数据并将其与您的预期结果进行比较，这将有所帮助。

标签： java selenium selenium-webdriver

【解决方案1】：

假设您的图表有一个 Javascript 模型（例如一个数组），您可以使用 assertEval 命令断言该数组的内容。

【讨论】：

【解决方案2】：

我正在为您的饼图问题发布最基本但基本的示例，在这里，我以 Yahoo 的基于 YUI 的 PIE 图表为例。在每次刷新中，所有部分都是动态创建的，因此我在 element 的 id 中使用 contains 。图表中的控件不是简单的 HTML，而是 svg（HTML5 控件），因此我们需要在 xpath 中使用 //*。

我的动机是在 PIE 图中找到这些动态部分（在当前图表中，这里有 5 个部分）

并单击每个部分并打印其中的工具提示文本。

输出将是这样的。紫罗兰色部分：天：星期一税收：2000

灰色部分：日期：星期五税收：2000

浅紫罗兰部分：天：星期四税收：200

绿色部分：天：星期三税收：4000

棕色部分：天：星期二税金：50 0.61%

这是它的演示程序，你可以在任何地方执行它... :)

 package tests;

 import java.util.concurrent.TimeUnit;
 import org.openqa.selenium.By; 
 import org.openqa.selenium.WebDriver;
 import org.openqa.selenium.WebElement;
 import org.openqa.selenium.firefox.FirefoxDriver;


 public class testCode {
 public static WebDriver driver;

 public static void main(String[] args) throws InterruptedException {

 driver = new FirefoxDriver();
 driver.get("http://yuilibrary.com/yui/docs/charts/charts-pie.html");

 driver.manage().timeouts().implicitlyWait(5, TimeUnit.SECONDS);

 **//FIND DIFFERENT SECTIONS IN PIE CHART**

 WebElement ViolettePart = driver.findElement(By.xpath("//*   [contains(@id,'yui_3_13_0_1_')][contains(@class,'yui3-svgSvgPieSlice')][@fill='#66007f']"));
 WebElement GreenPart = driver.findElement(By.xpath("//*[contains(@id,'yui_3_13_0_1_')][contains(@class,'yui3-svgSvgPieSlice')][@fill='#295454']"));
 WebElement GreyPart = driver.findElement(By.xpath("//*[contains(@id,'yui_3_13_0_1_')][contains(@class,'yui3-svgSvgPieSlice')][@fill='#e8cdb7']"));
 WebElement LightViolettePart = driver.findElement(By.xpath("//*[contains(@id,'yui_3_13_0_1_')][contains(@class,'yui3-svgSvgPieSlice')][@fill='#996ab2']"));
 WebElement BrownPart = driver.findElement(By.xpath("//*[contains(@id,'yui_3_13_0_1_')][contains(@class,'yui3-svgSvgPieSlice')][@fill='#a86f41']"));

 **//TOOLTIP OVER PIE CHART**

 WebElement ToolTip = driver.findElement(By.xpath("//div[contains(@id,'_tooltip')]"));

 **//CLICK EACH SECTION OF PIE CHART AND GET THE TEXT OVER IT**

 ViolettePart.click();
 System.out.println("Violette Part:"+ToolTip.getText());
 GreyPart.click();
 System.out.println("Grey Part:"+ToolTip.getText());
 LightViolettePart.click();
 System.out.println("Light Violete Part:"+ToolTip.getText());
 GreenPart.click();
 System.out.println("Green Part:"+ToolTip.getText());
 BrownPart.click();
 System.out.println("Brown Part:"+ToolTip.getText());
 } }

【讨论】：

【解决方案3】：

除非您可以仅验证有关图表的元数据（标题、一些 JSON 属性等），否则您将不得不使用图像比较。您定义一个基线图像来表示结果应该是什么样的，并且您的测试将与参考进行比较。

由于可靠地测试图像并非易事，因此您可以使用 Ocular 之类的库。

【讨论】：

【解决方案4】：

如果它是条形图，那么您可以使用“findElements”识别所有条形图和标签，然后您可以在标签之间进行迭代，如果文本与您给出的输入匹配，则获取标签文本，然后使用 Actions 类在该栏上移动，然后您可以验证工具提示上的数据。

要从图中获取任何 xpath，您可以使用 xpath 中的 * 代替标记名，例如

//*[@class='ABC']

您可以按照相同的过程制作饼图，但需要进行一些修改

【讨论】：