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

Getting Warnings in new React version. #727

Open
sumitdhakadjobma opened this issue Jul 24, 2023 · 8 comments
Open

Getting Warnings in new React version. #727

sumitdhakadjobma opened this issue Jul 24, 2023 · 8 comments

Comments

@sumitdhakadjobma
Copy link

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DraggableCore 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 DraggableCore (http://localhost:3000/static/js/vendors-node_modules_react-draggable_build_cjs_cjs_js.chunk.js:1156:5)
at Draggable (http://localhost:3000/static/js/vendors-node_modules_react-draggable_build_cjs_cjs_js.chunk.js:447:5)
at VoiceCommand (http://localhost:3000/static/js/src_modules_Interview_FirstTheme_VoiceCommand_VoiceCommand_js.chunk.js:35:5)
at Suspense
at VoiceCommand
.......
.......
.......
(hide content)

@BrianAA
Copy link

BrianAA commented Aug 6, 2023

While what you say is true I also get that error. You can also just drop the strict and just use the . It cleared the problem for me.

ReactDOM.createRoot(document.getElementById("root")).render(
    <App />
);

Instead of

ReactDOM.createRoot(document.getElementById("root")).render(
   <React.Strict>
    <App />
   </React.Strict>
);

@z89
Copy link

z89 commented Aug 8, 2023

While what you say is true I also get that error. You can also just drop the strict and just use the . It cleared the problem for me.

ReactDOM.createRoot(document.getElementById("root")).render(
    <App />
);

Instead of

ReactDOM.createRoot(document.getElementById("root")).render(
   <React.Strict>
    <App />
   </React.Strict>
);

This is a bad practise since developers use StrictMode for testing. Any other solutions?

@Dream4ever
Copy link

@sumitdhakadjobma @z89 check out this issue: #693

@SiddHyper
Copy link

+1

@designbyadrian
Copy link

+1

No need to type "+1", just vote with the the icon on the original post. This way, devs can search and sort for issues.

@gabrielyotoo
Copy link

still an issue

@jmw182
Copy link

jmw182 commented Mar 26, 2024

As answered in #693, this is resolved by passing in a node ref: https://github.com/react-grid-layout/react-draggable/blob/master/CHANGELOG.md#440-may-12-2020

@yelvert
Copy link

yelvert commented Apr 14, 2024

passing in a nodeRef does not always fix this issue, I think

  findDOMNode(): ?HTMLElement {
    return this.props?.nodeRef?.current ?? ReactDOM.findDOMNode(this);
  }

should become

  findDOMNode(): ?HTMLElement {
    return this.props?.nodeRef ? this.props.nodeRef.current : ReactDOM.findDOMNode(this);
  }

becaus the problem is that nodeRef's current value isnt always set yet when findDOMNode is called

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

9 participants