Zustand + jest

[AlaaInflyter]

Hey guys !
First of all, thanks for the work here !
I've setup a react-native stack with zustand in it. And wrote some tests for it.
As per the tutorial, i have setup everything regarding tests.
The tutorials show a "store" file with a classic store hook exported from it.
The issue here is with parallel tests.
If a component imports a hook from a store.ts file, and you test that component in different tests, these tests are gonna use the same store instance, which might cause conflicts and unwanted rerendering. Basically some kind of flakiness.
Any ideas to go around this ?
I've tried mocking like below, using a function that generates a store using initial state:

  jest.mock('path/to/store', () => {
    const { createStore } = jest.requireActual('path/to/store)
    return createStore({
      count: 3
    })
  })

The mocking works for the initial state (so at least I can set whatever state i want), but the parallel issue remains: the test cases in the same file are using the same store instance.
Another possible thing is to use the context API, and wrap each unit test with a context provider that injects a new store. But what i like most about zustand is that its very lightweight, no boilerplate. So it would be a bit sad to go through providers :/

[dbritto-dev]

That's why you need to mock zustand in order to implement a logic to reset stores afterEach test

[dbritto-dev]

Already did. That is made for the issue: "a test has done some store alternation, and we need to cleanup these modifications for the next text".
But it doesn't affect the issue i'm talking: 2 tests running at the same time. Since multiple tests are running at the same time, the afterEach is irrelevant.

Yeah, that's true at the same time would be difficult to clean up state before doing anything but that issue could happen in real life

[dbritto-dev]

You can address it using Context in order to provide an isolated store. We don't have an example of that but I could work on that

[AlaaInflyter]

Yeah I put this in my first message

Another possible thing is to use the context API, and wrap each unit test with a context provider that injects a new store. But what i like most about zustand is that its very lightweight, no boilerplate. So it would be a bit sad to go through providers :/

But if it's the only solution i'll take it.
Do subscriptions persist when using the contextAPI (something like store = create(), then useStore = () => useContext(store))? or do I have to go with the vanilla store ?

[dbritto-dev]

Should works without any issues, but if something doesn't work just ping me I'll try to answer any questions as soon as possible.

Ref: https://docs.pmnd.rs/zustand/guides/initialize-state-with-props

[AlaaInflyter]

Sure i'll do this tomorrow. Thanks for the reactivity !
I'm a bit hesitant about context API as any change might rerender the whole app. I see in the link that there's a useRef, hopefully it's enough to prevent that.