You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I am using remirror in an angular app and in the migration from angular 16 to 17 my portals stopped working.
It is basically a race condition in the current code, that I can only reproduce within angular and I don't know why exactly. But I can show in the code that it might happen.
Steps to reproduce
As I said I cannot reproduce it really in a small case, but I can show you at the code how it works:
The following code is from the portal container and usePortals hook. I have simplified it a little bit. In my comments you can see in which order the code runs in my application.
export function usePortals() {
const [portals, setPortals] = useState(() => {
// RUNS FIRST. Portal Count in Hook = 0
return Array.from(portalContainer.portals.entries()));
}
useEffect(
() =>
// RUNS THIRD: Portal Count in Hook = 0, Portal Count in Container = 1.
// HERE A CALL to setPortals is missing.
portalContainer.on((portalMap) => {
setPortals(Array.from(portalMap.entries()));
}),
[portalContainer],
);
// Is this not useless?
return useMemo(() => portals, [portals]);
}
export class PortalContainer {
private update() {
// RUNS SECOND: Portal Count in Container = 1,
this.#events.emit('update', this.portals);
}
}
Summary
Hi,
I am using remirror in an angular app and in the migration from angular 16 to 17 my portals stopped working.
It is basically a race condition in the current code, that I can only reproduce within angular and I don't know why exactly. But I can show in the code that it might happen.
Steps to reproduce
As I said I cannot reproduce it really in a small case, but I can show you at the code how it works:
The following code is from the portal container and usePortals hook. I have simplified it a little bit. In my comments you can see in which order the code runs in my application.
Expected results
Actual results
Possible Solution
Add the following call to
useEffect
I have applied that with https://www.npmjs.com/package/patch-package and it works as expected.
Screenshot(s)
The text was updated successfully, but these errors were encountered: