flushSync
Hello i was wondering if anyone of you came across this issue, i integrating this with my Angular app but i am getting this when trying to clear or close the popover:
"flushSync was called from inside a lifecycle method. React cannot flush when React is already rendering. Consider moving this call to a scheduler task or micro task." It is supposed to be "harmless" as it register as warning, however it looks more like a bug as the Dom object is not refreshed and create a cascading error in the widget wit ha bad request with Axios.
Not sure how to avoid or fix the flushSync() error since it is in the react component.
Any ideas or guidance will be greatly appreciated. Thank you.
8 Replies
Hi @Ulrich_Skl, I'm an AI assistant for Novu. While a team member reviews this question, I'll look through relevant sources and see if I can provide suggestions. Please tag @Ask Inkeep with any follow-up questions.
-----------------------------
While I generate an answer, here are some sources that might be helpful:
* Angular Component
* Configuring Multiple Tabs
* Angular
* React Component
-----------------------------
Answer
This issue has been reported on the Novu GitHub page (NV-2552). The console warnings you described occur when launching the notification center or clicking on any action inside the notification panel of the Angular Notification Center. The current state of the issue is open, indicating that it's recognized but not resolved yet (1) .
It's advisable to follow the issue on GitHub for any updates or potential fixes from the Novu team or community.
Adding @Pawan Jain and @Paweł T. both might help us here? @Emil maybe you can help?
@Ulrich_Skl
I see we have an open issue with this
https://github.com/novuhq/novu/issues/3678
I feel this is a warning in console. but it should not affect the working of notification center
GitHub
[NV-2552] 🐛 Bug Report: Angular Notification Center · Issue #3678 ·...
📜 Description Hello, I use https://web.novu.co to trigger my notification . I'm integrating the notification center using @novu/notification-center-angular since client side is built on angular...
@Pawan Jain yes at first I thought the same thing, unfortunately, it totally broke the popover on my case and thrown an error with cascaded to unresponsive overlay. As far as notification it worked nicely, everything else was functional, as soon as i delete the message this is were the trouble started, the content of the notification fail to update and we get into the issue, leading to the axios error. Sadly I had to remove the notification system. I saw that maybe the use of flushSync might not be the best for the situation? Maybe a more rudimentary delay/settimeout to reset the Dom ? I don't know the core code but that could be a way around it. I don't know. That's too bad this was perfect for what I needed.
@Ulrich_Skl
Thanks for sharing the issue.
I will prioritize the fix with team and share the update with you
Awesome, thank you.