Provide a better message when component type is undefined with SSR

[lukasborawski]

This might be a reference to this one: #10212 (comment)

The problem still exist.

So, trying to render with server side and got this error. I don't have this notation in my code but this might be a problem with dependencies.

TypeError: Cannot read property 'toLowerCase' of undefined
    at ReactDOMServerRenderer.renderDOM (/Users/lukasborawski/Dev/web-client/node_modules/react-dom/cjs/react-dom-server.node.development.js:2304:27)
...

"react": "^16.1.1",
"react-dom": "^16.2.0",

Thx for help.

[aweary]

@lukasborawski you should be running the same versions of react and react-dom. Using two different versions (especially minor or major versions) can lead to unexpected behavior. Can you try updating react to 16.2.0 and see if your issue persists?

Otherwise, we'll need an example that reproduces the issue so we can investigate it.

Thanks!

[trebushchuk]

Have a same issue.

TypeError: Cannot read property 'toLowerCase' of undefined
    at a.renderDOM (/home/{username}/Workspace/{project}/node_modules/react-dom/cjs/react-dom-server.node.production.min.js:36:420)

In the first argument of renderDOM is passed this kind object:

{ '$$typeof': Symbol(react.element),
  type: undefined,
  key: null,
  ref: null,
  props: {},
  _owner: null }

Versions of react and react-dom was same. I have updated both of it and nothing changed.

-    "react": "^16.0.0",
+    "react": "^16.2.0",

-    "react-dom": "^16.0.0",
+    "react-dom": "^16.2.0",

[gaearon]

Please provide a reproducing project. We can’t help otherwise.

[gaearon]

(My best guess is you imported a component incorrectly and thus ended up with undefined as a type. We should change to throw a better error when this happens.)

[trebushchuk]

@gaearon This project that should reproduce the issue
https://github.com/trebushuk/test-react-project
I tryed on the versions of node v6.12.2 & v9.3.0

[lukasborawski]

@aweary @gaearon @trebushuk I've updated the react version to 16.2 and still have this issue. Looked up for components imports and all looks fine, typical and normal. Can't share the project bc this one is customers private. Any other ideas?

[yerlanyr]

That project should reproduce the issue. https://github.com/yerlanyr/reactrouterserver
Text of error when version 15.6.2

Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in. Check the render method of `AppRoot`.
    at invariant (C:\Data\FrontendProjects\reactrouterserver\node_modules\fbjs\lib\invariant.js:42:15)
    at instantiateReactComponent (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\instantiateReactComponent.js:72:56)
    at instantiateChild (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\ReactChildReconciler.js:42:28)
    at C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\ReactChildReconciler.js:69:16
    at traverseAllChildrenImpl (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\traverseAllChildren.js:75:5)
    at traverseAllChildren (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\traverseAllChildren.js:170:10)
    at Object.instantiateChildren (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\ReactChildReconciler.js:68:7)
    at ReactDOMComponent._reconcilerInstantiateChildren (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\ReactMultiChild.js:183:41)
    at ReactDOMComponent.mountChildren (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\ReactMultiChild.js:222:27)
    at ReactDOMComponent._createContentMarkup (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\lib\ReactDOMComponent.js:657:32)

Text of error when 16.2.0

TypeError: Cannot read property 'toLowerCase' of undefined
    at ReactDOMServerRenderer.renderDOM (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\cjs\react-dom-server.node.development.js:2304:27)
    at ReactDOMServerRenderer.render (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\cjs\react-dom-server.node.development.js:2298:21)
    at ReactDOMServerRenderer.read (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\cjs\react-dom-server.node.development.js:2234:19)
    at Object.renderToString (C:\Data\FrontendProjects\reactrouterserver\node_modules\react-dom\cjs\react-dom-server.node.development.js:2501:25)
    at C:\Data\FrontendProjects\reactrouterserver\babel\server.js:32:33
    at Layer.handle [as handle_request] (C:\Data\FrontendProjects\reactrouterserver\node_modules\express\lib\router\layer.js:95:5)
    at next (C:\Data\FrontendProjects\reactrouterserver\node_modules\express\lib\router\route.js:137:13)
    at Route.dispatch (C:\Data\FrontendProjects\reactrouterserver\node_modules\express\lib\router\route.js:112:3)
    at Layer.handle [as handle_request] (C:\Data\FrontendProjects\reactrouterserver\node_modules\express\lib\router\layer.js:95:5)
    at C:\Data\FrontendProjects\reactrouterserver\node_modules\express\lib\router\index.js:281:22

[lukasborawski]

For me this was a problem with ServerRouter, changed to the StaticRouter and everything is fine now. Should i close the issue?

[gaearon]

We should probably provide a better error message if component type is undefined.