在节点的 mocha js 中使用全局 window 变量

Working with global window variable in mocha js from node

我是 js 单元测试的新手,我正在尝试将 mocha 用于我在 this github repo 找到的 backbone 联系人管理器教程。但是,我有一个全局 window.ContactManager 变量,我首先想测试它是否存在,然后稍后在 start 函数中测试 router.on 功能。变量看起来像这样:

  window.ContactManager = {
  Models: {},
  Collections: {},
  Views: {},

  start: function(data) {
    var contacts = new ContactManager.Collections.Contacts(data.contacts),
        router = new ContactManager.Router();

    router.on('route:home', function() {
      router.navigate('contacts', {
        trigger: true,
        replace: true
      });
    });

    router.on('route:showContacts', function() {
      var contactsView = new ContactManager.Views.Contacts({
        collection: contacts
      });
.....

我的测试不起作用: var expect = require ('chai').expect;

describe("Application", function() {
    it('creates a global variable for the name space ContactManager' , function () {
        expect(ContactManager).to.exist;
    })
});

如何从控制台中的 运行 测试测试和访问 mocha 中存在的全局 window 变量?

您忽略了浏览器中的 运行 JavaScript 代码与 Node 中的 运行 JavaScript 代码之间的区别。

在浏览器中,window 名称是对保存所有全局变量的对象的引用。因此,当您在最外层范围内执行 foo = 1 时,您声明了一个全局 foo,它也可以作为 window.foo 访问。相反,如果您像这样分配一个新字段:window.bar = 1,那么您就有了一个名为 bar.

的新全局变量

在 Node 中,您的全局对象被访问为 global。因此,如果您在最外层范围内执行 foo = 1,则 foo 也可以作为 global.foo 访问。如果你这样做 global.bar = 1,你就有了一个名为 bar.

的新全局

您的代码显示您修改了一个 window 对象,该对象似乎不是对全局对象的引用。选项:

  1. 运行 Mocha 在浏览器中而不是在 Node 中。见 Mocha's documentation.

  2. 设置您的 Node 环境,使其模仿足够的浏览器环境来满足 node.js 的要求。将全局 window 变量设置为等于 global 可能 就足够了,但我不知道 Backbone 是否足以知道 Backbone 会很高兴的。

  3. 运行 jsdom 中基于 Backbone 的代码。 Jsdom 提供逼真的 windowdocument,就好像您的代码在浏览器中是 运行 一样,但它有其局限性。我不知道 Backbone 是否会对这些限制感到满意。

另一个解决方案是使用 https://www.npmjs.com/package/window-or-global

import React, { Component } from 'react'
// in node, you'll get the global object instead of crashing by an error 
import root from 'window-or-global'

class MyComponent extends Component {

  // this method is only invoked in the browser environment 
  componentDidMount() {
    root.addEventListener(/*...*/)
  }

  componentWillUnmount() {
    root.addEventListener(/*...*/)
  }

  render() {}

}

// Voilà. Enjoy your universal react component! ;) 
// No more 'window is not defined' errors when you render your component 
// on server side. 

要安装,运行 npm install --save window-or-global

运行 在服务器上的测试(例如使用 mocha-webpack)比在浏览器中快得多。