如何使用 CodeceptJS 对 JS 函数进行单元测试

Question

我已经为一个项目设置了 CodeceptJS，并用它来测试各种端到端场景。

现在我想将测试套件扩展到 还有运行单元测试 以验证自定义 JS 函数的功能。

例如：我有一个具有 version 属性的全局对象 App。作为第一个测试，我想确认 App.version 存在并且有一个值。

我的第一次尝试是一个 test.js 文件，其中包含以下代码：

Feature('Unit Tests');

Scenario('Test App presence', ({ I }) => {
    I.amOnPage('/');

    I.executeScript(function() {return App.version})
        .then(function(value) { I.say(value) } );
});

此代码有问题

主要问题：如何断言 App.version 存在？
我的脚本可以显示该值，但如果它丢失也不会失败
对于这样一个简单的测试，我的代码非常复杂。
我确定有一种 cleaner/faster 方法可以执行该测试，对吧？

Answer 1

这是一个适合我的解决方案：

从浏览器读取数据：

我通过 npx codecept gh 创建了一个自定义助手并将其命名为 BrowserAccess。
辅助函数 getBrowserData 使用 this.helpers['Puppeteer'].page.evaluate() 到运行和 return 来自浏览器范围的自定义代码。 .evaluate()

自定义断言：

安装 codeceptjs-assert 包，例如npm i codeceptjs-assert
将 AssertWrapper-helper 添加到 codecept-config 文件。这会启用 I.assert(a, b)

完整代码

codecept.conf.js

exports.config = {
    helpers: {
        AssertWrapper: {
            require: "codeceptjs-assert"
        },
        BrowserAccess: {
            require: './browseraccess_helper.js'
        },
        ...
    },
    ...
}

browseraccess_helper.js

const Helper = require('@codeceptjs/helper');

class BrowserAccess extends Helper {
    async getBrowserData(symbolName) {
        const currentPage = this.helpers['Puppeteer'].page;
        let res;

        try {
            res = await currentPage.evaluate((evalVar) => {
                let res;
                try {
                    res = eval(evalVar);
                } catch (e) {
                }
                return Promise.resolve(res);
            }, symbolName);
        } catch (err) {
            res = null;
        }

        return res;
    }
}

jsapp_test.js（现测试async）

Feature('Unit Tests');

Scenario('Test App presence', async ({ I }) => {
    I.amOnPage('/');

    const version = await I.getBrowserData('App.version');
    I.assertOk(version);
});

如何使用 CodeceptJS 对 JS 函数进行单元测试

How to use CodeceptJS to unit-test a JS function

unit-testing

codeceptjs

从浏览器读取数据：

自定义断言：

完整代码