时间戳

首页 > 解决方案 > 如何为 React js 中的函数编写单元测试？

reactjs - 如何为 React js 中的函数编写单元测试？

问题描述

我的 App.js 文件中有一个函数，如下所示。

function unCamelCase(val) {
   return val.replace(/([a-z])([A-Z])/g, '$1 $2')
        .replace(/\b([A-Z]+)([A-Z])([a-z])/, '$1 $2$3')
        .replace(/^./, function(str){ return str.toUpperCase();   })
}

如何为上述功能编写单元测试。

提前致谢。

标签： reactjsunit-testing

解决方案

你听说过杰斯特吗？我相信 Facebook 用它来测试他们所有的 JavaScript 代码。在我的一个项目中，我在很小的程度上使用了它。如果您有兴趣，此页面将解释如何设置它。

https://jestjs.io/docs/en/getting-started.html

示例实现（unCamelCase.js 在测试文件夹之外，而 test_unCamelCase.js 在里面）：

// test_unCamelCase.js

const unCamelCase = require('../unCamelCase');

test("test unCamelCase", () => {
    expect(unCamelCase("camelCase")).toBe("Camel Case")
    expect(unCamelCase("moreThanTwoWords")).toBe("More Than Two Words")
    expect(unCamelCase("symb0lsAndNumber$")).toBe("Symb0ls And Number$")
})

// unCamelCase.js

function unCamelCase(val) {
    return val.replace(/([a-z])([A-Z])/g, '$1 $2')
         .replace(/\b([A-Z]+)([A-Z])([a-z])/, '$1 $2$3')
         .replace(/^./, function(str){ return str.toUpperCase();   })
}

module.exports = unCamelCase

推荐阅读