Using <Button> results in "findDOMNode is deprecated in StrictMode" warning

[latobibor]

• I have searched the issues of this repository and believe that this is not a duplicate * (It was reported by somebody else but not through Issue Creator and it got auto-closed).

Reproduction link

latobibor/antd-tryout@e373cb5

Steps to reproduce

1. install dependencies (npm i)
2. run app (npm start)
3. check console

What is expected?

No warnings should be displayed.

What is actually happening?

A warning message will appear in console.log stating "Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here:"

Environment	Info
antd	4.0.3
React	16.13.1
System	Windows 8.1
Browser	Chrome 80

---

The source of the problem is coming from <Button /> component.

See the file in question:
latobibor/antd-tryout@e373cb5#diff-b525f6f7c3584f9af17112d37dae3a42

[firesoftdev]

retiring the <React.StrictMode> tag in method ReactDOM.render() works normally

[saostad]

I am getting same error in strict mode antd v4.0.4

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node

[ana-rajat]

Is there any solution regarding the same or any suggestions would also be appreciated.

[myou]

Removing strict mode just for the sake of a button is ridiculous. This is a legit problem with antd that needs to be fixed.

[duongleh]

I am getting the same error

[yoyo837]

Need to do a lot of migration, such as #9870

[DavidSolerMarco]

The same here after a fresh install using the guide https://ant.design/docs/react/use-in-typescript

[yayxs]

I have the same problem

desc

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of Wave which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node

solve

ReactDOM.render(
  // <React.StrictMode>
    <App />
  // </React.StrictMode>,
  ,
  document.getElementById('root')
);

[marianelaleoncini]

I have the same issue. Can you fix it, please?

[Sikae]

I have the same issue. Can you fix it, please?

[javiermoli]

I have the same issue, but I'm using other components, so the problem is not just the <Button />.

[harbhub]

I have the same problem. I'm using <InputMask ...> which comes from the "react-input-mask" library. I also use "material-ui" for the TextField element.

<InputMask
    mask='99/99/9999'
    onFocus={onFocus} onBlur={onBlur}
    defaultValue={fields.birthdate.value}
    error={fields.birthdate.error}
    helperText={fields.birthdate.helperText}
    id='birthdate' name='birthdate' label='Birthdate MM/DD/YYYY'
    type='tel' variant='filled' margin='dense'
>
    {(inputProps) =>
        <TextField {...inputProps} />
    }
</InputMask>

The line in question seems to be the <TextField {...inputProps} /> line.

[phifa]

disabling strict mode is not really an option. How can we fix this?

[yoyo837]

disabling strict mode is not really an option. How can we fix this?

Contribute to migration code about this.

[ngosang]

I'm having this problem in SubMenu and Select components too.

[Even-Lau]

Warning: Legacy context API has been detected within a strict-mode tree.
The old API will be supported in all 16.x releases, but applications using it should migrate to the new version.
Please update the following components: SubMenu

I got the same warning

[jsdev-mario]

Same issue

[nehvaleem]

Same issue also :(

[anesask]

One more here, working with disabled <React.StrictMode>, but really hope it's not a longterm solution.

[hz2]

Same issue

[jjaijg]

Same issue here.

[arpesam]

Same problem here, does Ant team already have a solution?

[Invertisment]

Menu also produces this warning:
<Menu mode="horizontal" >
If I remove the horizontal mode the warning disappears. But it's not a solution.

I guess it could be a big thing to refactor this. It may be needed to dig into multiple components.

Warning: findDOMNode is deprecated in StrictMode. findDOMNode was passed an instance of DOMWrap which is inside StrictMode. Instead, add a ref directly to the element you want to reference. Learn more about using refs safely here: https://fb.me/react-strict-mode-find-node
    in ul (created by DOMWrap)
    in DOMWrap (created by SubPopupMenu)
    in SubPopupMenu (created by Connect(SubPopupMenu))
    in Connect(SubPopupMenu) (created by Menu)
    in Provider (created by Menu)
    in Menu (created by Context.Consumer)
    in InternalMenu (created by Context.Consumer)

"antd": "^4.1.5"
"react": "^16.13.1"

[Reyloso]

Same issue, help!!! please.

[jeon-repo]

Same issue with BackTop button

[alansaldivar87]

Menu.Item it's also causing these logs.

[alienriquebm]

Any update about this?

[AlexeyTeterin]

Same issue with Slider.

[Onlylonger]

same issue with antd@4.13.0 for Submenu

[nanzm]

same issue with antd@4.12.3 for DomWrapper

[armouti]

same issue in antd@4.13.1 for submenu

[M2Changezi]

samee issue is has it been solved ?

[liuliangsir]

same issue in antd@4.14.0 for slider

[PyGod]

same issue with Image antd@4.14.1"

[ashishkarki]

same issue with Alert component and antd version = 4.14.1

[mateuszsplawski]

Same issue with Modal. Version "antd": "^4.14.0"

[yaroslavert]

Same issue antd 4.15.0

[josectobar]

Same issue with Rate component and 4.15.0

[jarrettyew]

Same issue with FormItem. Version "antd": "^4.15.0"

[fengerzh]

Do not close this issue. 掩耳盗铃 is stupid!

[adred]

Been waiting for a fix for 6months. Hopefully, it can be fixed soon!

[yoyo837]

#26136

[cdll]

same issue here on clicking Menu.SubMenu with antd@4.15.1 and react@17.0.2

[jellohouse]

I'm getting this too on slider. This needs to be fixed!

I don't know why this issue was ever closed. The proposed solution is not very nice at all.

Whoever is working on this repo please fix it - I feel like this should be an easy fix.

[lucasltv]

???????????????????????? CLOSED?????????

[yoyo837]

???????????????????????? CLOSED?????????

#22493 (comment)

[nguyenngoclongdev]

???????????????????????? CLOSED?????????

[victorlucss]

Same issue here! This hasn't fixed yet?

[hkrainko]

???????????????????????? CLOSED?????????

[adarshaacharya]

Same issue for Affix, and MenuItems.

[luantruong]

Closed?????????????????? The problem still here and hasn't fixed??????????????????

[yoyo837]

trace in #26136