使用 Class="Group0-Item1" Class="Group0-Item2" Class="Group1-Item1" 等属性值验证 HTML 元素的顺序答案

【问题标题】：Verify Order Of HTML Elements With Attribute Values Such as Class="Group0-Item1" Class="Group0-Item2" Class="Group1-Item1"使用 Class="Group0-Item1" Class="Group0-Item2" Class="Group1-Item1" 等属性值验证 HTML 元素的顺序
【发布时间】：2020-05-30 13:42:29
【问题描述】：

在我的 Selenium/C#/NUNIT 项目中，我需要找到一种方法来验证一组 HTML 元素（以及这些组中包含的元素）的顺序（页面 HTML 的自上而下的层次结构）。这些是在我的页面 HTML 中显示的元素...

<div class="gapBanner-banner-order1-group0"></div>
<div class="gapBanner-banner-order1-group1"></div>
<div class="gapBanner-banner-order1-group2"></div>
<div class="gapBanner-banner-order2-group2"></div>

我要执行的验证应该能够捕获以下错误：

错误 1：这些组在页面的 HTML 中不按顺序排列。 group1 中的一个元素首先出现在 HTML 中 group0 之前...

<div class="gapBanner-banner-order1-group1"></div>
<div class="gapBanner-banner-order1-group0"></div>
<div class="gapBanner-banner-order1-group2"></div>
<div class="gapBanner-banner-order2-group2"></div>

错误 #2：每个组内的元素在页面的 HTML 中不按顺序排列。 Group2-Order2 在 HTML 中出现在 Group2-Order1 之前

<div class="gapBanner-banner-order1-group0"></div>
<div class="gapBanner-banner-order1-group1"></div>
<div class="gapBanner-banner-order2-group2"></div>
<div class="gapBanner-banner-order1-group2"></div>

下面是我目前为止写的代码，但肯定是不行的，更不用说，很乱。我不知道我需要什么样的逻辑

            /// 5. Verify the correct order of elements in which they appear inside the HTML
            List<IWebElement> CustomPageHTMLComponents = Browser.
            FindElements(By.XPath("//div[contains(@class, 'group')")).ToList();            
            List<IWebElement> uniqueGroups = new List<IWebElement>();
            // Get the unique groups
        for (int i = 0; i < CustomPageHTMLComponents.Count; i++)
        {
            IWebElement currentComponent = Browser.FindElements(By.XPath("//div[contains(@class, 'group')"))[i];
            string toBeSearched = "group";
            string currentComponenetClassAttributeValue = currentComponent.GetAttribute("class");
            int x = currentComponenetClassAttributeValue.IndexOf(toBeSearched);
            string groupNumber = currentComponenetClassAttributeValue.Substring(x + toBeSearched.Length);

            if (groupNumber == i.ToString())
            {
                uniqueGroups.Add(currentComponent);
            }
        }

             // Some kind of logic to verify everything???
        for (int i = 0; i < Page.CustomPageHTMLComponents.Count; i++)
        {
            IWebElement currentComponent = Browser.FindElements(By.XPath("//div[contains(@class, 'group')"))[i];

            string toBeSearched = "group";
            string currentComponenetClassAttributeValue = currentComponent.GetAttribute("class");
            int x = currentComponenetClassAttributeValue.IndexOf(toBeSearched);
            string groupNumber = currentComponenetClassAttributeValue.Substring(x + toBeSearched.Length);

            Assert.AreEqual(groupNumber, i.ToString());
        }

【问题讨论】：

标签： c# visual-studio selenium nunit

【解决方案1】：

可能有很多方法可以做到这一点。这是我想出的第一个方法...

从所需元素中获取所有类名并将它们存储在字符串数组#1中
复制字符串数组 #1 并对其进行排序
比较两个数组，如果相等，则排序开始

我已经检查了您提供的 HTML 以找到您想要捕获的错误，它可以捕获所有错误。我能想到的一个问题是，如果你得到超过 9 个 orders 或 groups 排序将不是你想要的，因为它是 alpha 顺序而不是数字顺序，例如1, 10, 2, ... 而不是 1, 2, ... 10。

// capture the class names from the desired classes
string[] elements = _driver.FindElements(By.CssSelector("div[class^='gapBanner-banner-']")).Select(e => e.GetAttribute("class")).ToArray();
// make a copy of the array
string[] sortedElements = new string[elements.Length];
elements.CopyTo(sortedElements, 0);
// sort the copy
Array.Sort(sortedElements);
// compare the arrays for order using NUnit CollectionAssert
CollectionAssert.AreEqual(elements, sortedElements, "Verify ordering of elements");

【讨论】：