Angularコンポーネントテストハーネスのサポートサービス

@badisi/wdio-harnessは、サードパーティ製のパッケージです。詳細についてはGitHub | npmをご覧ください。

@badisi/wdio-harness

🔬 WebdriverIO support for Angular component test harnesses.

---

コンポーネントテストハーネス

コンポーネントハーネスは、テストがサポートされたAPIを通じてコンポーネントと対話できるようにするクラスです。各ハーネスのAPIは、ユーザーが行うのと同じ方法でコンポーネントと対話します。ハーネスAPIを使用することで、テストはコンポーネントの内部構造（DOMの構造の変更など）に対する更新から自分自身を保護します。コンポーネントハーネスのアイデアは、統合テストで一般的に使用されるPageObjectパターンから来ています。

詳細情報

---

インストール

npm install @badisi/wdio-harness --save-dev

yarn add @badisi/wdio-harness --dev

使用方法

メソッド

• createHarnessEnvironment(rootElement) - 指定された要素からHarnessLoaderインスタンスを取得します（デフォルトはbody）
• getHarness(harnessType, element) - 指定されたComponentHarnessクラスと要素からハーネスインスタンスを検索します
• getHarness(harnessType) - 指定されたComponentHarnessクラスからハーネスインスタンスを検索します
• getHarness(query) - 指定されたHarnessPredicateからハーネスインスタンスを検索します
• getAllHarnesses(query) - getHarnessのように機能しますが、ハーネスインスタンスの配列を返します
• waitForAngular() - Angularのブートストラップが完了するまで待機します

例

import { MatDatepickerInputHarness } from '@angular/material/datepicker/testing';
import { getHarness } from '@badisi/wdio-harness';

describe('Angular Material Harness', () => {
    beforeEach(async () => {
        await browser.url('http://localhost:4200');
    });

    it('MatDatePicker', async () => {
        const datepicker = await getHarness(MatDatepickerInputHarness.with({ selector: '#demo-datepicker-input' }));

        await datepicker.setValue('9/27/1954');
        expect(await datepicker.getValue()).withContext('Date should be 9/27/1954').toBe('9/27/1954');

        await datepicker.openCalendar();
        const calendar = await datepicker.getCalendar();
        await calendar.next();
        await calendar.selectCell({ text: '20' });
        expect(await datepicker.getValue()).withContext('Date should be 10/20/1954').toBe('10/20/1954');
    });
});

より多くの例はこちらをご覧ください。

開発

開発者ドキュメントをご覧ください。

貢献

> 協力したい方へ

バグを報告したり、コードを貢献したり、ドキュメントを改善したりしたいですか？素晴らしいです！

ただし、まず貢献ガイドラインを読み、提出プロセス、コーディングルールなどについて学んでください。

> 行動規範

行動規範を読んで従い、このプロジェクトをオープンで包括的に保つのを手伝ってください。