👨🏼‍🚀 👨‍🚒 🦉 Selenideでの効果的なUIテスト 👩🏽‍🎤 🏂🏿 👩🏼‍🎤

奇跡を待っています

大New日は奇跡の時代です。新しい年の前夜、私たちは皆、過ぎ去る年を覚えており、次の年の計画を立てます。そして、すべての問題が過去に残り、新しい年に奇跡が起こり、新しい方法で生きることを願っています。

Java開発者が彼を覆い隠し、世界で最もクールなJavaプログラマーになることを可能にする奇跡を夢見ていないもの。

良いニュース：私はそのような奇跡についてだけ伝えたいです。

彼の名前は自動テストです！

ええと、テスト？

はいマイクロ/ピコ/ナノサービスではなく、規律によって、奇跡のフレームワークによってクラフトの真のマスターになることはできません。プログラマーは、コードの準備ができたときではなく、自動テストが記述されて実行されたときに、ケースが完了したと見なすことができるという規律。単体テストですべてが多かれ少なかれ明確である場合、UIテストは依然として開発者にとって暗い森です。

まあ、それは退屈ですか？

ああ、信じて！ 有能な自動テストを書くことは良い挑戦であり、あなたの脳をひっくり返す何かがあります。そして、それはとても楽しくて面白いものになります。適切なツールを使用するだけです。

UIテストを作成するための適切なツールは次のとおりです。

セレン化物

Selenideは、簡潔で安定したオープンソースUIテストを作成するためのライブラリです。

セレン化物は、学習曲線が非常に低いため、開発者にとって理想的な選択です。自動化テスターが通常多くの時間を費やしているこれらすべての技術的詳細を気にする必要はありません：ブラウザーでの作業の微妙さ、タイミングとajaxの典型的な問題。

単純なSelenideテストがどのように見えるか見てみましょう。

public class GoogleTest { @Test public void user_can_search_everything_in_google() { open("http://google.com/ncr"); $(By.name("q")).val("selenide").pressEnter(); $$("#ires .g").shouldHave(size(10)); $("#ires .g").shouldBe(visible).shouldHave( text("Selenide: concise UI tests in Java"), text("selenide.org")); } }

（もちろん、Googleの代わりに、Webアプリケーションがここにあります）

ここで何が起こっていますか？

1つのopen（url）コマンドでブラウザーを開きます
$コマンドを使用してページ上のアイテムを探しています 。

要素は、名前、ID、CSSセレクター、属性、xpath、さらにはテキストで検索できます。
要素でいくつかのアクションを実行します 。この場合、 val（）コマンドでテキストを入力し、 pressEnter（）コマンドでEnterを押します。
結果を確認します。すべての検索結果を$$で検索します（要素のコレクションを返します）。コレクションのサイズと内容を確認します。

このテストは読みやすいですよね？

このテストは簡単に作成できますよね？

そして最も重要なことは、このテストは簡単に実行できることです。自分で見てください：

より深く潜る

もちろん、人生はそれほど単純ではありません。自動テストを書くことは多くの問題を意味します。なぜなら、開発者がそれを恐れるのは、決して複雑ではないからです-複雑なフレームワークやテクノロジーよりも。

しかし、ここでは、これらの問題のほとんどをすぐに解決できるため、Selenideは私たちの生活を楽にします。

UIテストの典型的な問題をさらに詳しく見てみましょう。

Ajaxとタイムアウトの問題

現在、Webアプリケーションはすべて動的です。アプリケーションの各部分は、いつでも動的に描画/変更できます。これにより、自動テストの問題が発生します。昨日緑だったテストは、コードを変更せずに突然赤に変わる可能性があります。ブラウザーが今日間違った方向に立ち上がってそのJavaScriptを少し遅く実行し、テストが完全にレンダリングされる前にボタンをクリックすることができたからです。

これは誰にとっても直接的な永遠の問題です。そのため、自動化エンジニアはいたるところに「スリップ」を押し込みます。

Selenideがこの問題をどのように解決するかは、さらに驚くべきことです。

要するに、Selenideでは、各メソッドは 必要に応じ て少し待つことができます。人々はそれを「スマートな期待」と呼びます。

書くとき

 $("#menu").shouldHave(text("Hello"));

Selenideは、ID = "menu"のアイテムが存在するかどうかを確認します。もしそうでなければ、セレニドは少し待って、もう一度チェックします。それから彼は待ちます。そして、項目が表示されたときにのみ、Selenideは目的のテキストがあることを確認します。

もちろん、永遠に待つことはできません。したがって、Selenideは4秒以下待機します。当然、このタイムアウトは構成できます。

これにより、テストが遅くなりますか？

いいえ、彼はしません。セレン化物は、必要な場合にのみ待機します。要素が最初にページに存在する場合-Selenideは待機しません。 300ミリ秒後に要素が表示される場合、セレニドは300ミリ秒だけ待機します。これはまさにあなたが必要とするものです。

多くの組み込みチェック

テキストに加えて、ページで他に何を確認できますか？かなりたくさんのこと。

たとえば、要素が表示されていることを確認できます。まだの場合、Selenideは最大4秒待機します。

 $(".loading_progress").shouldBe(visible);

アイテムが存在しないことを確認することもできます。アイテムがまだ見つかった場合、Selenideはアイテムが消えようとしていると見なし、最大4秒待機します。

 $(By.name("gender")).should(disappear);

1行で複数のテスト（いわゆる「流れるようなAPI」と「メソッドチェーン」）を実行できます。これにより、テストがさらに簡潔になります。

 $("#menu") .shouldHave(text("Hello"), text("John!")) .shouldBe(enabled, selected);

コレクション

Selenideを使用すると、要素のコレクションを非常に便利に操作できます。一度に1行で多くのアイテムをチェックできます。

たとえば、ページ上にそのような要素とそのような要素が正確にN個あることを確認できます。

 $$(".error").shouldHave(size(3));

要素のサブセットを除外できます：

 $$("#employees tbody tr") .filter(visible) .shouldHave(size(4));

要素のテキストを確認できます。ほとんどの場合、テーブル全体またはテーブル内の行をチェックするにはこれで十分です。

 $$("#employees tbody tr").shouldHave( texts( "John Belushi", "Bruce Willis", "John Malkovich" ) );

ファイルのダウンロード/アップロード

Selenideを使用すると、ファイルのアップロードは非常に簡単です。

 $("#cv").uploadFile(new File("cv.doc"));

複数のファイルを一度にアップロードすることもできます。

 $("#cv").uploadFile( new File("cv1.doc"), new File("cv2.doc"), new File("cv3.doc") );

また、ファイルのダウンロードも非常に簡単です。

 File pdf = $(".btn#cv").download();

動的なWebアプリケーションのテスト

一部のWebフレームワーク（GWTなど）は、解析できない完全に読み取り不可能なHTMLを生成します。永続的なID、名前、またはクラスはありません。

これは誰にとっても直接的な永遠の問題です。そのため、オートメーションエンジニアはどこにでも「xpath」を押し込み、寿命がくるまでサポートすることを余儀なくされます。

この問題を解決するために、Selenideはテキストによるアイテムの検索を提案しています。

 import static com.codeborne.selenide.Selectors.*; $(byText(", !")) //      .shouldBe(visible); $(withText("")) //     .shouldHave(text(", !"));

一般的な考えに反して、テキスト内のアイテムを検索することはそれほど悪い考えではありません。ちなみに、これは実際のユーザーが要素を検索する方法です。 IDやクラスで要素を検索することはなく、XPATHで検索することもありません。彼はテキストで検索します。（まあ、まだカラーですが、自動化するのはより困難です）。

セレン化物には、子供や親を見つけるための便利な方法もいくつかあります。これにより、識別マークなしで要素間を移動できます。

 $("td").parent() $("td").closest("tr") $(".btn").closest(".modal") $("div").find(By.name("q"))

たとえば、テーブル内のセルをテキストで検索し、それを含む文字列trを見つけて、この行の「保存」ボタンを見つけることができます。

 $("table#employees") .find(byText("Joshua")) .closest("tr.employee") .find(byValue("Save")) .click();

ページオブジェクト

同じ要素またはページが多くのテストで使用される場合、ページのロジックを別のクラスに置くことは理にかなっています。このクラスはPage Objectと呼ばれ、Selenideを使用すると非常に便利です。

上記のGoogleの例は、次の方法でページオブジェクトでやり直すことができます。

  @Test public void userCanSearch() { GooglePage page = open("http://google.com/ncr", GooglePage.class); SearchResultsPage results = page.searchFor("selenide"); results.getResults().shouldHave(size(10)); results.getResult(0).shouldHave(text("Selenide: concise UI tests in Java")); }

Google検索ページのページオブジェクト：

 public class GooglePage { public SearchResultsPage searchFor(String text) { $(By.name("q")).val(text).pressEnter(); return page(SearchResultsPage.class); } }

検索結果ページの場合：

 public class SearchResultsPage { public ElementsCollection getResults() { return $$("#ires .g"); } public SelenideElement getResult(int index) { return $("#ires .g", index); } }

ただし、ページオブジェクトを乱用しないでください。

UIテストはほとんど必要ないという事実に注意を喚起したいと思います。まだブラウザであるという単純な理由から、

ajax、javascript、およびこれらすべては比較的低速で不安定です。以下を検証する1つまたは2つのUIテストを作成します

アプリケーション全体が機能します。ページが開き、テキストが描画され、ボタンが押され、JavaScriptがクラッシュしません。

そして、ユニットテストの助けを借りて、あらゆる種類の組み合わせとまれなケースを必ずチェックしてください。

典型的な間違いは、UIを通じてすべてをチェックすることです。これは、開発者が記述しない企業のテスターによって特に影響を受けます。

単体テスト。貧弱なテスターは、選択の余地がありません。ただ、膨大な量の遅いものを作るしかありません。

不安定なUIテストと生涯にわたるサポートの活用。

しかし、あなたはプログラマーです！人々を苦しめないでください。

...および他の多くの有用なもの

Selenideには、次のような多くの機能があります。

 $("div").scrollTo(); $("div").innerText(); $("div").innerHtml(); $("div").exists(); $("select").isImage(); $("select").getSelectedText(); $("select").getSelectedValue(); $("div").doubleClick(); $("div").contextClick(); $("div").hover(); $("div").dragAndDrop() zoom(2.5);  ..

良いニュースは、これらすべてを覚えておく必要がないことです。 $、ピリオドを入力して、あなたが望むものについて書き始めてください。たとえば、「val」または「enter」。 IDEが提供するオプションを確認してください。

IDEのパワーを使用してください！頭に詳細を散らかしたり、ビジネスロジックに集中したりしないでください。

世界をより良い場所にする

すべての開発者がコードの自動テストを作成すると、世界が良くなると信じています。開発者が17:00に落ち着いて子供たちのところに行くとき、彼らは自分の変化で何かを壊したのではないかと心配しません。

私を信じて、私はコーヒーを飲みながら、私のテストはすでにコードをチェックしていると確信しています。そして、テストに合格したものが機能することは確かです。

自動テストで世界をより良い場所にしましょう！ソフトウェアに自信を持ち、各リリースの前に幸運を祈る必要はありません。

セレン化物ロゴ

明けましておめでとうございます！

en.selenide.org

Selenideでの効果的なUIテスト