F#ライブラリcanopyによるUIテスト

3973 ワード

SeleniumはポピュラーなUIテストライブラリですが、それに基づいて作成されたテストは脆弱で信頼性が低いなどの一般的な問題があります.InfoQは、Seleniumに基づいて作成されたcanopyというF#ライブラリをより深く理解するために、canopyの著者Chris Holtとインタビューした.
InfoQ:canopyを紹介していただけませんか.
Chris Holt:canopyはSeleniumに基づいてF#で実現された機能で、UIテストの動作を利用者の予想に合致させることを目標としています.Seleniumは優れた演技をしているが、時にはあまりにも堅苦しいように見えることがある.canopyでは、すべての動作がエレメントをクリックできないためにすぐにエラーを報告するのではなく、適切な時間が経過してもクリックできないまでエレメントをクリックし続けてエラーを報告します.これにより、最初の試みでのみ成功するテストではなく、より信頼性の高いテストを作成できます.
InfoQ:canopyはどのようにSeleniumを通じてUIテストを行う過程を簡略化しますか?
CH:canopyには、要素の取得や画面上でのユーザーの動作、検証機能など、再試行機能が内蔵されています.さらに、canopyは、セレクタのスペルミスなど、実用的なエラー情報を使用して、ユーザーが一般的な問題を修正するのに役立ちます.また、さまざまな方法で要素を選択することもサポートされ、これらの機能の拡張が容易です.
たとえば、ユーザの画面に「Save」の文字を表示するボタンがある場合、クリックの目的は、コードにclick「Save」と書くだけで実現できます.一方、従来のSeleniumコードでは、ByText、ById、ByCSS、ByXPathなどの方法でユーザが選択しなければならない.この機能を拡張するには、フォームデータのplaceholder値や、メタデータを表すために人為的に定義されたdata-*ラベルなど、ユーザーのWebページの慣用的な方法に対応するfinder実装を追加するだけです.
canopyはまた、ユーザーがテストを読みやすく作成できるように、簡明なAPIを提供しています.htmlのさまざまな違いを克服することもできます.たとえば,入力タイプごとにhtmlで異なる表現があるため,元のSeleniumで操作する方法も異なる.canopyでは、操作方法は同じです.例として、
// Assign a value to a textbox or dropdown
"#state" << "New York"

InfoQ:canopyは、Browserstackなどの外部自動化サービスとの統合をサポートしていますか.
CH:はい、Seleniumがサポートする機能であれば、canopyも同様にサポートします.Browserstackをサポートするには、RemoteWebdriverを使用する必要があります.canopy自体には大量の再試行機能が内蔵されているため、インタラクションの回数が増加します.しかし、ユーザはSleepを頻繁に呼び出す必要がないので、このような増加したインタラクションは許容できる.canopyはまた、canopyにセレクタタイプを分析させるのではなく、セレクタのタイプを具体的に記述する場合に、これらの最適化を適用するオプションの最適化方法を多数提供しています.
InfoQ:ページで要素を選択するのにおすすめの方法はありますか?たとえば、id選択要素を使用すると、テストによりメンテナンス性と堅牢性が向上しますか?
CH:UI自動化で使用される多くの「テクニック」は、選択要素に関連しています.きれいなセレクタを使用するべきか、ラベルにclassやidなどのプロパティを追加する必要があるかは、バランスポイントを見つける必要があります.CSSとJQueryセレクタの文法は最も優れており、ユーザーは80-90%のシーンでこの方式を使用することができると思います.残りの10~20%のシーンではXPathを使用できます.正確なテキスト照合や、エレメントの親エレメントを見つけた場合にXPathを使用します.値や内部文字で検索するのも便利ですが、上記のclick「Save」の例では、内部実装にXPathが使用されます.
しばらくの実践を経て、ユーザーはセレクタを作成する方法を熟練することができ、あるツールでセレクタを生成するのではなく、実践を通じて学習することをお勧めします.この方法はより正確であり、ページ構造が変化してユーザのテストに影響を及ぼす場合、修正も容易である.ユーザがセレクタについて一定の心得を持つと、htmlコードをメンテナンスしやすくする方法がわかり、セレクタの作成が簡素化されます.
セレクタの作成は、ヘッダなど、いくつかの方法で理解しやすい.linksというセレクタは、ページのheaderというdiv内のすべてのlinks要素を表します.自動生成XPathではhtml/body/div/div/div[2]/ul/li/aという形になるかもしれませんが、その意味を理解するのに役立ちません.また、この選択チェーンにdivを追加または削除すると、セレクタが動作しなくなります.CSS方式で作成されたセレクタ「永遠」は、headerというidを変更したり、linksというclassを削除/変更したりしない限り有効です.
InfoQ:ユーザーはエラーレポートをカスタマイズできますか?例えば、テストに失敗したときに自動的にスクリーンを切ることができますか?
CH:canopyには、ConsoleReporter、TeamCityReporter、HtmlReporterの3つのReporterが内蔵されています.ユーザがカスタム機能を追加する必要がある場合は,Ireporterというインタフェースを簡単に実現すればよい.
InfoQ:canopyの機能を拡張する方法は何ですか?
1)Ireporterインタフェースを実装することで,テスト結果の出力をカスタマイズする.
2)canopyで使用されるfinderセットに新しい汎用finderインプリメンテーションを追加し、ユーザーがページ要素を見つけるのを助ける.
3)ユーザがよく使うactionに新しい関数を追加する.F#は、関数の最新定義のバージョンを実行するため、ユーザーは既存の関数を「書き換える」ことで、自分のニーズを満たすことができます.
たとえば、ユーザーはカスタムの「click」機能を実装できます.「canopyExtensions」などのモジュールを作成し、「canopyを開く」操作後に「開く」というモジュールで、すべての拡張方法と書き換え方法を定義します.これにより、すべてのテストで、既存の機能を変更することなく、ユーザーによって定義された機能が呼び出されます.
この例は、ある人が複数選択ボックスで要素に対するCtrl+Click操作を実現することを望んでいることを示している.canopy自体がこの特性を備えていないため,著者らは拡張方法を編纂した.
4)canopyは,Seleniumの特性を非表示にしたり,抽象化したりしていない.IWebDriverとIWebElementインタフェースを使用しているだけです.ユーザーがStack overflowのウェブサイトで見た様々な質問と返信はcanopyに対して100%有効である.ユーザーがしなければならない唯一のことは、コードをF#に変換することです.
InfoQ:継続的統合(CI)サーバ上でcanopyテストを実行するにはどのような手順が必要ですか?
CH:テストの実行方法は、構築プロセスによって生成されたコンソールアプリケーションを実行することである.テスト結果は異なる出力フォーマットをサポートします.TeamCityの構成プロセスをサポートするには、1行のコードしか必要ありません.
reporter <- new TeamCityReporter() :> IReporter

個人的には、構築プロセス全体を実現するために簡単なタスクを使用することを選択します.そのため、TeamCityで作成したタスクは、ソースコード制御システムから最新のコードを取得し、コマンドライン文でタスクを開始し、残りの作業を完了するなど、簡単です.
Jenkins環境では、HtmlReporterを選択し、Jenkinsのプラグインを使用してhtmlドキュメントを生成し、タスク全体の結果に保存します.これは、短い数行のコードで設定作業を完了することもできます.
canopyはGitHubに管理されているオープンソースプロジェクトです.読者がより多くの紹介に興味を持っている場合は、Chris Holtが最近fshapConf大会でcanopyについての講演を見ることができます.
原文:UI Testing in F#with canopy