硒挑战下拉列表

时间:2019-01-22 12:09:16

标签: c# selenium selenium-webdriver webdriver selenium-chromedriver

我正在用Selenium / C#编写自动化框架。目前,我在下拉列表和轻松处理这些下拉菜单方面面临问题。

我创建了使用枚举类和Iwebelement的方法'CheckCategoryType':

    public void CheckCategoryType(CategoryType categoryType, string categoryTypeText)
    {
        CategoryTypeField.Click();
        driver.WaitForElementVisibleAndClickable(By.XPath(string.Format(categoryTypeOptions, categoryType.ToDescriptionString())));
        var categoryTypeOption = driver.WaitForElementVisibleAndClickable(By.XPath(string.Format(categoryTypeOptions, categoryType.ToDescriptionString())));
        Assert.IsTrue(categoryTypeOption.GetAttribute("data-value").Contains(categoryType.ToDescriptionString()), $"Category type list is missing: '{categoryType}' option");
        Assert.AreEqual(categoryTypeText, categoryTypeOption.Text, "Text is not correctly shown");
        Thread.Sleep(1500);
        CategoryTypeField.Click();
    }

如果要与下拉菜单进行交互,我将使用相同的方法,但具有“点击”功能:

    public void CategoryTypeClick(CategoryType categoryType)
    {
        CategoryTypeField.Click();
        driver.WaitForElementVisibleAndClickable(By.XPath(string.Format(categoryTypeOptions, categoryType.ToDescriptionString()))).Click();
    }
<div id="category-type-row-0" class="form-row" css="1">
    <div class="MuiFormControl-root-263 outlined-select ">
        <label class="MuiFormLabel-root-274 MuiFormLabel-filled-278 MuiInputLabel-root-267 MuiInputLabel-formControl-268 MuiInputLabel-animated-271 MuiInputLabel-shrink-270 solteq-label" data-shrink="true" for="categories[0].type">Category Type</label>
        <div class="MuiInputBase-root-294 MuiOutlinedInput-root-281 MuiInputBase-disabled-297 MuiOutlinedInput-disabled-283 MuiInputBase-formControl-295 solteq-input " wraperclassname="outlined-select" label="Category Type" helpertext="">
            <fieldset aria-hidden="true" class="MuiNotchedOutline-root-311 MuiNotchedOutline-disabled-315 MuiOutlinedInput-notchedOutline-288" style="padding-left: 8px;">
                <legend class="MuiNotchedOutline-legend-312" style="width: 15.5px;"></legend>
            </fieldset>
            <div class="MuiSelect-root-340">
                <div class="MuiSelect-select-341 MuiSelect-selectMenu-344 MuiSelect-disabled-345 MuiInputBase-input-304 MuiOutlinedInput-input-289 MuiInputBase-disabled-297 MuiOutlinedInput-disabled-283" aria-pressed="false" role="button" aria-haspopup="true">Product group</div>
                <input name="categories[0].type" type="hidden" id="categories[0].type" value="group">
                <svg class="MuiSvgIcon-root-58 MuiSelect-icon-346" focusable="false" viewBox="0 0 24 24" aria-hidden="true" role="presentation">
                    <path d="M7 10l5 5 5-5z"></path>
                </svg>
            </div>
        </div>
    </div>
</div>

但是,当我们单击特定的下拉列表(例如“类别类型”)时,我们会收到不同的DOM列表:

<ul class="MuiList-root-389 MuiList-padding-390" role="listbox" css="1">
    <li class="MuiButtonBase-root-55 MuiListItem-root-120 MuiListItem-default-123 MuiListItem-gutters-127 MuiListItem-button-128 MuiMenuItem-root-118" tabindex="0" role="option" data-value="1">UPS<span class="MuiTouchRipple-root-333"></span></li>
    <li class="MuiButtonBase-root-55 MuiListItem-root-120 MuiListItem-default-123 MuiListItem-gutters-127 MuiListItem-button-128 MuiMenuItem-root-118" tabindex="-1" role="option" data-value="2">TNT<span class="MuiTouchRipple-root-333"></span></li>
    <li class="MuiButtonBase-root-55 MuiListItem-root-120 MuiListItem-default-123 MuiListItem-gutters-127 MuiListItem-button-128 MuiMenuItem-root-118" tabindex="-1" role="option" data-value="3">FEDEX<span class="MuiTouchRipple-root-333"></span></li>
    <li class="MuiButtonBase-root-55 MuiListItem-root-120 MuiListItem-default-123 MuiListItem-gutters-127 MuiListItem-button-128 MuiMenuItem-root-118" tabindex="-1" role="option" data-value="4">SKYNET<span class="MuiTouchRipple-root-333"></span></li>
    <li class="MuiButtonBase-root-55 MuiListItem-root-120 MuiListItem-default-123 MuiListItem-gutters-127 MuiListItem-button-128 MuiMenuItem-root-118" tabindex="-1" role="option" data-value="5">SCHENKER<span class="MuiTouchRipple-root-333"></span></li>
</ul>

只是屏幕上显示了它的外观:https://imgur.com/a/J3MZW6F

我的定位器:

    private static string categoryTypeFields = "//div[contains(@id,'category-type-row-'{0}'')]/div";
        private static string categoryTypeOptions = "//li[contains(@data-value,'{0}')]";
        private static readonly By categoryTypeOptionsListLocator = By.CssSelector("ul");
        private static readonly By categoryTypeOptionLocator = By.XPath("//li[@role ='option']");
        private static readonly By categoryFieldLocator = By.CssSelector("#category-row-0 > div");

我想创建可重复使用的解决方案。我的所有输入组件在整个系统上看起来都是相同的,目前我被迫为每个下拉列表(检查/单击)创建数十种方法。哪一个: a)看起来很糟糕 b)糟糕

我想知道是否可以以更成熟的方式完成?我想到了Selenium中的“选择”功能,但是我的DOM代码看起来很糟糕,我不确定它是否可以与“选择”类一起使用。你能给我任何建议吗?

0 个答案:

没有答案