Question

我最近开始利用Puppeteer进行e2e测试（我对Selenium Web Driver有一些经验），我在文档中找不到任何讨论POM模式的内容。有没有可用的示例如何在Puppeteer中的node / ES7中正确实现？

我们假设我有一个简单的脚本来测试页面的登录功能：

(async () => {
...

     await page.goto(url, {
        timeout: 5000
    });

    await page.waitFor('input[id=userId]');

    await page.type('input[id=userId]', 'John Doe');
    await page.type('input[id=password]', 'password1');
    await page.click('button[type="submit"]');
    await page.waitFor('p.success-msg');
...
}();

通常，我们会为登录页面设置页面对象模型。如何为上述页面创建基本POM并将其与我的脚本集成？在这种环境下，您如何在我的测试脚本中调用POM？我会使用import吗？我只是在寻找一个基本的“你好世界”的例子。

Answer 1

在最基本的层面上，POM声明每个页面都有自己的类，其中包含与该页面交互的实用程序方法。

为了通过Puppeteer实现这一点，我们使用ES6类来创建包含各自页面的实用程序方法的类。

文件夹结构

df.drop('A', 1)

        Date      Time           Timestamp
0 2008-01-23  15:41:00 2008-01-23 15:41:00
1 2010-03-10  14:42:00 2010-03-10 14:42:00
2 2010-10-14  15:23:00 2010-10-14 15:23:00
3 2008-01-02  11:39:00 2008-01-02 11:39:00
4 2008-04-03  13:35:00 2008-04-03 13:35:00
5 2008-05-02  09:29:00 2008-05-02 09:29:00

<强> HomePage.js

test/
  main.js
  pages/
    - HomePage.js
    - CartPage.js
    - ProductDetailPage.js

<强> main.js

export default class HomePage {

    constructor(page) {
        this.page = page;
    }

    async getTitle() {
        return this.page.title();
    }
}

具有节点，ES7，puppeteer的页面对象模式

1 个答案: