ResizeObserver loop limit exceeded

[RickLucassen]

• [x] I have searched the issues of this repository and believe that this is not a duplicate.

Reproduction link

Steps to reproduce

• Create eventlistener on "window" for "error". (window.addEventListener("error", (e) => console.error(e));)
• Render widget that renders a dropdown of some sort when clicking the input field.
• Click on the field.
• See "ResizeObserver loop limit exceeded" error message in console.

What is expected?

For the error not to be generated

What is actually happening?

Opening any kind of widget (dropdown) generates this error.

Environment	Info
antd	4.6.3
React	16.11.0
System	Ubuntu 20.04.1
Browser	Chromium 85.0.4183.83

[ant-design-bot]

Hello @RickLucassen. Please provide a online reproduction by forking this link https://u.ant.design/codesandbox-repro or a minimal GitHub repository. Issues labeled by Need Reproduce will be closed if no activities in 7 days.

你好 @RickLucassen, 我们需要你提供一个在线的重现实例以便于我们帮你排查问题。你可以通过点击 此处 创建一个 codesandbox 或者提供一个最小化的 GitHub 仓库。7 天内未跟进的 issue 将会被自动关闭。

[afc163]

@cyjake

https://github.com/react-component/resize-observer/pull/18 https://github.com/react-component/align/pull/72

[zombieJ]

Seems error has gone after refactor of rc-trigger & rc-motion.

[makarov-roman]

hi @zombieJ, is there any eta when those refactorings would make into release?

[makarov-roman]

hi @zombieJ, is there any eta when those refactorings would make into release?

[zombieJ]

@makarov-roman remove your lock file and reinstall.

[gynekolog]

@zombieJ Remove lock file is not a good solution. You can make It better by deleting antd part only from the lock file and run yarn or npm-install again. Or upgrade only concretely packages (rc-resize-observer, rc-align, rc-trigger, rc-motion ?)

[nigulasikk]

Seems error has gone after refactor of rc-trigger & rc-motion.

antd（v 4.16.9）中，还存在题主说的问题呢。例子：https://codesandbox.io/s/4ovng?file=/src/index.js

[citmusa]

Please reopen. As @nigulasikk shows this is still an issue

[scheinercc]

For completeness, the message text in Firefox and Safari reads:

ResizeObserver loop completed with undelivered notifications.

---

ResizeObserver loop limit exceeded

Is Chrome at all only

[hopperhuang]

will this bug be fixed?

[dingyc1022]

will this bug be fixed?

[1006223320]

will this bug be fixed?

[mqliutie]

mark

[alienzhangyw]

Error comes out when clicking Select input

[ishan123456789]

Hi I'm facing same error on Select component of antd version 4.17.2 any fix for this https://github.com/ant-design/ant-design/issues/15075#issuecomment-1120156254

[github-actions[bot]]

Hello @RickLucassen. We totally like your proposal/feedback, welcome to send us a Pull Request for it. Please send your Pull Request to proper branch (feature branch for the new feature, master for bugfix and other changes), fill the Pull Request Template here, provide changelog/TypeScript/documentation/test cases if needed and make sure CI passed, we will review it soon. We appreciate your effort in advance and looking forward to your contribution!

你好 @RickLucassen，我们完全同意你的提议/反馈，欢迎直接在此仓库 创建一个 Pull Request 来解决这个问题。请将 Pull Request 发到正确的分支（新特性发到 feature 分支，其他发到 master 分支），务必填写 Pull Request 内的预设模板，提供改动所需相应的 changelog、TypeScript 定义、测试用例、文档等，并确保 CI 通过，我们会尽快进行 Review，提前感谢和期待您的贡献。

[afc163]

https://stackoverflow.com/a/58701523/3040605

[ishan123456789]

For anyone wanting to remove the popup from react you can use:

body > hmr-error-overlay { // This worked for me the container element might have changed so add change accordingly 
  display: none;
}

And to not let go of all the errors I added this block for error logging in the index.jsx

window.addEventListener('error', function (e) {
  console.error(e.message);
  // prevent React's listener from firing
  e.stopImmediatePropagation();
  // prevent the browser's console error message
  e.preventDefault();
});

[GrayYoung]

Sucks, a waste of my time...

[nghiahc2]

still face this error with antd table

[mMarcos208]

@nghiahc2 I have the same issue when navigation to page that using Table component.

Any solution?

[nghiahc2]

@mMarcos208 i upgraded react from 17 to 18... And it works!

[quangnmwork]

Same isssue

[MudulOzan]

Still no update? I have the same problem

[yoyo837]

https://codesandbox.io/s/antd-reproduction-template-forked-oevinj?file=/index.js The latest version of 4.x cannot reproduce this problem

[MudulOzan]

https://codesandbox.io/s/antd-reproduction-template-forked-oevinj?file=/index.js The latest version of 4.x cannot reproduce this problem

I am using the latest tho still have this

[yoyo837]

https://codesandbox.io/s/antd-reproduction-template-forked-oevinj?file=/index.js The latest version of 4.x cannot reproduce this problem

I am using the latest tho still have this

How to reproduce, I can't reproduce it with 4.x latest.

[MudulOzan]

https://codesandbox.io/s/antd-reproduction-template-forked-oevinj?file=/index.js The latest version of 4.x cannot reproduce this problem

I am using the latest tho still have this

How to reproduce, I can't reproduce it with 4.x latest.

I joined a complicated project I don't know all all posibilities but hear me out: Collapse inside Popover

I created a custom collapse component on my own and then put it inside Popover not a problem at all. Then I add one more css rule which is border bottom then I recieve this error. Pretty strange to me but I don't know how to reproduce or what causes this.

Probably it must be something about animations.

[MarcusCody]

I have the same issue with the Sider that is in collapsed mode when I click one of the menus in the Sider. The error will be prompted