(Testing) HydrateAtoms component resets atoms when using multiple initial values

[MatheusPires99]

Summary

I'm facing an issue when using multiple initial values in the useHydrateAtoms hook .

When I add two different atoms as initial values to the useHydrateAtoms hook, one atom is resetting the other, despite providing the initial value for each atom causing my test to break.

Additionally, I encountered a TypeScript error related to sending different data types in a new Map.

Link to reproduction

Link to Reproduction

Check List

Please do not ask questions in issues.

• I've already opened a discussion before opening this issue, or already discussed it in other media.

Please include a minimal reproduction.

• I've added a link to a codesandbox with a minimal reproduction.

[dai-shi]

Hi, thanks for reporting.
I'm not sure if I understand the reproduction. (how can we run tests with devbox?)
TypeScript errors are gone if I open it with my account, but not in anonymous window. For TS errors, can you create a reproduction with https://www.typescriptlang.org/play ?
Is it testing only issue? Otherwise, can you create a reproduction without vitest?

[MatheusPires99]

Hi @dai-shi, I believe you can open the terminal and run yarn test. But the problem I'm encountering is how to mock both an atom value and a write-only atom simultaneously. In my test, I need to verify if the write-only atom has been called.When I mock both atoms, the mockedUploadsAtom has an empty array value when I log it in my component. However, if I remove [clearUploadsAtom, mockedClearUploadsAtom] from the initialValues, the mockedUploadsAtom returns the expected value again.

const HydrateAtoms = ({ initialValues, children }) => {
  useHydrateAtoms(initialValues);
  return children;
};

const TestProvider = ({ initialValues, children }) => (
  <JotaiProvider>
    <HydrateAtoms initialValues={initialValues}>{children}</HydrateAtoms>
  </JotaiProvider>
);

const mockedUploadsAtom = [
  {
     file: new File([], "mocked-file.png"),
  },
];
const mockedClearUploadsAtom = vi.fn();

<TestProvider
     initialValues={
       new Map([
         [uploadsAtom, mockedUploadsAtom],
         [clearUploadsAtom, mockedClearUploadsAtom],
       ])
     }
>
     <Upload />
</TestProvider>,

[dai-shi]

But the problem I'm encountering is how to mock both an atom value and a write-only atom simultaneously.

This is kind of limitation, but basically useHydrateAtoms works for primitive atoms. It's not useful for write-only atoms.
There might be misunderstanding with useHydrateAtoms. Basically, it's just to "write" atoms only at the first time.

[MatheusPires99]

I see, but how can I overcame this limitation and make my test work?

[dai-shi]

Let's assume atom is just a function. If you mock a function, wouldn't you mock the function itself?

That said, I think testing docs aren't very good, and it's open research area.