Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Not Working in React Strict Mode #226

Closed
Vitorbnc opened this issue Jun 11, 2021 · 3 comments
Closed

Not Working in React Strict Mode #226

Vitorbnc opened this issue Jun 11, 2021 · 3 comments
Assignees
Labels
bug Something isn't working waiting-on-contributor Waiting on something from a contributor

Comments

@Vitorbnc
Copy link

Guidelines

Describe the bug
Icons don't appear and and an error shows up in console. The error is as follows:

index.js:1 Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Transition which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://reactjs.org/link/strict-mode-find-node
at div
at Transition (http://localhost:3000/static/js/vendors~main.chunk.js:95502:30)
at Grow (http://localhost:3000/static/js/vendors~main.chunk.js:21102:24)
at div
at Portal (http://localhost:3000/static/js/vendors~main.chunk.js:29447:24)
at Popper (http://localhost:3000/static/js/vendors~main.chunk.js:29126:24)
at Tooltip (http://localhost:3000/static/js/vendors~main.chunk.js:39718:28)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at div
at MTablePagination (http://localhost:3000/static/js/vendors~main.chunk.js:3055:10)
at MTablePaginationRef
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at ActionsComponent
at div
at Toolbar (http://localhost:3000/static/js/vendors~main.chunk.js:39434:23)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at td
at TableCell (http://localhost:3000/static/js/vendors~main.chunk.js:36682:28)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at TablePagination (http://localhost:3000/static/js/vendors~main.chunk.js:37226:37)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at tr
at TableRow (http://localhost:3000/static/js/vendors~main.chunk.js:37643:23)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at tfoot
at TableFooter (http://localhost:3000/static/js/vendors~main.chunk.js:36945:23)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at table
at Table (http://localhost:3000/static/js/vendors~main.chunk.js:36301:23)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at div
at Paper (http://localhost:3000/static/js/vendors~main.chunk.js:28361:23)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at Container (http://localhost:3000/static/js/vendors~main.chunk.js:394:27)
at ContainerRef
at Provider (http://localhost:3000/static/js/vendors~main.chunk.js:91681:20)
at App (http://localhost:3000/static/js/vendors~main.chunk.js:62505:25)
at ErrorBoundary (http://localhost:3000/static/js/vendors~main.chunk.js:55703:35)
at DragDropContext (http://localhost:3000/static/js/vendors~main.chunk.js:62637:19)
at MaterialTable (http://localhost:3000/static/js/vendors~main.chunk.js:6488:37)
at http://localhost:3000/static/js/vendors~main.chunk.js:6340:16
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at Main
at Route (http://localhost:3000/static/js/vendors~main.chunk.js:94154:29)
at PrivateRoute (http://localhost:3000/static/js/main.chunk.js:5512:14)
at Switch (http://localhost:3000/static/js/vendors~main.chunk.js:94356:29)
at main
at div
at div
at MiniDrawer (http://localhost:3000/static/js/main.chunk.js:2800:3)
at Switch (http://localhost:3000/static/js/vendors~main.chunk.js:94356:29)
at Router (http://localhost:3000/static/js/vendors~main.chunk.js:93789:30)
at HashRouter (http://localhost:3000/static/js/vendors~main.chunk.js:93454:35)
at Routes
at App
at CssBaseline (http://localhost:3000/static/js/vendors~main.chunk.js:15878:31)
at WithStyles (http://localhost:3000/static/js/vendors~main.chunk.js:53036:31)
at ThemeProvider (http://localhost:3000/static/js/vendors~main.chunk.js:51738:24)
at Provider (http://localhost:3000/static/js/vendors~main.chunk.js:91681:20)
console. @ index.js:1
printWarning @ react-dom.development.js:67
error @ react-dom.development.js:43
findHostInstanceWithWarning @ react-dom.development.js:25406
findDOMNode @ react-dom.development.js:26067
performEnter @ Transition.js:245
updateStatus @ Transition.js:228
componentDidMount @ Transition.js:172
commitLifeCycles @ react-dom.development.js:20663
commitLayoutEffects @ react-dom.development.js:23426
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
commitRootImpl @ react-dom.development.js:23151
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
commitRoot @ react-dom.development.js:22990
performSyncWorkOnRoot @ react-dom.development.js:22329
(anonymous) @ react-dom.development.js:11327
unstable_runWithPriority @ scheduler.development.js:468
runWithPriority$1 @ react-dom.development.js:11276
flushSyncCallbackQueueImpl @ react-dom.development.js:11322
flushSyncCallbackQueue @ react-dom.development.js:11309
scheduleUpdateOnFiber @ react-dom.development.js:21893
dispatchAction @ react-dom.development.js:16139
(anonymous) @ useControlled.js:38
handleOpen @ Tooltip.js:273
(anonymous) @ Tooltip.js:306
setTimeout (async)
(anonymous) @ Tooltip.js:305
callCallback @ react-dom.development.js:3945
invokeGuardedCallbackDev @ react-dom.development.js:3994
invokeGuardedCallback @ react-dom.development.js:4056
invokeGuardedCallbackAndCatchFirstError @ react-dom.development.js:4070
executeDispatch @ react-dom.development.js:8243
processDispatchQueueItemsInOrder @ react-dom.development.js:8275
processDispatchQueue @ react-dom.development.js:8288
dispatchEventsForPlugins @ react-dom.development.js:8299
(anonymous) @ react-dom.development.js:8508
batchedEventUpdates$1 @ react-dom.development.js:22396
batchedEventUpdates @ react-dom.development.js:3745
dispatchEventForPluginEventSystem @ react-dom.development.js:8507
attemptToDispatchEvent @ react-dom.development.js:6005
dispatchEvent @ react-dom.development.js:5924
unstable_runWithPriority @ scheduler.development.js:468
dispatchUserBlockingUpdate @ react-dom.development.js:5894

To Reproduce
Steps to reproduce the behavior:

  1. Run the styling example from material-table docs.

Screenshots
If applicable, add screenshots to help explain your problem.
image

image

Desktop (please complete the following information):

  • OS: Windows 10
  • Browser: Chrome
  • Version: 90
@Vitorbnc Vitorbnc added the bug Something isn't working label Jun 11, 2021
@oze4
Copy link
Member

oze4 commented Jun 11, 2021

Do we know if this is from a dependency or not? I've seen that before and want to say it may be an issue with a dep.

I can check here in a few minutes.

@Vitorbnc
Copy link
Author

I fixed the icons problem. It's not actually a problem and it's explained in the material-table docs.

The findDOMNode error also occurs in the original material-table repo. It's probably related to material-ui itself.
There's an issue here, and they say it's possible to alter the imports to fix it for now, but it should be fixed in material-ui v5. I don't know what is causing it in this library though, I've used createMuiTheme before and there were no warnings.

@Domino987
Copy link
Contributor

Domino987 commented Jun 11, 2021

Yes seems like it's connected to the not strict Mode components of muiv4. Try out our next branch which is v5 supported and see if that helps.

I see the icons in the demo currently on both docs sites though.

@Domino987 Domino987 self-assigned this Jun 15, 2021
@Domino987 Domino987 added the waiting-on-contributor Waiting on something from a contributor label Jun 15, 2021
@oze4 oze4 closed this as completed Jul 13, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working waiting-on-contributor Waiting on something from a contributor
Projects
None yet
Development

No branches or pull requests

3 participants