Sinon.js - Stub Reagieren Komponente Funktion vor der Komponente instanziiert wird?

Question

Lassen Sie uns sagen, dass ich eine Komponente haben, die wie folgt aussieht:

var React = require('react/addons'); 

var ExampleComponent = React.createClass({ 
    test : function() { 
     return true; 
    }, 
    render : function() { 
     var test = this.test(); 
     return (
      <div className="test-component"> 
       Test component - {test} 
      </div> 
     ); 
    } 
}); 

module.exports = ExampleComponent; 

In meinem Test habe ich diese Komponente TestUtils mit machen könnte, dann Stummel des Verfahrens wie folgt:

var renderedComponent = TestUtils.renderIntoDocument(<ExampleComponent/>); 
sinon.stub(renderedComponent, 'test').returns(false); 
expect(renderedComponent.test).toBe(false); //passes 

Aber gibt es Eine Möglichkeit, wie ich Sinon sagen könnte, die Funktion einer Komponente automatisch auszugeben, wenn eine Instanz dieser Komponente erstellt wird? Bsp .:

Wenn dies nicht möglich ist, gibt es eine mögliche Lösung, die der gewünschten Funktionalität nahe kommt?

Answer 1

Ich fand eine Lösung für mein Problem.

Um zu verdeutlichen, mein Problem ist, dass ich Funktionen auszugeben wollte, die zu untergeordneten Komponenten gehören, die unter einer übergeordneten Komponente gerendert werden. So etwas wie folgt aus:

parent.js

var Child = require('./child.js'); 
var Parent = React.createClass({ 
    render : function() { 
     return (
      <div className="parent"> 
       <Child/> 
      </div> 
     ); 
    } 
}); 
module.exports = Parent; 

child.js

var Child = React.createClass({ 
    test : function() { 
     return true; 
    }, 
    render : function() { 
     if (this.test) { 
      throw('boom'); 
     } 
     return (
      <div className="child"> 
       Child 
      </div> 
     ); 
    } 
}); 
module.exports = Child; 

Wenn ich TestUtils verwenden Eltern in einem meiner Tests zu machen, wäre es Wirf den Fehler, den ich vermeiden wollte. Mein Problem war also, dass ich die Funktion test von Child ausstechen musste, bevor sie instanziiert wurde. Wenn ich dann Parent rendere, wird Child nicht explodieren.

Die angegebene Antwort funktionierte nicht ganz, da Parent require() verwendet, um Childs Konstruktor zu erhalten. Ich bin mir nicht sicher, warum, aber aus diesem Grund kann ich nicht Stub Kinder Prototyp in meinem Test und erwarten, dass der Test bestehen, etwa so:

var React = require('react/addons'), 
    TestUtils = React.addons.TestUtils, 
    Parent = require('./parent.js'), 
    Child = require('./child.js'), 
    sinon = require('sinon'); 

describe('Parent', function() { 
    it('does not blow up when rendering', function() { 
     sinon.stub(Child.prototype, 'test').returns(false); 
     var parentInstance = TestUtils.renderIntoDocument(<Parent/>); //blows up 
     expect(parentInstance).toBeTruthy(); 
    }); 
}); 

konnte ich eine Lösung finden, die passen meine braucht aber. Ich wechselte mein Testframework von Mocha zu Jasmine, und ich fing an, jasmine-react zu verwenden, was mehrere Vorteile bot, einschließlich der Fähigkeit, eine Funktion einer Klasse auszugeben, bevor sie instanziiert wird. Hier ist ein Beispiel für eine funktionierende Lösung:

Ich hoffe, das hilft jemand anderem mit einem ähnlichen Problem. Wenn jemand irgendwelche Fragen hat, würde ich froh sein zu helfen.

Answer 2

Sie müssen die ExampleComponent.prototype anstelle von überschreiben. ist ein Konstruktor. Lokale Methoden wie test() sind in der prototype gespeichert.

sinon.stub(ExampleComponent.prototype, 'test').returns(false); 
var renderedComponent = TestUtils.renderIntoDocument(<ExampleComponent/>); 
expect(renderedComponent.test).toBe(false); //passes