2️⃣

ログイン処理・ユーザーを共通化する:Role

2023/01/22に公開

(テスト毎にログイン処理を書くのは面倒くさい!!!)

  1. roles.js:ログインするユーザRole・ログイン処理の記述
  2. test_roles.js:ログイン、ログイン後のメッセージの確認
  3. ディレクトリ構造、ファイル配置
    % tree           
    .
    ├── roles.js
    └── test_roles.js
    
test_role.js テスト実行結果

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

 fixture: login test

Thank you, John Smith!
 ✓ Login test: adminRole

Thank you, satoko!
 ✓ Login test: userRole

 2 passed (3s)
roles.js
import { Selector, t, Role } from 'testcafe'
const loginURL = 'https://devexpress.github.io/testcafe/example/'

export const adminRole = Role(loginURL, async t => {
        await login('John Smith')
}, {
        preserveUrl: true
});

export const userRole = Role(loginURL, async t => {
        await login('satoko')
}, {
        preserveUrl: true
});

async function login(userName) {
        await t
                .typeText('#developer-name', userName)
                .click(`#submit-button`)
};
test_roles.js
import { adminRole, userRole } from './roles.js'
import { Selector } from 'testcafe';

fixture `fixture: login test`

const articleHeader = Selector('#article-header')

test('Login test: adminRole', async t => {
        await t 
                **.useRole(adminRole)**
                .expect(articleHeader.innerText).contains('Thank you') 

        console.log(await articleHeader.innerText);
});

test('Login test: userRole', async t => {
        await t 
                **.useRole(userRole)**
                .expect(articleHeader.innerText).contains('Thank you') 

        console.log(await articleHeader.innerText);
});

Discussion