TestCafe（２）テストのAPI１（fixtureとtest）

## 記事の概要
　TestCafeについての記述の2回目です。
　今回以降はテストスクリプトについての記述と思ったことを書いておきます。
　ここに書いている内容は基本TestCafeのAPIの仕様を使いそうなところだけまとめていますので、詳細を確認したい場合はAPIを読んでください。
　とりあえず、fixtureとtestの簡単な記述とその課題のみ書いてみました。テストの操作はまた次になります。

## テストスクリプトの基本構造
　テストスクリプトは原則「fixture」と「test」で構成されています。「fixture」は辞書で調べてみると「据え付け品」、「取り付け具」、「備品」とか「競技種目」といった意味のようですが、TestCafeではどうもテストの種類か分類といった感じで、実際のテストを記述する「test」コマンドを呼び出す前に呼び出す必要があるようです。基本以下の構造を持っています。（実際の記述は処理の呼び出しです）
　fixture1
　　- text1-1
　　- test1-2
　　- test1-3
　fixture2
　　- test2-1
　　- test2-2
　　- test2-3
　　...

　実際のテストスクリプトは以下の要に記述します。テストの動作は「test」の引数として記述します。

``` ts:testsample1.ts
fixture `My fixture`
    .page `http://www.example.com/`;

test('My Test', async t => {
    await t
        .setNativeDialogHandler(() => true)
        .click('#populate')
        .click('#submit-button');

    const location = await t.eval(() => window.location);

    await t.expect(location.pathname).eql('/testcafe/example/thank-you.html');
});
```

### 「fixture」と「test」のメソッド
　「fixture」と「test」では「fixture」で設定できる情報は基本「test」でも設定可能で、設定が上書きされるようです。以下のメソッドがあります。

| メソッド | 対象 | 概要 |
| :---------- | :----------| :----------|
| .page( url ) <br /> .page \`url\` | 両方 | テスト開始時にGetde呼び出すページのURLを設定する。 |
| .meta('key1', 'value1')<br />.meta({ key1: 'value1', key2: 'value2', key3: 'value3' }) | 両方 |  「fixture」と「test」のそれぞれに[key:value]形式のメタデータを設定する。コマンドラインオプションや設定ファイルで実行するテストのフィルターとして機能する。またリポート作成時に出力情報とすることもできる |
| .beforeEach( fn(t) ) |  fixture | 「fixture」内の全ての「test」実行前に実施する処理。 |
| .afterEach( fn(t) ) | fixture | 「fixture」内の全ての「test」実行後に実施する処理。 |
| test.before( fn(t) )<br />fixture .before( fn(ctx) ) |  両方 | 「fixture」または「test」の実行時前に実施する処理。「fixture」ではbeforeEach と違い、1度しか実行しない。 |
| test.after( fn(t)<br />fixture .after( fn(ctx) ) ) | 両方 | 「fixture」または「test」の実行時後に実施する処理。「fixture」ではbeforeEach と違い、1度しか実行しない。 |

　[beforeEach]と[afterEach]で値を共有する場合、「fixture.befor 」「fixture.afte」では引数の[ctx]に、「test.before」「fixture.beforeEac」と「test.after」「fixture.afterEach」で共通の値を利用するにはは引数「t」のプロパティ「t.ctx」にプロパティーを設定して共有できます。

``` ts:testsample2.ts
fixture `Fixture1`
    .beforeEach(async t  => {
        t.ctx.someProp = 123;
    });

test
    ('Test1', async t => {
        console.log(t.ctx.someProp); // > 123
    })
    .after(async t => {
         console.log(t.ctx.someProp); // > 123
    });

fixture `My fixture`
    .page `http://example.com`
    .before( async ctx => {
        /* fixture initialization code */
        ctx.fixProp = 123;
    })
    .after( async ctx => {
        /* fixture finalization code */
         console.log(ctx.fixProp); // > 123
    });
``` 

### 「fixture」と「test」で他にできること
　ほかにも以下のことができます。今のところ私には必要性が無いのでここでは記述しませんので詳細はAPIを見てください。
　- テストのスキップ（コード中に記述する意味が分からない。メタデータでフィルタする方がいいように思う）
　- クライアントページへのスクリプトの埋め込み（特殊なテストでモックとして使うのかな）
　- ページキャッシュの無効化（テストの場合のみ実施するのはどうなのかと...）

### 課題：一覧の流れの途中の経過を出力できない。（間違ってるかもしれませんので、知っていれば教えてください）
1.Testごとに最初のページがGetされている
　ページの遷移や処理の一連の流れを確認する場合、一つのテスト内に記述する必要がある。
　最初気づかずに、1つ目のtestで設定した値が次のtestで元に戻っていてエラーになっていた。

2.Test内のAssert毎に正常パスのメッセージを出力できない
　一つのテスト内で途中経過のメッセージを出力する機能が無い。（エラーは出るけど）
　上記の問題と合わせると、連続た流れのテストする場合にそんなに長いテストでも途中の経過を出力できない。（コンソールに出すことはできるけど当然レポートには出ない...。assertion のメッセージはエラーの場合のみ。微妙やなー。必要ないと言えばないけど。）
　「all」等でブラウザ複数を使用した場合に、Test単位でOKメッセージを出すためかなと思う。