JQuery Javascript 函数以 JSON 格式返回 highchart 图形数据源，并通过 Selenium 和 C# 正确格式化

Posted 2023-05-09

【中文标题】JQuery Javascript 函数以 JSON 格式返回 highchart 图形数据源，并通过 Selenium 和 C# 正确格式化

【英文标题】：JQuery Javascript function to return highchart graph data source in JSON and formatted correctly through Selenium and C#

【发布时间】：2018-01-12 14:00:27

【问题描述】：

我正在尝试弄清楚如何使用 Selenium 和 C# 获取与返回给我的 highchart 图的 JSON 等价物。我已经走了很远，但我遇到了几个问题。对于具体的highchart，执行以下步骤：

去这里https://rcpsc.releasecandidate-community360qa.net/login.aspx?action=enablelogin 登录：uw_lr1/test 登录后，图表将显示在下一页。图表元素的 ID 是“EPAChart”

问题 #1

我可以在 DEV 工具的控制台选项卡中使用以下功能来检索 JSON 格式的数据，但它没有正确组织它（它首先列出所有 EPA，然后列出所有这些 EPA 的值）JSON.stringify(angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData']);

当我使用 C# 和 Selenium 将其插入 Visual Studio，然后尝试将其转换为 DataTable 时，它​​不允许我这样做，因为数据组织不正确。对于类似的问题，请参阅：Newtonsoft.Json JsonConvert To Datatable

using Newtonsoft.Json;
using OpenQA.Selenium;
string jsText = string.Format("return JSON.stringify(angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData']);")
var jsResult = driver.ExecuteScript(jsText) as string;
JsonConvert.DeserializeObject<DataTable>(jsResult);

问题 #2

我有一个 javascript/Jquery 函数，它可以正确组织生成 JSON，但我不知道如何使用 Selenium/C# 调用它。代码 driver.ExecuteScript 不喜欢这个函数，我猜是因为太复杂而且使用了变量，所以 driver.ExecuteScript (IJavaScriptExecutor->ExecuteScript) 会抛出异常。这是函数：

var epadatasource = []; for(var i=0;i<angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData'].Categories.length;i++)epadatasource.push(category: angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData'].Categories[i], data: angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData'].Data[i]); ; JSON.stringify(epadatasource);

对于问题 #2，我如何在 C#/Selenium 中调用上述函数，以便它不会引发异常，而是返回我的 JSON？或者对于问题 #1，是否有正确组织 JSON 的解决方法？

【问题讨论】：

这是两个独立的问题。您应该在此处拆分问题 #2 并将其放入一个新问题中，以避免与答案混淆，并在有人知道一个但不知道另一个的情况下更容易回答。

对于问题 #2，将整个内容放在 string 中，就像在问题 #1 代码中所做的那样，并在最后一个命令之前添加 return，例如return JSON.stringify(...) 它应该可以工作。它在控制台中工作，但在代码中，你必须返回一些东西。

谢谢。我添加了答案

【参考方案1】：

我找到了问题 #1 的解决方法，@jeffC 提供了问题 #2 的解决方案

问题1的解决方法是将JSON添加到C#对象中，然后将其转换为新对象，并将其反序列化为固定的JSON：

  public static string TransformJSON(string json, IWebElement chartElem)
    
        string fixedJson = "";

        if (chartElem.GetAttribute("id") == "EPAChart")
        
            dynamic obj = JsonConvert.DeserializeObject<EPAObservationCountOriginal>(json);
            List<EPAObservationCountFixed> fixedObject = new List<EPAObservationCountFixed>();
            for (int i = 0; i < obj.Categories.Length; i++)
            
                fixedObject.Add(new EPAObservationCountFixed()  category = obj.Categories[i], data = obj.Data[i] );
            

            fixedJson = JsonConvert.SerializeObject(fixedObject);
        

        return fixedJson;
    

    #endregion methods

    #region Class objects representing graphs

    public class EPAObservationCountFixed
    
        public string category  get; set; 
        public string data  get; set; 
    

    public class EPAObservationCountOriginal
    
        public string[] Categories  get; set; 
        public string[] Data  get; set; 
    

问题2解决方法是在函数中添加“return”二字：

var epadatasource = []; for(var i=0;i<angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData'].Categories.length;i++)epadatasource.push(category: angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData'].Categories[i], data: angular.element($('#EPAChart')).scope().$parent.vm['epaGraphData'].Data[i]); ; return JSON.stringify(epadatasource);