Can't mock dependency of dependency

[christian-bromann]

Describe the bug

Given I have packageA that depends on packageB which depends on packageC. If I write tests for packageA I can't mock packageC, e.g.:

// package B
import got from 'got'
export default got

// packageA
import packageB from 'packageB'
export default request (url: string) {
    return packageB(url)
}

Now If I want to write tests for packageA I want to be able to mock the dependency of packageB rather than the whole package:

import { vi, ... } from 'vitest'
import packageA from '../src/index.ts'

vi.mock('got', () => { ... })

describe(() => {
    // ...
})

Unfortunately it is impossible to mock got in this case. In Jest however this is possible.

Reproduction

In this example I mock loglevel which is a direct dependency of @wdio/logger. The test should throw an error because the dependency was mocked out with an undefined value but the test passes.

System Info

n/a

Used Package Manager

npm

Validations

• Follow our Code of Conduct
• Read the Contributing Guidelines.
• Read the docs.
• Check that there isn't already an issue that reports the same bug to avoid creating a duplicate.
• Check that this is a concrete bug. For Q&A open a GitHub Discussion or join our Discord Chat Server.
• The provided reproduction is a minimal reproducible example of the bug.

[sheremet-va]

You need to inline that dependency, using deps.inline config option.

It is not inlined by default because of performance reasons.

[christian-bromann]

@sheremet-va thanks for the quick response, are you saying doing something like this:

export default defineConfig({
  test: {
    deps: {
      inline: ['loglevel'],
    },
    /* for example, use global to avoid globals imports (describe, test, expect): */
    // globals: true,
  },
});

?

[sheremet-va]

@sheremet-va thanks for the quick response, are you saying doing something like this:

You need to inline the dependency that you are using. So, according to you example, you need to inline @wdio/logger.

If you don't inline dependency, it doesn't go through Vite pipeline and can't benefit from our mock system, because it relies on it.

[christian-bromann]

I tried this in the Stackblitz example without success.

[sheremet-va]

They don't bundle ESM, so we cannot mock their call to loglevel. require mocks are not supported in Vitest, because our module resolution is asynchronous.

[christian-bromann]

That makes sense. Thanks for the clarification.

[christian-bromann]

@sheremet-va ok, I found now what the problem was. The dependency was dynamically imported, so e.g. ModuleA depends on ModuleB which depends on ModuleC or ModuleD depending on whether we run in the browser or Node.js environment. If we then have something like this:

if (!EnvRequestLib) {
    EnvRequestLib = process?.versions?.node
        ? (await import('./node')).default
        : (await import('./browser')).default
}

return new EnvRequestLib(method, endpoint, body, isHubCommand)

Then vitest is not able to mock neither ModuleC nor ModuleD. Is this something you think vitest should/can support?

[sheremet-va]

Vitest supports mocking dynamic modules

[christian-bromann]

Vitest supports mocking dynamic modules

But not if they are inlined dependencies. I am trying to build a reproducible but it is quite difficult.

[sheremet-va]

Vitest supports mocking dynamic modules

But not if they are inlined dependencies. I am trying to build a reproducible but it is quite difficult.

Mocking only works with files, that are processed by Vitest. Usually, node modules are not processed. If you use “deps.inline”, then every import inside that dependency will work with mocking system.

[christian-bromann]

@sheremet-va I kindly request to re-open the issue. I went a long way to figure out the problem: you are right that using deps.inline helps to mock a dependency of a dependency. I made a stackblitz example of that here with the original package sources here.

However for some reason this was still not working in my project and and seems to be relative with linking NPM packages when working in Monorepos, e.g. Lerna. Even if setting deps.inline: true it won't be able to resolve the mock and an import returns the original package. So in the example from above if a-vitest-test-modulea would be linked into node_modules the test would fail.

[christian-bromann]

Nevermind, it started to work for random reasons after debugging vitest. Not sure what has changed.