testcafeインストール

% npm install -g testcafe
% testcafe -v
1.13.0

Getting Startedに挑戦（簡単なテストを作る ）

Getting Started | Docs

  1. テスト用のサンプルサイトにアクセス

    https://devexpress.github.io/testcafe/example/

  2. テキストフィールドに「John Smith」と入力

  3. サブミットボタン、クリック

  4. 「Thank you, John Smith!」と表示されるのを確認

test.jsの内容

fixture `Getting Started`
        .page`https://devexpress.github.io/testcafe/example`;

test ('My first test', async t => {
        await t
                .typeText(`#developer-name`, `John Smith`)
                .click(`#submit-button`)

                .expect(Selector(`#article-header`).innerText).eql(`Thank you, John Smith!`);

        //how to use log
        const articleHeader = await Selector(`.result-content`).find(`h1`);
        let headerText = await articleHeader.innerText;
        console.log(headerText);
});

実行結果

% testcafe chrome test.js
 Running tests in:
 - Chrome 100.0.4896.60 / macOS 10.15.7

 Getting Started 　　　　// <- fixture名
Thank you, John Smith!　// <- console.logの出力結果
 ✓ My first test        // <- テスト名

 1 passed (3s)