RTKQ: Query is unsubscribed immediately after mounting in React 18 StrictMode

[KurtGokhan]

I was doing some exploration in React 18 RC and noticed that RTK Query was causing endless loading screens in StrictMode only. I don't know if React 18 is supported yet, but thought this might be helpful.

This is how actions look in React 17 and non strict mode:

This is how it looks in React 18 StrictMode:

Two problems here.

1. For some reason the query unsubscribes. This can be a bug on React side. useEffect cleanup is called for no reason as if component is unmounted, even when the component is not unmounted. That causes RTKQ to unsubscribe.
2. Query doesn't (?) subscribe again and stays in loading indefinitely. This is non-deterministic, as sometimes it does finish loading. I think this is related to side effects in render.

Version: 1.7.1
Sandbox link

[KurtGokhan]

I see this was already discussed at reduxjs/react-redux#1732

My bad. Tried react-redux v8 beta. Seems to work. At least problem 2 does not happen.

Problem 1 still happens. But I guess it is a React behavior and nothing to do here. Issue can be closed as far as I am concerned.

[markerikson]

Yeah, the extra unmount is part of the new "Strict Effects" behavior as far as I know.

[phryneas]

@markerikson what does that do?

[KurtGokhan]

@phryneas It is explained here: reactwg/react-18#19

React intentionally double-invokes effects (mount -> unmount -> mount) for newly mounted components. (In strict mode)

I just learned about it.

[phryneas]

Interesting and kinda weird. Good to know, thanks!