unable to import vscode in test using jest

[matthoang08]

Hi, I'm trying to run some integration tests for my vscode extension using jest. Unit tests work fine since I'm able to mock vscode however, when I'm trying to run an integration test I'm getting Cannot find module 'vscode' in the files when i'm using vscode api (import * as vscode from 'vscode')

jest config looks like this:

module.exports = {
  moduleFileExtensions: ['js'],
  testMatch: ['<rootDir>/out/test/**/*.int.test.js'],
  verbose: true,
};

runTest.ts

import * as path from 'path';
import { runTests } from 'vscode-test';

async function main() {
	try {
		// The folder containing the Extension Manifest package.json
		// Passed to `--extensionDevelopmentPath`
		const extensionDevelopmentPath = path.resolve(__dirname, '../../');

		// The path to the extension test script
		// Passed to --extensionTestsPath
		const extensionTestsPath = path.resolve(__dirname, './suite/index');

		// Download VS Code, unzip it and run the integration test
		console.log(`running tests... ext path: ${extensionTestsPath}`);
		await runTests({
			extensionDevelopmentPath,
			extensionTestsPath,
			launchArgs: ['--disable-extensions']
		});
	} catch (err) {
		console.error('Failed to run tests', err);
		process.exit(1);
	}
}

main();

index.ts

import * as path from 'path';
import { runCLI } from 'jest-cli';
import * as vscode from 'vscode';

export function run(): Promise<void> {

  return new Promise((resolve, reject) => {
    const projectRootPath = path.join(__dirname, '../../../');
    const config = path.join(projectRootPath, 'jest.e2e.config.js');

    vscode.window.showInformationMessage('Run suite');

    runCLI({ config } as any, [projectRootPath])
      .then(jestCliCallResult => {
        console.log(`complete: ${JSON.stringify(jestCliCallResult)}`);
        console.log('print results');
        jestCliCallResult.results.testResults
          .forEach(testResult => {
            testResult.testResults
              .filter(assertionResult => assertionResult.status === 'passed')
              .forEach(({ ancestorTitles, title, status }) => {
                console.info(`  ● ${ancestorTitles} › ${title} (${status})`);
              });
          });

        console.log('check results');
        jestCliCallResult.results.testResults
          .forEach(testResult => {
            if (testResult.failureMessage) {
              console.error(testResult.failureMessage);
            }
          });
        resolve();
      })
      .catch(errorCaughtByJestRunner => {
        console.error('error in test runner', errorCaughtByJestRunner);
        reject(errorCaughtByJestRunner);
      });
  });
}

I installed both vscode-test and @types/vscode as dev dependencies. I'm not sure why my tests are unable to find the 'vscode' dependency. Vscode is the only dependency that has this issue, other modules work fine. Can anyone help?

Thanks!

[octref]

Hi @matthoang08, thanks for giving jest a try. vscode is provided in the extension host environment where VS Code runs extensions.

Would https://jestjs.io/docs/en/configuration#globals-object or https://jestjs.io/docs/en/configuration#globalsetup-string help you? jestjs/jest#708 also seems to mention handling global jquery.

I can give it a try later in Monday as well. If this works I can put together an official recipe.

[PeterPorzuczek]

I was able to reference vscode instance in my tests only through process variable, maybe I was doing something wrong with the globals setup but vscode package couldn't be required there as @octref proposed.

So to make it work with process variable in typescript you have to define your typing anywhere in your project as a separate file ex. process.d.ts
Preview:

declare namespace NodeJS {
	export interface Process {
		vscode?: any
	}
}

Then in suite/index.ts import vscode and set process.vscode, before run function definition
Preview:

import * as path from 'path';
import { runCLI } from 'jest-cli';
import * as vscode from 'vscode';

process.vscode = vscode;

export function run(): Promise<void> {
  return new Promise((resolve, reject) => {
       ...

And finally in your test file you can reference process.vscode
Preview:

describe('Extension Test Suite', () => {
	beforeEach(() => {
		process.vscode.window.showInformationMessage('Start all tests.');
	});

	it('Sample test', () => {
		process.vscode.commands.executeCommand('extension.helloWorld');
		expect(1).toBe(1);
	});
});

It is very hacky way of accessing vscode instance, so try to find a better solution. I just post my findings FYI.

[marcopierobon]

Are you sure this actually works? I've tried implementing that, but it still fails with the same error when the tests try to load the file that is still loading vscode (in your example that would be the one containing function run())

[spnq]

Any progress on this?
I tried to run my .spec.ts files with ts-jest and babel-jest, because I thought es6 import has to be transpiled before the test run and that caused the error, but vscode import itself seems to be the issue.

[rmi22186]

having this issue also. Cannot find module 'vscode' even though all other modules are found okay...

[rmi22186]

seems like it can't be imported for tests, but it can be by the vs code extension when you do an e2e test. does that sound right?

[mnovakovic]

Any updates on this? I am having the same problem in my setup.

[vinnichase]

I found a very slim workaround!

I was also struggling like hell with that. I found that article which got me on the right track: https://www.richardkotze.com/coding/unit-test-mock-vs-code-extension-api-jest

However to make it run in the default TypeScript extension workflow you need to put the __mocks__ folder (yes plural, not singular as stated in the article) under your rootDir as defined in the tsconfig.json. In the default extension boilerplate it's ./src.

Within the __mocks__ folder you create a vscode.ts (not .js as described in the article) with the following content.

export const vscode = {
  // mock the vscode API which you use in your project. Jest will tell you which keys are missing.
};

In my case an empty vscode object was enough since I only use types and interfaces from the vscode namespace. I would recommend the same for all of you for the major parts of the extension logic. Interacting with the vscode API can be limited to the extension.ts which is not unit tested but covered by e.g. end-to-end-tests.