dropdown要素が現在表示されていないため操作できない可能性があります。

Question

ChromeでSeleniumを使用していますが、ドロップダウンから値を選択しました。私はWebページ自体から得ることができ、マークアップ：

<div class="col-sm-8 select-month no-margin-bottom no-padding-left form-group select-container"> 
<select class="selectarea form-control select-month bs-select-hidden" id="month_start" name="month_start" title="Bitte wählen"> 
    <option class="bs-title-option" value="">Bitte wählen</option> 
     <option id="month_start1" value="1">Januar</option> 
     <option id="month_start2" value="2">Februar</option> 
     <option id="month_start3" value="3">März</option> 
     <option id="month_start4" value="4">April</option> 
     <option id="month_start5" value="5">Mai</option> 
     <option id="month_start6" value="6">Juni</option> 
     <option id="month_start7" value="7" selected="selected">Juli</option> 
     <option id="month_start8" value="8">August</option> 
     <option id="month_start9" value="9">September</option> 
     <option id="month_start10" value="10">Oktober</option> 
     <option id="month_start11" value="11">November</option> 
     <option id="month_start12" value="12">Dezember</option> 
</select> 

<div class="btn-group bootstrap-select selectarea form-control select-month open"> 
    <button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="month_start" title="Juli" aria-expanded="true"> 
     <span class="filter-option pull-left">Juli</span>&nbsp; 
      <span class="bs-caret"><span class="caret"></span> 
     </span> 
    </button> 
    <div class="dropdown-menu open" style="max-height: 489.688px; overflow: hidden; min-height: 64px;"> 
     <ul class="dropdown-menu inner" role="menu" style="max-height: 487.688px; overflow-y: auto; min-height: 62px;"> 
      <li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null"> 
       <span class="text">Januar</span> 
       <span class="glyphicon glyphicon-ok check-mark"></span> 
       </a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"> 
       <span class="text">Februar</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">März</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="4"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">April</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="5"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mai</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="6"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Juni</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="7" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Juli</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="8"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">August</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="9"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">September</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="10"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Oktober</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="11"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">November</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="12"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Dezember</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div></div></div> 
        <div class="col-sm-8 select-year do_not_break_visible_hint no-margin-bottom no-padding-left form-group select-container"><select class="selectarea form-control select-year bs-select-hidden" id="year_start" name="year_start" title="Bitte wählen" style=""><option class="bs-title-option" value="">Bitte wählen</option> 
     <option id="year_start2016" value="2016" selected="selected">2016</option><option id="year_start2017" value="2017">2017</option><option id="year_start2018" value="2018">2018</option><option id="year_start2019" value="2019">2019</option><option id="year_start2020" value="2020">2020</option><option id="year_start2021" value="2021">2021</option><option id="year_start2022" value="2022">2022</option><option id="year_start2023" value="2023">2023</option><option id="year_start2024" value="2024">2024</option><option id="year_start2025" value="2025">2025</option><option id="year_start2026" value="2026">2026</option><option id="year_start2027" value="2027">2027</option><option id="year_start2028" value="2028">2028</option><option id="year_start2029" value="2029">2029</option><option id="year_start2030" value="2030">2030</option><option id="year_start2031" value="2031">2031</option><option id="year_start2032" value="2032">2032</option><option id="year_start2033" value="2033">2033</option><option id="year_start2034" value="2034">2034</option><option id="year_start2035" value="2035">2035</option><option id="year_start2036" value="2036">2036</option> 
       </select><div class="btn-group bootstrap-select selectarea form-control select-year"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="year_start" title="2016"><span class="filter-option pull-left">2016</span>&nbsp;<span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open"><ul class="dropdown-menu inner" role="menu"><li data-original-index="1" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2016</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2017</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2018</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="4"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2019</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="5"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2020</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="6"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2021</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="7"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2022</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="8"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2023</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="9"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2024</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="10"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2025</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="11"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2026</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="12"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2027</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="13"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2028</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="14"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2029</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="15"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2030</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="16"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2031</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="17"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2032</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="18"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2033</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="19"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2034</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="20"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2035</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="21"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2036</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div></div></div> 
       <div class="clearfix"></div> 
    </div> 
    </div> 

は私が値を選択するためにこのコードを使用しています：

new SelectElement(chromeDriver.FindElement(By.Id("month_start"))).SelectByText("Dezember"); 

をしかし、それはどのリード次

Element is not currently visible and may not be manipulated

を語ります私はHTMLマークアップの最初の部分（option class=bs-title-option）が正しいものではないという結論に達しました。とにかく、これをどう扱うか？

Answer 1

アプリケーションの実際のドロップダウンは、ブートストラップライブラリによって生成されます。ボタンをクリックし、リスト内のドロップダウンメニューから項目を選択する必要があります。以下の例を参照してください：

var wait = new WebDriverWait(driver, TimeSpan.FromSeconds(10)); 
wait.Until(d => !d.FindElement(By.Id("busy")).Displayed); 

// Click first month 
driver.FindElement(By.CssSelector(".bootstrap-select.select-month > button")).Click(); 
System.Threading.Thread.Sleep(1000); 
string targetMonth = "Februar"; 
driver.FindElement(By.XPath("//span[contains(text(),'" + targetMonth + "')]/..").Click(); 

// Click project type 
System.Threading.Thread.Sleep(1000); 
driver.FindElement(By.CssSelector("button[data-id='projecttype']")).Click(); 
System.Threading.Thread.Sleep(1000); 
string targetType = "In-house project"; 
driver.FindElement(By.XPath("//span[contains(.,'" + targetType + "')]/..").Click();