Better error message for renderComponentToString()

Reported on Twitter by AirBnb (who are integrating React into their open-source JS framework). They made a mistake and passed a string in as the
component. We should have a better error message for that.

Author: petehunt

src/environment/ReactServerRendering.js

@@ -18,17 +18,31 @@
  */
 "use strict";
 
+var ReactComponent = require('ReactComponent');
+var ReactInstanceHandles = require('ReactInstanceHandles');
 var ReactMarkupChecksum = require('ReactMarkupChecksum');
 var ReactReconcileTransaction = require('ReactReconcileTransaction');
-var ReactInstanceHandles = require('ReactInstanceHandles');
+
+var invariant = require('invariant');
 
 /**
- * @param {object} component
+ * @param {ReactComponent} component
  * @param {function} callback
  */
 function renderComponentToString(component, callback) {
   // We use a callback API to keep the API async in case in the future we ever
   // need it, but in reality this is a synchronous operation.
+
+  invariant(
+    ReactComponent.isValidComponent(component),
+    'renderComponentToString(): You must pass a valid ReactComponent.'
+  );
+
+  invariant(
+    typeof callback === 'function',
+    'renderComponentToString(): You must pass a function as a callback.'
+  );
+
   var id = ReactInstanceHandles.createReactRootID();
   var transaction = ReactReconcileTransaction.getPooled();
   transaction.reinitializeTransaction();

src/environment/__tests__/ReactServerRendering-test.js

@@ -228,4 +228,28 @@ describe('ReactServerRendering', function() {
     ReactTestUtils.Simulate.click(instance.refs.span.getDOMNode());
     expect(numClicks).toEqual(1);
   });
+
+  it('should throw with silly args', function() {
+    expect(
+      ReactServerRendering.renderComponentToString.bind(
+        ReactServerRendering,
+        'not a component',
+        function() {}
+      )
+    ).toThrow(
+      'Invariant Violation: renderComponentToString(): You must pass ' +
+      'a valid ReactComponent.'
+    );
+
+    expect(
+      ReactServerRendering.renderComponentToString.bind(
+        ReactServerRendering,
+        React.DOM.div(),
+        'not a function'
+      )
+    ).toThrow(
+      'Invariant Violation: renderComponentToString(): You must pass ' +
+      'a function as a callback.'
+    );
+  });
 });