I test Jasmine passano in Chrome e Firefox ma falliscono con PhantomJS

Question

Sto costruendo un'applicazione di blogging di base con React. Sto usando Jasmine e Karma per eseguire i miei test di front end. Ho ottenuto il mio primo test in esecuzione e passa in Chrome (Chromium) e Firefox, ma quando viene eseguito in PhantomJS ottengo il seguente errore:

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 

mio file di prova è simile al seguente:

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') 
    }); 

    }); 

Ho provato a eliminare i miei node_modules e la cache npm è stata cancellata e npm install, ma non è stata riparata. Non sono sicuro di come potrebbero passare i miei test in Firefox e Chrome, ma non in PhantomJS. Puoi vedere il progetto completo qui: https://github.com/mrbgit/short-stories. Fammi sapere se ci sono altre informazioni che potrebbero aiutarti. Qualsiasi aiuto è apprezzato. Grazie!

Answer 1

PhantomJS utilizza una versione piuttosto vecchia di Qt-Webkit che non fornisce Function.prototype.bind. Questo è un problema per molte librerie, quindi è disponibile un polyfill NPM module called 'phantomjs-polyfill'.

Se preferisci non utilizzare i moduli NPM (se stai testando un sito browser che non è stato associato a browserify/webpack), il seguente polyfill per bind viene fornito nella pagina MDN e puoi allegarlo te stesso:

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; 
    }; 
}