Skip to content

Instantly share code, notes, and snippets.

@piecyk
Last active October 9, 2015 13:28
Show Gist options
  • Select an option

  • Save piecyk/734ccc4c7ba04778053d to your computer and use it in GitHub Desktop.

Select an option

Save piecyk/734ccc4c7ba04778053d to your computer and use it in GitHub Desktop.
Log render function of ReactJS
// replace the _renderValidatedComponent in react-0.14.0.js with this function
_renderValidatedComponent: function () {
// orginal function
function renderValidatedComponent() {
var renderedComponent;
ReactCurrentOwner.current = this;
try {
renderedComponent = this._renderValidatedComponentWithoutOwnerOrContext();
} finally {
ReactCurrentOwner.current = null;
}
!(
// TODO: An `isValidNode` function would probably be more appropriate
renderedComponent === null || renderedComponent === false || ReactElement.isValidElement(renderedComponent)) ? process.env.NODE_ENV !== 'production' ? invariant(false, '%s.render(): A valid ReactComponent must be returned. You may have ' + 'returned undefined, an array or some other invalid object.', this.getName() || 'ReactCompositeComponent') : invariant(false) : undefined;
return renderedComponent;
}
//NOTE!!! custom code
if (process.env.NODE_ENV !== 'production') {
var whatToLog = (localStorage.getItem('log-components') || '').split(',');
var name = this.getName();
if (name && !name.match(/^ReactDOM/) && whatToLog[0] === 'All' ? true : whatToLog.indexOf(name) > -1) {
console.debug("render: ", name, {props: this._instance.props, state: this._instance.state});
}
return renderValidatedComponent.apply(this, arguments);
} else {
return renderValidatedComponent.apply(this, arguments);
}
},
@piecyk

piecyk commented Oct 8, 2015

Copy link
Copy Markdown
Author

in local storage, just put names of components you want to log
log-components: Component1,Component2
if you decide to log all app render functions, just add on first place All then it will log every render log-components: All,Component1,Component2

source form:
http://stackoverflow.com/questions/30445568/react-js-modify-render-method-for-all-components

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment