Jasmine测试通过了Chrome和Firefox，但是没有使用PhantomJS [英] Jasmine tests pass in Chrome and Firefox but fail with PhantomJS

问题描述

我正在使用React构建一个基本的博客应用程序。我正在使用Jasmine和Karma来进行我的前端测试。我开始运行第一个测试并通过Chrome（Chromium）和Firefox，但是当它在PhantomJS中运行时，我收到以下错误：

I am building a basic blogging app with React. I am using Jasmine and Karma to run my front end tests. I got my first test up and running and it passes in Chrome (Chromium) and Firefox, but when it runs in PhantomJS I get the following error:

PhantomJS 1.9.8 (Linux 0.0.0) ERROR
  TypeError: 'undefined' is not a function (evaluating 'ReactElementValidator.createElement.bind(
          null,
          type
        )')
  at /home/michael/repository/short-stories/test/karma_tests/story_test.js:1742

我的测试文件如下所示：

My test file looks like this:

var React = require('react/addons');
var Story = require('../../app/js/components/story.jsx');
var TestUtils = React.addons.TestUtils;
var testUtilsAdditions = require('react-testutils-additions');

  describe('Story component', function () {
    var component;

    beforeEach(function () {
      component = TestUtils.renderIntoDocument(React.createElement('story'));
      component.props.storyTitle = 'front end test title';
      component.props.author = 'front end author';
      component.props.storyText = 'front end story text';
    });

    it('should display a story', function () {
      expect(component.props).toBeDefined();
      expect(component.props.storyTitle).toBeDefined();
      expect(component.props.storyTitle).toBe('front end test title');
      expect(component.props.author).toBe('front end author');
      expect(component.props.storyText).toBe('front end story text')
    });

  });

我尝试删除我的node_modules，npm缓存清除和npm安装，但它没有修复它。我不确定我的测试如何在Firefox和Chrome中传递，但不能在PhantomJS中传递。您可以在此处查看完整项目： https://github.com/mrbgit/short-stories 。如果有更多信息可以提供帮助，请告诉我。任何帮助表示赞赏。谢谢！

I tried deleting my node_modules, and the npm cache clear and npm install, but it didn't fix it. I'm not sure how my tests could pass in Firefox and Chrome, but not in PhantomJS. You can see the full project here: https://github.com/mrbgit/short-stories . Let me know if there's any more info that could help. Any help is appreciated. Thanks!

推荐答案

PhantomJS使用的是一个相当旧版本的Qt-Webkit，它不提供 Function.prototype.bind 。对于许多库来说这是一个问题，因此 polyfill NPM模块称为'phantomjs-polyfill'可用。

PhantomJS uses a rather old version of Qt-Webkit that does not provide Function.prototype.bind. This is a problem for a lot of libraries, so a polyfill NPM module called 'phantomjs-polyfill' is available.

如果您不想使用NPM模块（如果您正在测试未与browserify / webpack捆绑在一起的浏览器站点）， MDN页面上提供了以下 bind 的polyfill，您可以自己附加：

If you'd rather not use NPM modules (if you're testing a browser site that hasn't been bundled with browserify/webpack), the following polyfill for bind is provided on the MDN page and you can attach it yourself:

if (!Function.prototype.bind) {
  Function.prototype.bind = function(oThis) {
    if (typeof this !== 'function') {
      // closest thing possible to the ECMAScript 5
      // internal IsCallable function
      throw new TypeError('Function.prototype.bind - what is trying to be bound is not callable');
    }

    var aArgs   = Array.prototype.slice.call(arguments, 1),
        fToBind = this,
        fNOP    = function() {},
        fBound  = function() {
          return fToBind.apply(this instanceof fNOP
                 ? this
                 : oThis,
                 aArgs.concat(Array.prototype.slice.call(arguments)));
        };

    fNOP.prototype = this.prototype;
    fBound.prototype = new fNOP();

    return fBound;
  };
}

这篇关于Jasmine测试通过了Chrome和Firefox，但是没有使用PhantomJS的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！