question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

"React.createElement: type is invalid" after upgrading to 5.0

See original GitHub issue

Code works fine with version 4.1.3, but raises an error in 5.0:

Warning: React.createElement: type is invalid -- expected a string (for built-in components) or a class/function (for composite components) but got: object.

Check the render method of `ThumbnailImage`.
    in ThumbnailImage (created by ThumbnailColumn)
    in div (created by ThumbnailColumn)
    in div (created by Box)
    in Box (created by withHelpersModifiers(Box))
    in withHelpersModifiers(Box) (created by ThumbnailColumn)
    in div (created by ThumbnailColumn)
    in ThumbnailColumn (created by Connect(ThumbnailColumn))
    in Connect(ThumbnailColumn) (created by AssetPage)
    in div (created by AssetPage)
    in div (created by AssetPage)
    in AssetPage (created by Route)
    in Route (created by App)
    in div (created by App)
    in Router (created by ConnectedRouter)
    in ConnectedRouter (created by App)
    in App
    in Provider

Using Electron 1.8.8 (Node.js v8.2.1), react(-dom) 16.6.3. Code looks like this:

    const figure = (<div>hello</div>)
    return React.createElement(VisibilitySensor, {
      onChange: this.onVisibilityChange,
      partialVisibility: true
    }, figure)

I substituted the example from the README, but that didn’t make a difference.

Issue Analytics

  • State:open
  • Created 5 years ago
  • Reactions:3
  • Comments:7

github_iconTop GitHub Comments

6reactions
markuskrcommented, Nov 17, 2018

One change from 4.1.X to 5.0.0 was the way VisibilitySensor is exported. In 5.0.0 the class is exported as default:

export default class VisibilitySensor extends React.Component {

Does it work for you if you change your import to: const VisibilitySensor = require('react-visibility-sensor').default?

0reactions
LeonBorWorkcommented, Jun 20, 2019

I had to switch from

import * as VisibilitySensor from "react-visibility-sensor";

to

import VisibilitySensor from "react-visibility-sensor";

works fine now

Read more comments on GitHub >

github_iconTop Results From Across the Web

React.createElement: type is invalid -- expected a string
My solution to this problem was to upgrade react and react-dom to their latest versions on NPM. Apparently I was importing a Component...
Read more >
React.createElement: type is invalid -- expected a string (for ...
Warning: React.createElement: type is invalid -- expected a string (for built-in components) after update from 5.0.6 #1666.
Read more >
Error React createElement type is invalid expected a string for ...
Error React createElement type is invalid expected a string for built-in components or a class function for composite components but got object.
Read more >
React.createElement: type is invalid — expected a string
The error is happening when you are creating a new element – in this case initiantiating your custom component using createElement. The actual ......
Read more >
(React) Element type is invalid, expected a string (for built in ...
Mixing up default and named imports when importing a component. · Forgetting to export a component from a file. · Incorrectly defining a...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found