In-Source testing and module mocking - side effects?

[weilbith]

Hey 👋🏾

Unfortunately I can't really tell when it happens. But I get some weird side effects when I mock modules in in-source tests. Though, it does not always happen. So I'm quite confused whats the actual critical issue.

So I have a module with some function foo like:

foo.ts:

export function foo(): string {
  return "foo";
}

I use that function in another module and mock it for the in-source tests:
using-foo.ts:

import { foo } from "./foo";

export function useFoo(): string {
  return foo()
}

if (import.meta.vitest) {
  const { describe, it, expect } = import.meta.vitest;
  
  describe("using foo", () => {
    vi.mock("./foo");
    
    it("does what it should", () => {
      vi.mocked(foo).mockReturnValue("bar");
      const result = useFoo();
      expect(result).toEqual("bar")
    });
  });
}

Till here, everything works fine. The vi.mock inside the describe block is already an approach to "scope" the mocking somehow. (bullshit)
But if I now have a another module that uses foo and has no in-source testing (dunno if it actually makes a difference), I get issues.

also-using-foo.ts:

export function alsoUseFoo(): number {
  return foo().length + 1;
}

also-using-foo.spec.ts:

import { describe, it, expect } from "vitest";
import { alsoUseFoo } from "./also-using-foo";

describe("also using foo", () => {
  it("does what it should", () => {
    const result = alsoUseFoo();
    expect(result).toBeGreaterThan(0);
  });
});

Now I get errors because foo is somehow mocked by the vi.mock and returns undefined (so the length property does not exist). If I comment out the vi.mock in the other tests, these tests here just work fine.

My Vitest configuration is actually quite simple. I thought especially the restoreMocks should help (while being useful in general).

{
    "environment": "jsdom",
    "restoreMocks": true,
    "include": ["./**/*.spec.ts*"],
    "includeSource": ["./**/*.ts"],
}

As I read from the documentation, per default Vitest runs test modules isolated from each other.
But if Vitest runs the also-using-foo.spec.ts, then import.meta.vitest is defined. So in case the using-foo.ts module would be loaded (also it isn't needed here), the if-condition would be true. So in theory the in-source tests get executed. Which would include the vi.mock. But I don't know how this actually works. I makes no difference if I would put the vi.mock in any of the before* hooks either. 🤷🏾

Anyone experiencing the same issues? Are there some best practices how to use module mocking for in-source tests?
Thank you very much for any help in advance! 🙏🏾

EDIT:
Weird enough, if I provide a factory for the module mock it won't be used. Like in using-foo.ts in the in-source tests where the vi.mock call is:

vi.mock("./foo", () => ({
  foo: vi.fn().mockReturnValue("foo"),
}));

I get still issues in also-using-foo.spec.ts that I get undefined as return values by foo. 🙇🏾‍♂️

[sheremet-va]

Hm, I have a feeling that this happens because the content of the using-foo.ts is cached, so when the next test imports it, the vi.mock is executed since it is hoisted to the top of the file.