微信小程序测试 单元测试 学习记录

微信小程序测试 单元测试 学习记录

---

组件测试（miniprogram-simulate+jest）

包下载

下载 miniprogram-simulate

npm i --save-dev miniprogram-simulate

下载 jest

npm install --save-dev jest

配置文件

package.json 文件中，设置好测试的匹配路径
当然如果你不想用jest也没关系，反正主要在于如何编写测试

"jest": {
    "testMatch": [
        "**/index.test.js"
    ]
}

第一个案例

假设我们需要测试的是在文件路径为：

./components/index

的一个组件的渲染过程，我们可以按照如下方式编写（注意路径）

// /test/components/index.test.js

const simulate = require('miniprogram-simulate')
describe("start", () => {
    it('test1', async (done) => {
        jest.resetModules()
        const id = simulate.load('yourBasicPath' + '/components/index')
        // 这里的path 注意 是绝对路径，win系统下是从盘符开始的
        const comp = simulate.render(id,)
        let that = comp.instance;
        let parent = document.createElement('parent-wrapper') // 创建父亲节点
        comp.attach(parent) // attach 到父亲节点上，此时会触发自定义组件的 attached 钩子
        done()
    })
})

此时，在项目文件中执行 jest 指令，便启动了一次对于路径为 ./components/index 的组件的创建的测试。

一些坑

1. 需要注意的是，在编写两个以上的测试放在同一个simulate 下时，在每次测试开始前，需要执行下面这行代码去刷新

jest.resetModules()

2. 测试环境中，不存在getcurrentPage() 函数 和 app 环境，这个需要在组件编写的过程中留意。