javascript 从节点使用 mocha js 中的全局窗口变量

Working with global window variable in mocha js from node

提问by ivan

I am new to js unit testing and I am trying to use mocha for my backbone contact manager tutorial that i found at this github repo. However, i have a global window.ContactManager variable that I firsted wanted to test whether it exists and then test the router.on functionality inside the start function later. The variable looks like so:

我是 js 单元测试的新手，我正在尝试将 mocha 用于我在此 github repo 中找到的主干联系人管理器教程。但是，我有一个全局 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
      });
.....

My test that does not work: var expect = require ('chai').expect;

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

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

How do I test and access a global window variable existence in mocha from running the tests in the console?

如何通过在控制台中运行测试来测试和访问 mocha 中存在的全局窗口变量？

采纳答案by Louis

You are ignoring the difference between running JavaScript code in the browser and running JavaScript code in Node.

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

In the browser, the windowname is a reference to the object which holds all your global variables. So when you do foo = 1in the outermost scope, you declare a global foo, which is also accessible as window.foo. Conversely, if you assign a new field like this: window.bar = 1, then you have a new global called bar.

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

In Node, your global object is accessed as global. So if you do foo = 1in the outermost scope, foois also accessible as global.foo. And if you do global.bar = 1, you have a new global named bar.

在 Node 中，您的全局对象作为global. 所以如果你foo = 1在最外层范围内做，foo也可以作为global.foo. 如果你这样做了global.bar = 1，你就有了一个名为bar.

Your code shows that you modify a windowobject, which does not appear to be a reference to the global object. Options:

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

1. Run Mocha in the browser instead of in Node. See Mocha's documentation.

2. Set your Node environment so that it mimics enough of a browser environment to satisfy node. Setting a global windowvariable to be a equal to globalmightbe enough but I don't know Backbone enough to know whether Backbone will be happy with this.

3. Run your Backbone-based code in jsdom. Jsdom provides realistic windowand document, as if your code was running in a browser, but it has its limits. I don't know whether Backbone would be happy with those limits.

1. 在浏览器中运行 Mocha，而不是在 Node 中运行。请参阅Mocha 的文档。

2. 设置您的 Node 环境，使其模仿足够多的浏览器环境来满足 node.js 的需求。将全局window变量设置为等于global可能就足够了，但我对 Backbone 的了解不够了解 Backbone 是否会对此感到满意。

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

回答by Ser

Another solution would be to use https://www.npmjs.com/package/window-or-global

另一种解决方案是使用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. 

To install, run npm install --save window-or-global.

要安装，请运行npm install --save window-or-global.

Running tests on server (for example with mocha-webpack) is way more faster than in a browser.

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