カスタム UI コンポーネント用のテストの記述

ライブ スクリプトを開く

この例では、App Designer を使用して作成されたカスタム UI コンポーネントに対して動作を実行するテストの記述方法を示します。このテストでは、MATLAB® アプリ テスト フレームワークを使用します。詳細については、アプリ テスト フレームワークの概要を参照してください。

カスタム UI コンポーネントに対する動作をテストするには、以下の手順に従います。

  1. App Designer でカスタム UI コンポーネントを作成します。

  2. カスタム コンポーネントを構成する基となる UI コンポーネントへのアクセス権をテスト クラスに付与します。

  3. 基となる UI コンポーネントに対する動作を実行するテスト クラスを記述します。

App Designer でのカスタム UI コンポーネントの作成

この例では、ColorPickerComponent カスタム UI コンポーネントを使用します。コンポーネントは以下で構成されます。

  • RedField、GreenField、および BlueField という名前のプライベート プロパティとして保存された、選択した色の RGB 値を入力および表示するための 3 つの数値編集フィールド

  • 現在の色を表示し、ユーザーがクリックするとカラー ピッカーを開く、Button という名前のプライベート プロパティとして保存されたボタン

Color picker custom UI component

App Designer で ColorPickerComponent ファイルを開きます。

appdesigner("ColorPickerComponent.mlapp")

基となる UI コンポーネントへのアクセス権をテスト クラスに付与

カスタム コンポーネント内の基となる UI コンポーネントに対して動作を実行するテスト クラスを記述するには、そのテスト クラスに、基となる UI コンポーネントへのアクセス権が必要です。たとえば、ColorPickerComponent の編集フィールドの値を変更するテストを記述するには、テスト クラスが NumericEditField オブジェクトにアクセスできなければなりません。テスト クラスにアクセス権を付与するには、App Designer でコンポーネント ファイルが開いた状態で、[コンポーネント ブラウザー] で ColorPickerComponent ノードを選択します。次に、[テスト] で [テスト ケースにアクセスを付与] を選択します。

App Designer Component Browser. The ColorPickerComponent node is selected and the "Give Test Cases Access" check box is selected.

テスト クラスの記述

アプリ テスト フレームワークを使用して、コンポーネント用のテストを記述します。testEditField という名前の単一のテスト メソッドをもつ ColorPickerComponentTest という名前のテスト クラスを作成します。テスト メソッドに以下のアクションを実装します。

  • テスト コールバック関数および UI Figure 内に ColorPickerComponent オブジェクトを作成する。

  • テストが完了したら figure を削除して、テスト後に環境を復元する。

  • type 動作メソッドを使用して、コンポーネントの RedField 編集フィールドに値を入力する。

  • ボタンの色が想定どおりに更新され、コールバック関数が呼び出されたことを確認する。

ColorPickerComponentTest テスト クラスの完全なコードは以下のとおりです。

classdef ColorPickerComponentTest < matlab.uitest.TestCase

    methods (Test)
        function testEditField(testCase)
            % Setup
            callbackCalled = false;
            function testCallback(src,event)
                callbackCalled = true;
            end
            fig = uifigure;
            c = ColorPickerComponent(fig,ColorChangedFcn=@testCallback);
            testCase.addTeardown(@delete,fig)

            % Exercise
            testCase.type(c.RedField,0.7)

            % Verify
            testCase.verifyEqual(c.Button.BackgroundColor(1),0.7)
            testCase.verifyTrue(callbackCalled);
        end
    end

end

テストを実行します。テストが実行されると、Test メソッドがカラー ピッカー コンポーネントを含む Figure ウィンドウを開き、編集フィールドに対して入力動作を実行してボタンの色を更新してから、Figure ウィンドウを閉じるのを確認できます。

result = runtests("ColorPickerComponentTest")
Running ColorPickerComponentTest

.
Done ColorPickerComponentTest
__________

result = 
  TestResult with properties:

          Name: 'ColorPickerComponentTest/testEditField'
        Passed: 1
        Failed: 0
    Incomplete: 0
      Duration: 3.8818
       Details: [1×1 struct]

Totals:
   1 Passed, 0 Failed, 0 Incomplete.
   3.8818 seconds testing time.

参考

トピック