複数の UI マップでの大規模アプリケーションのテスト

このトピックでは、複数の UI マップを使用して大規模なアプリケーションをテストする場合のコード化された UI テストの使用方法について説明します。

新しいコード化された UI テストを作成すると、Visual Studio テスト フレームワークによってテスト用のコードが既定では UIMap クラスに生成されます。 コード化された UI テストの記録方法の詳細については、「方法: コード化された UI テストを作成する」および「コード化された UI テストの構造」を参照してください。

UI マップ用に生成されるコードには、テストとやり取りする各オブジェクトのクラスが含まれています。 生成されるメソッドごとに、そのメソッド専用のメソッド パラメーター用コンパニオン クラスが生成されます。 アプリケーションに多数のオブジェクト、ページ、およびフォームとコントロールがある場合、UI マップは非常に大きくなることがあります。 また、数人でテストの作業を行う場合、UI マップが 1 つの大きなファイルであると、アプリケーションが扱いにくくなります。

複数の UI マップ ファイルを使用することには、次のような利点があります。

  • 各マップをアプリケーションの論理的なサブセットに関連付けることができます。 このため、変更を管理しやすくなります。

  • 各テスト担当者がアプリケーションのセクションに対して作業を行い、他のセクションのテスト担当者に影響を与えずに、自分のコードをチェックインできます。

  • アプリケーション UI への追加による拡大を段階的に処理でき、UI の他の部分のテストに対する影響が最小限に抑えられます。

複数の UI マップが必要になる例

次のような状況では、複数の UI マップを作成します。

  • Web サイトの登録ページや買い物カゴの購入ページのように、いくつかの複雑な複合 UI コントロールのセットが協調して論理的な操作を行う。

  • いくつかの操作のページを持つウィザードのように、独立したコントロールのセットがアプリケーションのさまざまな場所からアクセスされる。 ウィザードの各ページが特に複雑な場合、ページごとに個別の UI マップを作成できます。

複数の UI マップの追加

プロジェクトに UI マップを追加するには

  1. ソリューション エクスプローラーで、すべての UI マップを格納するためのフォルダーをテスト プロジェクト内に作成するために、テスト プロジェクト ファイルを右クリックし、[追加] をポイントして、[新しいフォルダー] をクリックします。 たとえば、UIMaps という名前を付けます。

    新しいフォルダーがテスト プロジェクトの下に表示されます。

  2. UIMaps フォルダーを右クリックし、[追加] をポイントして [新しいアイテム] をクリックします。

    [新しい項目の追加] ダイアログ ボックスが表示されます。

    注意

    新しいコード化された UI テスト マップを追加するには、テスト プロジェクト内である必要があります。

  3. 一覧から [コード化された UI テスト マップ] を選択します。

    [名前] ボックスに、新しい UI マップの名前を入力します。 たとえば HomePageMap のように、マップが表すコンポーネントまたはページの名前を使用します。

  4. [追加] をクリックします。

    Visual Studio のウィンドウが最小化され、[コード化された UI テスト ビルダー] ダイアログ ボックスが表示されます。

  5. 最初のメソッドの操作を記録し、[コードの生成] をクリックします。

  6. 最初のコンポーネントまたはページのすべての操作とアサーションを記録し、それらをメソッドにグループ化してから、[コード化された UI テスト ビルダー] ダイアログ ボックスを閉じます。

  7. UI マップの作成を続けます。 操作とアサーションを記録し、コンポーネントごとのメソッドにグループ化してから、コードを生成します。

多くの場合、アプリケーションのトップ レベルのウィンドウは、すべてのウィザード、フォーム、およびページを通じて一定です。 各 UI マップにはトップ レベルのウィンドウのクラスがありますが、すべてのマップは通常、アプリケーションのすべてのコンポーネントが実行されている、同じトップ レベルのウィンドウを参照しています。 コード化された UI テストは、コントロール階層を上から順に検索します。トップ レベルのウィンドウから開始するため、複雑なアプリケーションでは、実際のトップ レベルのウィンドウがすべての UI マップで重複する場合があります。 実際のトップ レベルのウィンドウが重複している場合、そのウィンドウが変更されると、複数の変更が発生することになります。 それによって、UI マップ間で切り替えを行うときに、パフォーマンスの問題が発生する場合があります。

この影響を最小限に抑えるには、CopyFrom() メソッドを使用して、UI マップの新しいトップ レベルのウィンドウがメインのトップ レベルのウィンドウと同じになるようにします。

次の例は、さまざまな UI マップで生成されるクラスによって表される各コンポーネントとその子コントロールにアクセスできるようにするユーティリティ クラスの一部です。

この例では、Contoso という名前の Web アプリケーションに、ホーム ページ、製品ページ、および買い物カゴ ページがあります。 これらの各ページが、ブラウザー ウィンドウである共通のトップ レベル ウィンドウを共有しています。 ページごとに UI マップがあり、ユーティリティ クラスには次のようなコードがあります。

using ContosoProject.UIMaps;
using ContosoProject.UIMaps.HomePageClasses;
using ContosoProject.UIMaps.ProductPageClasses;
using ContosoProject.UIMaps.ShoppingCartClasses;

namespace ContosoProject
{
    public class TestRunUtility
    {
        // Private fields for the properties
        private HomePage homePage = null;
        private ProductPage productPage = null;
        private ShoppingCart shoppingCart = null;

        public TestRunUtility()
        {
            homePage = new HomePage();
        }

        // Properties that get each UI Map
        public HomePage HomePage
        {
            get { return homePage; }
            set { homePage = value; }
        }

        // Gets the ProductPage from the ProductPageMap.
        public ProductPage ProductPageObject
        {
            get
            {
                if (productPage == null)
                {
                    // Instantiate a new page from the UI Map classes
                    productPage = new ProductPage();

                    // Since the Product Page and Home Page both use
                    // the same browser page as the top level window,
                    // get the top level window properties from the
                    // Home Page.
                    productPage.UIContosoFinalizeWindow.CopyFrom(
                        HomePage.UIContosoWindowsIWindow);
                }
                return productPage;
            }
        }

    // Continue to create properties for each page, getting the 
    // page object from the corresponding UI Map and copying the 
    // top level window properties from the Home Page.
}

参照

処理手順

方法: コード化された UI テストを作成する

参照

UIMap

CopyFrom

その他の技術情報

コード化された UI テストの構造