SeleniumBasic_スクレイピング_カレンダーとセレクトボックスの要素選択

Question

前提

VBAとteratail初心者です。HTML,CSS,Javascript,PHPは簡単なWebサイトを作成出来る程度の理解です。

VBAでseleniumを使用して（SeleniumBasicをインストール）スクレイピング機能を作成しています。
ブラウザを立ち上げ、クリックから子画面を表示するところまでは作成出来たのですが、
子画面にある手入力可能なカレンダーのテキスト入力部分に値を設定することが出来ません。
また、同子画面のセレクトボックスの選択が出来なくて困っています。
要素にid,nameが無いためclassを使用したところclass名がNot Foundでエラーが出ています。
XPathで指定しても同じような状況です。HTMLが私の理解が及ばないコーディングのため、
指定してる要素が合っているかも少々怪しいです。
セレクトボックスの部分は開発ツールで青くなる実際の場所と別にoptionが存在するようで
Ulで作成されているようです。⇦申し訳ありません。このあたりの理解も足りていません。

実現したいこと

・手入力可能なカレンダーのテキストエリアに値を設定。
・セレクトボックスの選択。

発生している問題・エラーメッセージ

NoSuchElementError
Element not found for Class =…

該当のソースコード

※IDとパスワードによるログインが必要な画面のため該当すると思われるコードのみ記載します。

カレンダーのテキストエリア
<div class="ant-form-item-control">
<span class="ant-form-item-children">
<span data-v-7e954258="" class="">
<span class="ant-calendar-picker ant-calendar-picker-small">
<div class="">
<input readonly="true" placeholder="" class="ant-calendar-picker-input ant-input ant-input-sm">
<i aria-label="icon: calendar" class="anticon anticon-calendar ant-calendar-picker-icon">
<svg viewBox="64 64 896 896" data-icon="calendar" width="1em" height="1em" fill="currentColor" aria-hidden="true" focusable="false" class="">
…

セレクトボックス
<span class="ant-form-item-children">
<span data-v-7e954258="" class="">
<div tabindex="0" class="select ant-select ant-select-enabled ant-select-allow-clear ant-select-sm" style="width: 200px;">
<div role="combobox" aria-autocomplete="list" aria-haspopup="true" aria-controls="e1134ff0-a717-4127-a5d4-a3306abedcc7" class="ant-select-selection ant-select-selection--single">
<div class="ant-select-selection__rendered">
<div title="４年間" class="ant-select-selection-selected-value" style="display: block; opacity: 1;">４年間</div>
</div>
…

上記セレクトのOption部分　セレクトボックスのコードと別の場所に記載有
<ul role="listbox" tabindex="0" class="ant-select-dropdown-menu ant-select-dropdown-menu-vertical ant-select-dropdown-menu-root"><li role="option" class="ant-select-dropdown-menu-item" unselectable="on" style="user-select: none;">
    １年間
  </li><li role="option" class="ant-select-dropdown-menu-item" unselectable="on" style="user-select: none;">
    ２年間
  </li><li role="option" class="ant-select-dropdown-menu-item" unselectable="on" style="user-select: none;">
    ３年間
  </li><li role="option" class="ant-select-dropdown-menu-item ant-select-dropdown-menu-item-selected" unselectable="on" style="user-select: none;" aria-selected="true">
    ４年間
  </li><li role="option" class="ant-select-dropdown-menu-item" unselectable="on" style="user-select: none;">
    ５年間
  </li>
</ul>

試したこと

カレンダーのテキストエリア選択は
Driver.FindElementByCss("i.anticon.anticon-calendar.ant-calendar-picker-icon").Click
で動作しました。テキストエリアにフォーカスが移動し、カレンダーが展開されます。
選択は可能ですが、値を設定する方法が理解出来ませんでした。

セレクトボックスに至ってはelement not foundになるためどの要素を選択するのが正しいのか。から
理解出来ていません。

初めての投稿のため必要な内容が不足していたら申し訳ございません。
ご教授いただけると幸いです。

補足情報（FW/ツールのバージョンなど）

使用ブラウザchrome

Comments

[bebebe_]

セレクトボックスが見つからないのは別のフレームの可能性はないですか？

[nonsan]

コメントありがとうございます。iframeは見当たりませんでした。
セレクト部分は質問から少し進展があり、現在KeyboardEventを使用し、KeyDown→Enterで無理やり選択しています。
Driver.ExecuteScript "var el=document.querySelector("".select.ant-select.ant-select-enabled.ant-select-allow-clear.ant-select-sm"");" & "let KEvent = new KeyboardEvent(""keydown"", { keyCode: 13 });" & "el.dispatchEvent(KEvent);"
で直接的に操作し選択をしておりますが、
Driver.ExecuteScript ("var el=document.querySelector("".select.ant-select.ant-select-enabled.ant-select-allow-clear.ant-select-sm"");" & "el.options[0].selected=true;")
では選択出来ない認識になりますでしょうか。
ご存じでしたらご教授いただけると幸いです。

Answer 1

かなり力技で解決しました。
・手入力可能なカレンダーのテキストエリアに値を設定。
'カレンダー選択
Driver.ExecuteScript "var el=document.querySelector(""i.anticon.anticon-calendar.ant-calendar-picker-icon"");" & "el.click();"
'カレンダー情報入力
Driver.FindElementByClass("ant-calendar-input").SendKeys ("2022/11/17")
'Enter押下で確定※もっと自然に動作させたいが…
Driver.FindElementByClass("ant-calendar-input").SendKeys ks.Enter

・セレクトボックスの選択。
'セレクトボックスクリック
Driver.ExecuteScript "var el=document.querySelector("".select.ant-select.ant-select-enabled.ant-select-allow-clear.ant-select-sm"");" & "el.click();"
'矢印KEYの下でリストから選択
Driver.ExecuteScript "var el=document.querySelector("".select.ant-select.ant-select-enabled.ant-select-allow-clear.ant-select-sm"");" & "let KEvent = new KeyboardEvent(""keydown"", { keyCode: 40 });" & "el.dispatchEvent(KEvent);"
'EnterKeyで確定
Driver.ExecuteScript "var el=document.querySelector("".select.ant-select.ant-select-enabled.ant-select-allow-clear.ant-select-sm"");" & "let KEvent = new KeyboardEvent(""keydown"", { keyCode: 13 });" & "el.dispatchEvent(KEvent);"

理想のコードにたどり着けず時間も無かったためとりあえず無理やり動かしているコードですが、最低限の動作はクリア出来たので一応記録を残しておきます。