Devextreme-reactive: Failed prop type: Invalid prop `*` of type `object` supplied to `*`, expected `function`.

Created on 21 Dec 2018  路  17Comments  路  Source: DevExpress/devextreme-reactive

using these packages:

"@devexpress/dx-react-core": "^1.9.1",
"@devexpress/dx-react-grid": "^1.9.1",
"@devexpress/dx-react-grid-material-ui": "^1.9.1", 
"@material-ui/core": "^3.7.0",
"@material-ui/icons": "^3.0.1",
"@material-ui/styles": "^3.0.0-alpha.4",
"react": "^16.7.0-alpha.2",
"react-dom": "^16.7.0-alpha.2",

when trying to show a simple table

<Grid rows={rows} columns={columns}>
  <Table/>
  <TableHeaderRow/>
</Grid>

i get these warnings to the console...

Warning: Failed prop type: Invalid prop `rootComponent` of type `object` supplied to `Grid`, expected `function`.
Warning: Failed prop type: Invalid prop `rootComponent` of type `object` supplied to `GridCore`, expected `function`.
Warning: Failed prop type: Invalid prop `tableComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `headComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `bodyComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `footerComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `containerComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `cellComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `noDataCellComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `stubCellComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `stubHeaderCellComponent` of type `object` supplied to `Table`, expected `function`.
Warning: Failed prop type: Invalid prop `cellComponent` of type `object` supplied to `TableHeaderRow`, expected `function`.
Warning: Failed prop type: Invalid prop `contentComponent` of type `object` supplied to `TableHeaderRow`, expected `function`.
Warning: Failed prop type: Invalid prop `titleComponent` of type `object` supplied to `TableHeaderRow`, expected `function`.
Warning: Failed prop type: Invalid prop `sortLabelComponent` of type `object` supplied to `TableHeaderRow`, expected `function`.
Warning: Failed prop type: Invalid prop `groupButtonComponent` of type `object` supplied to `TableHeaderRow`, expected `function`.
Warning: Failed prop type: Invalid prop `containerComponent` of type `object` supplied to `StaticTableLayout`, expected `function`.
Warning: Failed prop type: Invalid prop `tableComponent` of type `object` supplied to `StaticTableLayout`, expected `function`.
Warning: Failed prop type: Invalid prop `headComponent` of type `object` supplied to `StaticTableLayout`, expected `function`.
Warning: Failed prop type: Invalid prop `bodyComponent` of type `object` supplied to `StaticTableLayout`, expected `function`.
Warning: Failed prop type: Invalid prop `bodyComponent` of type `object` supplied to `StaticTableLayout`, expected `function`.
Warning: Failed prop type: Invalid prop `blockComponent` of type `object` supplied to `RowsBlockLayout`, expected `function`.

the table renders well*

question

All 17 comments

I meet the same problem.

"@devexpress/dx-react-core": "^1.9.1",
"@devexpress/dx-react-grid": "^1.9.1",
"@devexpress/dx-react-grid-material-ui": "^1.9.1",
"@material-ui/core": "^3.7.0",
"@material-ui/icons": "^3.0.1",
"@material-ui/styles": "^3.0.0-alpha.4",
"react": "^16.7.0-alpha.2",
"react-dom": "^16.7.0-alpha.2",

Hi,

I can't reproduce it. Could you please update my example to reproduce the incorrect behavior?

I'm also experiencing this with React 16.7.0. I dont think it matters, but the code is also nested under a apollo-boost Query component and wrapped in a graphql() HOC.

<Grid rows={data.items.data} columns={this.state.columns}>
  <PagingState
    currentPage={0}
    onCurrentPageChange={this.changeCurrentPage}
    pageSize={2}
  />
  <CustomPaging totalCount={data.items.count} />
  <Table />
  <TableHeaderRow />
  <PagingPanel />
</Grid>

@MaximKudriavtsev The problem disappears when I remove my React.lazy / Suspense code in my application.

I was unable to duplicate it here though, so maybe it has something to do with other contexts / components up the tree.

For reference, these are my dependencies:

"dependencies": {
    "@devexpress/dx-core": "1.10.0",
    "@devexpress/dx-grid-core": "1.10.0",
    "@devexpress/dx-react-core": "1.10.0",
    "@devexpress/dx-react-grid": "1.10.0",
    "@devexpress/dx-react-grid-material-ui": "1.10.0",
    "@material-ui/core": "3.7.1",
    "@material-ui/icons": "3.0.1",
    "@material-ui/styles": "3.0.0-alpha.4",
    "apollo-boost": "0.1.23",
    "formik": "1.4.1",
    "graphql": "14.0.2",
    "query-string": "6.2.0",
    "react": "16.7.0",
    "react-apollo": "2.3.3",
    "react-dom": "16.7.0",
    "react-router-dom": "4.4.0-beta.6",
    "react-scripts": "2.1.2",
    "typeface-roboto": "0.0.54"
  },

I'm running into this same issue.

Hi @rwoody,

I can't reproduce this behavior. Could you please create a simple repository that reproduces the warnings above? We will investigate this problem and try to resolve it.

I will try soon.

We are closing the issue due to inactivity. Feel free to reopen it if you need further assistance.

Have the same problem. I am using new material-ui styles solution which uses call of React.forwardRef as result of withStyles function check here. And result of forwardRef is an object

Have the same problem. I am using new material-ui styles solution which uses call of React.forwardRef as result of withStyles function check here. And result of forwardRef is an object

Running into the same problem here. I agree with all @evgsil has said. I guess you could just update the propTypes into PropTypes.oneOfType([PropTypes.func, PropTypes.object]).

Hi @evgsil, @ajcatarina,

I tried to use new material-ui styles solutions and all works fine on my side. Please update my example to reproduce the issue

This is not actual any more after 1.10.2 release and this PR #1832. Basically prop-types were removed.
Here is reproduce with 1.10.1

Thanks @MaximKudriavtsev. I updated to 1.10.5

So, I'm getting 57 errors of this type everytime I open the page with the Scheduler component. I'm doing a basic implementation with all the plugins, and these are my dependencies:

"dependencies": {
    "@devexpress/dx-react-core": "^1.11.0",
    "@devexpress/dx-react-scheduler": "^1.11.0",
    "@devexpress/dx-react-scheduler-material-ui": "^1.11.0",
    "@material-ui/core": "^4.1.0",
    "@material-ui/icons": "^4.1.0",
    "classnames": "^2.2.6",
    "contentful": "^7.7.0",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-redux": "^7.1.0",
    "react-router-dom": "^5.0.1",
    "react-scripts": "^3.0.1",
    "redux": "^4.0.1"
  }

Could you check if this problem returned in one of the last updates?

Hi @mateuswolkmer,

As you can see, this basic demo has no warnings listed above. Please pay special attention to your imports section.

BTW we don't support Material-UI v4+ yet, however, we are currently working on this point. For now, you need to install v3.9.3.

Oh, that must be because of the Material-UI version then. I can`t downgrade it in my project because I use some v4 features already. Seems like I will have to live with the warnings for a while. I will follow the v4 support thread, thank you @MaximKudriavtsev.

This thread has been automatically locked since it is closed and there has not been any recent activity. Please open a new issue for related bugs or feature requests.

Was this page helpful?
0 / 5 - 0 ratings