php-webdriverでSOY CMSの記事作成画面のテストコードを作成する時に苦戦した。
php-webdriverでconfirmダイアログをクリックする
どこで苦戦したか？というと、
記事作成画面の本文に値を入力するところで、
SOY CMSの記事作成画面ではTinyMCEというWYSIWYGエディタを利用していて、
SOY CMSの記事投稿画面でYouTubeの動画の挿入ボタンを追加しました
TinyMCE | The Most Advanced WYSIWYG HTML Editor
TinyMCEの表示箇所は一見すると<textarea>で表示されていると思いきや、
<textare>の上の箇所に
<iframe id="entry_content_ifr" allowtransparency="true" title="" style="width: 100%; height: 300px; display: block;" frameborder="0"></iframe>
こんな感じのiframeタグが挿入される。
つまるところ、
記事本文に対してphp-webdriverで値を挿入したければ、
一度、iframeを指定してから値を挿入して、iframeから戻るという操作を行わなければならない。
これを踏まえた上で、公式のマニュアルを頼りながら下記のコードを書いてみた。
//TinyMCEのiframeを取得して値を挿入する
$element = $driver->switchTo()->frame(WebDriverBy::id("entry_content_ifr"))->switchTo()->activeElement();
$element->clear();
$element->sendKeys("hoge");
//TinyMCEのiframeから離れる
$driver->switchTo()->defaultContent();
このコードで挿入できた。
※事前に$driverは取得していることとする。
php-webdriverで指定のフォームに値を入力してみる
最後のiframeから離れる処理は、
この処理がないと、記事作成画面の作成ボタンや更新ボタンが押せなくなるため、
必ずiframeから親のフレームに戻っておく。
次に苦戦したのが、TinyMCEに入力した値を取り出すところで、
こちらも公式を頼りに下記のコードを書いてみた。
$element = $driver->switchTo()->frame(WebDriverBy::id("entry_content_ifr"))->switchTo()->activeElement();
$val = $elenemt>getText();
/** 何らかの処理を書く **/
//TinyMCEのiframeから離れる
$driver->switchTo()->defaultContent();
こちらも上記のコードで上手くいった。
