在c#中使用selenium选择选项项

本文关键字:选择 选项 selenium | 更新日期: 2023-09-27 18:04:06

我今天刚刚开始使用selenium编写一些UI测试。使用起来似乎很简单,而且取得了一些不错的进展。

我有一个使用最新测试版的kendoui的页面。他们有一个多选控件,我正在测试。

控件的输出html看起来像

<div class="k-widget k-multiselect k-header" style="">
  <div class="k-multiselect-wrap floatWrap">
    <ul role="listbox" unselectable="on" class="k-reset" id="StoreIds_taglist"></ul>
    <input class="k-input k-readonly" style="width: 119px;" accesskey="" role="listbox" aria-expanded="false" tabindex="0" aria-owns="StoreIds_taglist StoreIds_listbox" aria-disabled="false" aria-busy="false"><span class="k-loading" style="display: none;"></span></div>
    <select data-val="true" data-val-required="Please select at least 1 store" id="StoreIds" multiple="multiple" name="StoreIds" data-role="multiselect" style="display: none;" aria-disabled="false">
      <option value="d0f36ef4-28be-4d16-a2e8-37030004174a">stoe jo blogs</option>
      <option value="0f0afaec-797a-4b70-8599-ffb4176d7933">Store 3</option>
      <option value="11774315-a0e0-4686-8c70-b882a8f75ab4">store 5</option>
      <option value="28f32bc1-17de-4c73-8bed-b0abd7f5bd81">store 6</option>
      <option value="daf9927c-26a2-4395-ba6d-800d5af85ca7">store4</option>
      <option value="86bd876f-3312-4d1f-96ce-640e0dbf46df">z</option>
      <option value="7da8dfe0-f395-4dc3-9aed-1ce44ac280c0">zxzxc</option>
  </select>
  <span style="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-size: 14px; font-style: normal; font-weight: normal; letter-spacing: normal; text-transform: none; line-height: 18.328125px; position: absolute; visibility: hidden;">Select stores...    
  </span>
</div>

我正在尝试写一个selenium测试从选择列表中选择一个索引。

目前我有

   IWebElement sTag = driver.FindElement(By.Id("StoreIds"));
   SelectElement selectTag = new SelectElement(sTag);
   var availableOptions = selectTag.Options;

availbleOptions有7个条目,但是文本总是空的。基本上我正在尝试从列表中选择一个项目。

I try without luck

  foreach (IWebElement item in availableOptions)
        {
            item.Click();
            Console.WriteLine(item.Text);
        }

我得到一个错误

不能点击选项元素。(UnexpectedJavaScriptError)

我需要做什么来启用选择项目?

完整的测试示例

 [Test]
    public void TestMultiSelect()
    {
        driver.Navigate().GoToUrl("C:/temp/HTMLPage1.html");
        WebDriverWait wait = new WebDriverWait(driver, TimeSpan.FromSeconds(5));
        wait.Until((d) => { return d.Title.StartsWith("Test"); });
        var stores = driver.FindElement(By.Id("required"));
        IWebElement sTag = driver.FindElement(By.Id("required"));
        SelectElement selectTag = new SelectElement(sTag);
        var availableOptions = selectTag.Options;
        foreach (IWebElement item in availableOptions)
        {
            item.Click();
            Console.WriteLine(item.Text);
        }
    }
Html页面

<!DOCTYPE html>
<html lang="en" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta charset="utf-8" />
<title>Test</title>
 <link href="https://da7xgjtj801h2.cloudfront.net/2013.1.226/styles/kendo.common.min.css" rel="stylesheet" type="text/css" />
<link href="https://da7xgjtj801h2.cloudfront.net/2013.1.226/styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
     <script src="https://da7xgjtj801h2.cloudfront.net/2013.1.226/js/kendo.web.min.js"></script>
<script src="https://da7xgjtj801h2.cloudfront.net/2013.1.226/js/kendo.aspnetmvc.min.js"></script>
    </head>
    <body>
    <div id="example" class="k-content" role="application">
    <div class="demo-section">
    <h2>Invite Attendees</h2>
    <label for="required">Required</label>
    <select id="required" multiple="multiple" data-placeholder="Select attendees...">
        <option>Steven White</option>
        <option>Nancy King</option>
        <option>Anne King</option>
        <option>Nancy Davolio</option>
        <option>Robert Davolio</option>
        <option>Michael Leverling</option>
        <option>Andrew Callahan</option>
        <option>Michael Suyama</option>
        <option>Anne King</option>
        <option>Laura Peacock</option>
        <option>Robert Fuller</option>
        <option>Janet White</option>
        <option>Nancy Leverling</option>
        <option>Robert Buchanan</option>
        <option>Margaret Buchanan</option>
        <option>Andrew Fuller</option>
        <option>Anne Davolio</option>
        <option>Andrew Suyama</option>
        <option>Nige Buchanan</option>
        <option>Laura Fuller</option>
    </select>
</div>
<style scoped>
    .demo-section {
        width: 350px;
        height: 200px;
        padding: 30px;
    }
    .demo-section h2 {
        font-weight: normal;
    }
    .demo-section label {
        display: inline-block;
        margin: 15px 0 5px 0;
    }
    .demo-section select {
        width: 350px;
    }
    #get {
        float: right;
        margin: 25px auto 0;
    }
</style>
<script>
    $(document).ready(function () {
        // create MultiSelect from select HTML element
        $("#required").kendoMultiSelect();
              });
</script>

在c#中使用selenium选择选项项

你应该使用IJavaScriptExecutor来解决这个问题

//js.ExecuteScript(String.Format("$('#{0}').data('kendoMultiSelect').value({1});", "tagname", Value))