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

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

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

现在我想扩展测试套件以同时运行单元测试来验证自定义 JS 函数的功能。

例如：我有一个具有 App 属性的全局对象 version。作为第一个测试，我想确认 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) } );
});

此代码的问题

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

解决方法

这是一个对我有用的解决方案：

从浏览器读取数据：

1. 我通过 npx codecept gh 创建了一个自定义帮助程序并将其命名为 BrowserAccess。
2. 辅助函数 getBrowserData 使用 this.helpers['Puppeteer'].page.evaluate() 从浏览器范围运行和返回自定义代码。 .evaluate()
的文档

自定义断言：

1. 安装 codeceptjs-assert 包，例如npm i codeceptjs-assert
2. 将 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);
});