javascript - 测试 IIFE(立即调用的函数表达式)的最佳方法

Question

所以我有一个在浏览器中广泛使用 IIFE 的现有应用程序。我试图在代码中引入一些单元测试，并与 IIFE 的模式保持一致，以便对代码库进行新的更新。除了，我什至无法编写一个测试来处理代码。例如，我在代码库中看到了这种类型的逻辑:

var Router = (function (router) {

   router.routeUser = function(user) {
      console.log("I'm in! --> " + user)
   };

   return router;
})(Router || {});

然后 JS 文件包含在标记中的脚本标记中:

<script src="js/RouteUser.js"></script>

并在生产代码中这样调用:

Router.routeUser(myUser)

所以我的问题是，如何编写测试方法 routeUser 的测试？我在我的 Mocha 测试中尝试过这个:

var router = require('../../main/resources/public/js/RouteUser');

suite('Route User Tests', function () {
    test('Route The User', function () {
        if (!router)
            throw new Error("failed!");
        else{
            router.routeUser("Me")
        }
    });
});

但我得到一个异常(exception):

TypeError: router.routeUser is not a function
at Context.<anonymous> (src\test\js\RouteUser.test.js:8:20)

然后我尝试返回方法，它给出了同样的错误:

var Router = (function (router) {
    return {
        routeUser: function (user) {
            console.log("I'm in! --> " + user)
        } 
    }
}
)(Router || {});

谁能给我指出正确的方向？

Answer 1

听起来……

• 您有一个仅在浏览器上下文中使用的脚本代码库(IIFE 的使用表明了这一点)
• 您想使用 node.js 引入无浏览器单元测试(Jest、Mocha？)(好主意!)
• 但此时您可能不想将整个代码库迁移到不同的编码风格(可能需要大量工作，具体取决于代码库的大小)

鉴于这些假设，问题是您希望您的代码...

• 在生产中使用时充当脚本(设置全局window.Router等)
• 在单元测试中使用时充当模块，以便您可以在单元测试中require()它

UMD

UMD，即通用模块定义，曾经是一种通用的编写代码的方式，以便它可以在多种环境中工作。有趣的方法，但非常麻烦，我想认为 UMD 如今已成为过去...

I'll leave it here for completeness.

就拿UMD的idea来

如果您现在只想让特定脚本也充当模块，以便它在测试中可导入，您可以做一个小调整:

var Router = (function (router) {

   router.routeUser = function(user) {
      console.log("I'm in! --> " + user)
   };

   if (typeof exports === "object") {
      module.exports = router;
      // now the Mocha tests can import it!
   }
   return router;
})(Router || {});

长期解决方案

从长远来看，通过重写所有代码以仅使用模块并使用像 webpack 这样的工具为您打包，您可以获得很多好处。上面的想法是朝着你的方向迈出的一小步，它给你一个特定的好处(可测试性)。但这不是一个长期的解决方案，你会在处理依赖关系时遇到一些麻烦(如果你的路由器希望一些全局变量到位怎么办？)