[Bug] CSSTransition enter animation doesn't firing on first open when using `mountOnEnter` + createPortal

[rafaelcmm]

CSSTransition enter animation doesn't fire properly on first open with mountOnEnter + portal

What is the current behavior?

When using CSSTransition with mountOnEnter inside createPortal(), the enter transition does not fire on the first open. Adding unmountOnExit fixes the issue.

Possible Cause: componentWillReceiveProps calls setState({ status: EXITED }) asynchronously. React batches this, so when componentDidUpdate runs performEnter(node), the child hasn't mounted yet and nodeRef.current is null.

What is the expected behavior?

The enter transition should fire properly on the first open, regardless of whether unmountOnExit is used.

Could you provide a CodeSandbox demo reproducing the bug?

https://codesandbox.io/p/sandbox/react-ts

Note: In my case, the CSSTransition on createPortal doesn't even trigger the transitions, in the CodeSandbox, you can see a similar problem on the exit transition where it triggers but doesn't get removed.

Steps:

• Click to open modal
• Close the modal
  • See that transition didn't worked properly
• Add unmountOnExit property
• See that now transitions works as expected, as the element gets unmounted

What versions of dependencies, and which browser / OS are affected?

• react-transition-group: 4.4.5
• React: 19
• Browser/OS: All