javascript - 使用 Modernizr 的单元测试代码

Question

我的问题是关于使用 Mocha 对 javascript 代码进行单元测试。最终这可能是关于依赖注入(inject)或控制反转的问题，我对这些概念的理解很差。

我正在尝试编写一个测试，它只创建一个 header.js 实例并测试它是否是一个对象。但是，每当我这样做时，我的测试都会在加载 Modernizr 时崩溃，并显示以下错误消息。这似乎是因为 Modernizr 依赖于在浏览器内部运行，但我的单元测试需要在命令行上运行。

/lib/modernizr.js:8

"MozAppearance"in l.style,s=r&&!!b.createRange().compareNode,t=s?l:n.parentNod ^类型错误:无法读取未定义的属性“parentNode” 在/Users/devadmin/devenv/djscript/djscript-vendor/lib/modernizr.js:8:6291

我有一些 requirejs 模块，它们位于以下层次结构中:

lib
└── pj
    ├── module
    │   └── header
    │       └── header.js
    ├── util
    │   └── header
    │       └── Util.js
    └── widget
        └── header
            ├── Header.js
            └── view
                ├── HeaderView.js
                └── NavView.js

header.js 实例化 Header.js，后者又创建一个 HeaderView 和一个 NavView。只有 HeaderView 需要 Modernizr。

关于如何使此代码进入可测试状态的任何提示？看看我如何打包 Modernizr 以便与 requirejs 一起使用会有所帮助吗？

Answer 1

好吧，我没有专门使用 Mocha，但您应该能够通过执行类似...的操作在您的测试/工具中创建一个伪造的 Modernizr 实例

define(<module path/name - e.g. 'libs/modernizr'>, function(){
    return {
        history: false,
        foo: true,
        bar: false
    };
});

...在您尝试加载被测模块之前。定义了该假实例后，您的被测模块应该使用假实例而不是实际的 modernizr 库。

您基本上是在劫持 AMD 的“命名模块”(链接:http://requirejs.org/docs/api.html#modulename)功能，以用您的假冒产品替换真正的 modernizr。通过这种方式，您可以显式测试您需要的任何状态。

希望对您有所帮助!