Better error for invalid element when shallow rendering

Fixes facebook#4721, fixes facebook#4730.

Author: sophiebits

src/test/ReactTestUtils.js

@@ -396,6 +396,22 @@ assign(
 );
 
 ReactShallowRenderer.prototype.render = function(element, context) {
+  invariant(
+    ReactElement.isValidElement(element),
+    'ReactShallowRenderer render(): Invalid component element.%s',
+    typeof element === 'function' ?
+      ' Instead of passing a component class, make sure to instantiate ' +
+      'it by passing it to React.createElement.' :
+      ''
+  );
+  invariant(
+    typeof element.type !== 'string',
+    'ReactShallowRenderer render(): Shallow rendering works only with custom ' +
+    'components, not primitives (%s). Instead of calling `.render(el)` and ' +
+    'inspecting the rendered output, look at `el.props` directly instead.',
+    element.type
+  );
+
   if (!context) {
     context = emptyObject;
   }

src/test/__tests__/ReactTestUtils-test.js

@@ -53,6 +53,27 @@ describe('ReactTestUtils', function() {
     ]);
   });
 
+  it('should throw for invalid elements', function() {
+    var SomeComponent = React.createClass({
+      render: function() {
+        return <div />;
+      },
+    });
+
+    var shallowRenderer = ReactTestUtils.createRenderer();
+    expect(() => shallowRenderer.render(SomeComponent)).toThrow(
+      'Invariant Violation: ReactShallowRenderer render(): Invalid component ' +
+      'element. Instead of passing a component class, make sure to ' +
+      'instantiate it by passing it to React.createElement.'
+    );
+    expect(() => shallowRenderer.render(<div />)).toThrow(
+      'Invariant Violation: ReactShallowRenderer render(): Shallow rendering ' +
+      'works only with custom components, not primitives (div). Instead of ' +
+      'calling `.render(el)` and inspecting the rendered output, look at ' +
+      '`el.props` directly instead.'
+    );
+  });
+
   it('should have shallow unmounting', function() {
     var componentWillUnmount = mocks.getMockFunction();