reactjssemantic-ui-reactstrict-mode

Semantic-ui-react Dimmer warning: findDOMNode is deprecated in StrictMode

When I use Dimmer from semantic-ui-react I got this warrning:

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of RefFindNode 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

But as I see the problem with Dimmer was resolved years before: link.

So what's the root of warring and how to avoid it (except of stop using strict mode)?

import React from "react";
import { Dimmer } from "semantic-ui-react";

const App = () => (
  <React.StrictMode>
    <Dimmer>Hey</Dimmer>
  </React.StrictMode>
);

export default App;

React 18.2.0, Semantic-ui-react 2.1.4, Link to codesandbox.io

Solution

  • A bit of a late reply but if you use v3-beta (https://react.semantic-ui.com/migration-guide), it supports native ref forwarding.

        "semantic-ui-css": "^2.5.0",
    "semantic-ui-react": "^3.0.0-beta.0",

    Hope this helps ;)