Jasmine to spyon React component's methods - reactjs

Question

I have a React component class with a couple of methods -
var testClass = React.createClass({
testMethod: function(){//do something
}
componentDidMount: function(){
this.testMethod();
}
render: function() {
...
}
});
I am trying to add a unit test using jasmine
import TestClass from './testClass';
describe('test functions', () => {
'use strict';
spyOn(TestClass.prototype, 'testMethod');
it('test calls testMethod', () => {
component = TestUtils.renderIntoDocument(<TestClass />);
expect(TestClass.prototype.testMethod).toHaveBeenCalled();
});
I can see in the debugger that the testMethod is really getting called but jasmine reports "Expected spy testMethod to have been called."

Answer 1

React v0.14.2, createClass maintains an object map of defined methods in __reactAutoBindMap and reuses this map to rebind the methods to the component in the the private constructor for the component.
This behavior can be worked around in the tests by resetting this map to an empty object, forcing the constructor to skip this map and use the replacement spy.
function mockComponentMethod(component, method) {
const boundMethod = method.bind(component)
component.prototype.__reactAutoBindMap = {};
component.prototype[method.name] = boundMethod;
return boundMethod;
}
The test to check that the spy was called can be written as follows:
const testMethodSpy = spyOn(TestClass.prototype, 'testMethod');
mockComponentMethod(TestClass, testMethodSpy);
expect(testMethodSpy).toHaveBeenCalled();