molgenis / molgenis-frontend

Frontend code for MOLGENIS
GNU Lesser General Public License v3.0
6 stars 12 forks source link

Table.js gives warning in developer console #247

Open tommydeboer opened 9 years ago

tommydeboer commented 9 years ago

Reproduce:

  1. Open Data Explorer
  2. Check developer console

    Expected:

A console free of imperfections.

Actual:

Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of TableCell. See https://fb.me/react-warning-keys for more information.

dennishendriksen commented 9 years ago

Cannot reproduce in 1.9, which entity did you select or was pre-selected?

tommydeboer commented 9 years ago

These warnings are only shown in development mode. I believe it only happens when there are multiple pages of data.

mark-de-haan commented 6 years ago

V5: unique key prop warning is no longer present

dennishendriksen commented 6 years ago

/menu/main/dataexplorer?entity=it_emx_datatypes_TypeTest:

molgenis-vendor-bundle.js:13635 Warning: Popover: prop type `animation` is invalid; it must be a function, usually from React.PropTypes.
warning @ warning.js:48
molgenis-vendor-bundle.js:13635 Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of TableCell. See https://fb.me/react-warning-keys for more information.
warning @ warning.js:48
molgenis-vendor-bundle.js:13635 Warning: Failed propType: Invariant Violation: Popover: prop type `animation` is invalid; it must be a function, usually from React.PropTypes. Check the render method of `TableHeaderCell`.
warning @ warning.js:48
molgenis-vendor-bundle.js:13635 Warning: Failed propType: checker is not a function Check the render method of `TableHeaderCell`.
warning @ warning.js:48
Navigated to http://localhost:8080/menu/main/dataexplorer?entity=it_emx_datatypes_TypeTest
warning.js:48 Warning: Popover: prop type `animation` is invalid; it must be a function, usually from React.PropTypes.
warning @ warning.js:48
validateTypeDef @ ReactClass.js:395
propTypes @ ReactClass.js:373
mixSpecIntoComponent @ ReactClass.js:480
createClass @ ReactClass.js:878
(anonymous) @ Popover.js:9
73 @ molgenis-global-ui.js?iUMVEQ:2426
__webpack_require__ @ bootstrap 032c47ff44b380ace743:52
276 @ index.js:28
__webpack_require__ @ bootstrap 032c47ff44b380ace743:52
289 @ molgenis-global-ui-webpack.js:1
__webpack_require__ @ bootstrap 032c47ff44b380ace743:52
0 @ molgenis-global-ui.js?iUMVEQ:9
__webpack_require__ @ bootstrap 032c47ff44b380ace743:52
webpackJsonpCallback @ bootstrap 032c47ff44b380ace743:23
(anonymous) @ molgenis-global-ui.js?iUMVEQ:1
warning.js:48 Warning: Failed propType: Invariant Violation: Popover: prop type `animation` is invalid; it must be a function, usually from React.PropTypes. Check the render method of `TableHeaderCell`.
warning @ warning.js:48
checkPropTypes @ ReactElementValidator.js:256
validatePropTypes @ ReactElementValidator.js:366
createElement @ ReactElementValidator.js:408
TableHeaderCell_render @ Table.js:430
_renderValidatedComponentWithoutOwnerOrContext @ ReactCompositeComponent.js:789
_renderValidatedComponent @ ReactCompositeComponent.js:816
ReactCompositeComponent__renderValidatedComponent @ ReactPerf.js:70
mountComponent @ ReactCompositeComponent.js:237
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
_updateRenderedComponent @ ReactCompositeComponent.js:764
_performComponentUpdate @ ReactCompositeComponent.js:726
updateComponent @ ReactCompositeComponent.js:642
ReactCompositeComponent_updateComponent @ ReactPerf.js:70
performUpdateIfNecessary @ ReactCompositeComponent.js:539
performUpdateIfNecessary @ ReactReconciler.js:115
runBatchedUpdates @ ReactUpdates.js:151
perform @ Transaction.js:134
perform @ Transaction.js:134
perform @ ReactUpdates.js:95
flushBatchedUpdates @ ReactUpdates.js:175
ReactUpdates_flushBatchedUpdates @ ReactPerf.js:70
closeAll @ Transaction.js:207
perform @ Transaction.js:148
batchedUpdates @ ReactDefaultBatchingStrategy.js:66
enqueueUpdate @ ReactUpdates.js:215
enqueueUpdate @ ReactUpdateQueue.js:30
enqueueSetState @ ReactUpdateQueue.js:208
ReactComponent.setState @ ReactComponent.js:69
(anonymous) @ Table.js:228
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
get @ RestClientV2.js:70
_refreshData @ Table.js:222
Table_componentDidMount @ Table.js:100
notifyAll @ CallbackQueue.js:68
close @ ReactReconcileTransaction.js:81
closeAll @ Transaction.js:207
perform @ Transaction.js:148
batchedMountComponentIntoNode @ ReactMount.js:269
perform @ Transaction.js:134
batchedUpdates @ ReactDefaultBatchingStrategy.js:66
batchedUpdates @ ReactUpdates.js:110
_renderNewRootComponent @ ReactMount.js:404
ReactMount__renderNewRootComponent @ ReactPerf.js:70
render @ ReactMount.js:493
React_render @ ReactPerf.js:70
(anonymous) @ VM601:50
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
jQuery.(anonymous function) @ jquery.js:8298
createDataTable @ VM601:49
(anonymous) @ VM599:26
fire @ jquery.js:3073
fireWith @ jquery.js:3185
(anonymous) @ jquery.js:3313
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
(anonymous) @ VM599:6
globalEval @ jquery.js:330
domManip @ jquery.js:5411
append @ jquery.js:5194
(anonymous) @ jquery.js:5309
jQuery.access @ jquery.js:3465
html @ jquery.js:5276
(anonymous) @ jquery.js:8866
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
jQuery.fn.load @ jquery.js:8854
(anonymous) @ dataexplorer.js?oOYfiQ:492
dispatch @ jquery.js:4409
elemData.handle @ jquery.js:4095
trigger @ jquery.js:4324
(anonymous) @ jquery.js:4875
each @ jquery.js:375
each @ jquery.js:139
trigger @ jquery.js:4874
Tab.show @ tab.js:47
(anonymous) @ tab.js:124
each @ jquery.js:375
each @ jquery.js:139
Plugin @ tab.js:119
(anonymous) @ dataexplorer.js?oOYfiQ:395
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
_ajax @ RestClientV1.js:83
_get @ RestClientV1.js:66
getAsync @ RestClientV1.js:11
render @ dataexplorer.js?oOYfiQ:330
init @ dataexplorer.js?oOYfiQ:741
(anonymous) @ dataexplorer.js?oOYfiQ:763
fire @ jquery.js:3073
fireWith @ jquery.js:3185
ready @ jquery.js:3391
completed @ jquery.js:3407
warning.js:48 Warning: Failed propType: checker is not a function Check the render method of `TableHeaderCell`.
warning @ warning.js:48
checkPropTypes @ ReactElementValidator.js:256
validatePropTypes @ ReactElementValidator.js:366
createElement @ ReactElementValidator.js:408
TableHeaderCell_render @ Table.js:430
_renderValidatedComponentWithoutOwnerOrContext @ ReactCompositeComponent.js:789
_renderValidatedComponent @ ReactCompositeComponent.js:816
ReactCompositeComponent__renderValidatedComponent @ ReactPerf.js:70
mountComponent @ ReactCompositeComponent.js:237
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
mountChildren @ ReactMultiChild.js:192
_createContentMarkup @ ReactDOMComponent.js:289
mountComponent @ ReactDOMComponent.js:199
mountComponent @ ReactReconciler.js:38
mountComponent @ ReactCompositeComponent.js:247
ReactCompositeComponent_mountComponent @ ReactPerf.js:70
mountComponent @ ReactReconciler.js:38
_updateRenderedComponent @ ReactCompositeComponent.js:764
_performComponentUpdate @ ReactCompositeComponent.js:726
updateComponent @ ReactCompositeComponent.js:642
ReactCompositeComponent_updateComponent @ ReactPerf.js:70
performUpdateIfNecessary @ ReactCompositeComponent.js:539
performUpdateIfNecessary @ ReactReconciler.js:115
runBatchedUpdates @ ReactUpdates.js:151
perform @ Transaction.js:134
perform @ Transaction.js:134
perform @ ReactUpdates.js:95
flushBatchedUpdates @ ReactUpdates.js:175
ReactUpdates_flushBatchedUpdates @ ReactPerf.js:70
closeAll @ Transaction.js:207
perform @ Transaction.js:148
batchedUpdates @ ReactDefaultBatchingStrategy.js:66
enqueueUpdate @ ReactUpdates.js:215
enqueueUpdate @ ReactUpdateQueue.js:30
enqueueSetState @ ReactUpdateQueue.js:208
ReactComponent.setState @ ReactComponent.js:69
(anonymous) @ Table.js:228
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
get @ RestClientV2.js:70
_refreshData @ Table.js:222
Table_componentDidMount @ Table.js:100
notifyAll @ CallbackQueue.js:68
close @ ReactReconcileTransaction.js:81
closeAll @ Transaction.js:207
perform @ Transaction.js:148
batchedMountComponentIntoNode @ ReactMount.js:269
perform @ Transaction.js:134
batchedUpdates @ ReactDefaultBatchingStrategy.js:66
batchedUpdates @ ReactUpdates.js:110
_renderNewRootComponent @ ReactMount.js:404
ReactMount__renderNewRootComponent @ ReactPerf.js:70
render @ ReactMount.js:493
React_render @ ReactPerf.js:70
(anonymous) @ VM601:50
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
jQuery.(anonymous function) @ jquery.js:8298
createDataTable @ VM601:49
(anonymous) @ VM599:26
fire @ jquery.js:3073
fireWith @ jquery.js:3185
(anonymous) @ jquery.js:3313
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
(anonymous) @ VM599:6
globalEval @ jquery.js:330
domManip @ jquery.js:5411
append @ jquery.js:5194
(anonymous) @ jquery.js:5309
jQuery.access @ jquery.js:3465
html @ jquery.js:5276
(anonymous) @ jquery.js:8866
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
jQuery.fn.load @ jquery.js:8854
(anonymous) @ dataexplorer.js?oOYfiQ:492
dispatch @ jquery.js:4409
elemData.handle @ jquery.js:4095
trigger @ jquery.js:4324
(anonymous) @ jquery.js:4875
each @ jquery.js:375
each @ jquery.js:139
trigger @ jquery.js:4874
Tab.show @ tab.js:47
(anonymous) @ tab.js:124
each @ jquery.js:375
each @ jquery.js:139
Plugin @ tab.js:119
(anonymous) @ dataexplorer.js?oOYfiQ:395
fire @ jquery.js:3073
fireWith @ jquery.js:3185
done @ jquery.js:8251
(anonymous) @ jquery.js:8598
XMLHttpRequest.send (async)
send @ jquery.js:8623
ajax @ jquery.js:8152
_ajax @ RestClientV1.js:83
_get @ RestClientV1.js:66
getAsync @ RestClientV1.js:11
render @ dataexplorer.js?oOYfiQ:330
init @ dataexplorer.js?oOYfiQ:741
(anonymous) @ dataexplorer.js?oOYfiQ:763
fire @ jquery.js:3073
fireWith @ jquery.js:3185
ready @ jquery.js:3391
completed @ jquery.js:3407
warning.js:48 Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of TableCell. See https://fb.me/react-warning-keys for more information.