Question

页面模型-

import { Selector } from 'testcafe';

export default class Page {
    constructor () {
        this.nameInput = Selector('#developer-name');
    }
}

页面模型2-

import { Selector } from 'testcafe';

export default class Page2 {
    constructor () {
        this.nameInput2 = Selector('#tester-name');
    }
}

通用规范以实例化以上内容-

import Page from './page-model';
import Page2 from './page-model2';

const page = new Page();
const page2 = new Page2();

我们可以有一个文件\ spec来实例化两个页面以上，然后从单个引用变量访问页面中的所有选择器吗？

Answer 1

如果您不想在每个测试中创建页面模型的新实例，则可以直接将它们导出到model.js中：

test.js

import { pageOne, pageTwo } from './model';

fixture `fixture 1`
    .page `http://example.com`;

test(`test`, async t => {
    await t
    .click(pageOne.el1)

    //...navigation to page two

    .click(pageTwo.el2);
});

model.js

import { Selector } from 'testcafe';

class PageOne {
    constructor () {
        this.el1 = Selector('#el1');
        //....
    }
}

class PageTwo {
    constructor () {
        this.el2 = Selector('#el2');
        //....
    }
}

export const pageOne = new PageOne();
export const pageTwo = new PageTwo();

更新

您还可以按以下方式将所有选择器组织在一个单独的模块中：

test.js

import selectors from './selectors';

fixture `fixture 1`
    .page `http://example.com`;

test(`test`, async t => {
    await t
    .click(selectors.el1)
    .click(selectors.el2);
});

selectors.js

import { Selector } from 'testcafe';

export default {
    el1: Selector('#el1'),
    el2: Selector('#el2'),
    //....
}

TestCafe：页面对象模型-使用一个公共的单个引用访问所有实例化的对象

1 个答案: