UI testing framework for Visual Studio Code extensions

Features • Packages • Requirements • Quick start • ExTester Runner • Documentation • Known issues

ExTester runs Selenium WebDriver UI tests against a real instance of Visual Studio Code. It downloads VS Code and the matching ChromeDriver, installs your extension, launches the editor and runs your Mocha tests. A Page Object API covers the whole VS Code UI, so your tests never have to touch the editor's DOM.

Features

• Ready-made test environment — downloads a test instance of VS Code (stable or insiders, any supported version) and the ChromeDriver build that matches it.
• Installs your extension into that instance, optionally together with the extensions it depends on.
• Page Object API for the activity bar, side bar, editors, bottom panel, status bar, title bar, dialogs, notifications, web views and more.
• Mocha and TypeScript — tests are ordinary Mocha suites with full type definitions.
• Screenshots of failed tests out of the box, and code coverage with a single flag.
• Custom page objects and locators to cover your own extension's UI.
• CLI and API — run from an npm script with extest, or drive the same steps from your own code.

Packages

Requirements

The full policy, including how the tested VS Code range is kept up to date, is on the Supported Versions page.

Quick start

1. Add ExTester to your extension's devDependencies:

   npm install --save-dev vscode-extension-tester
   

2. Write a test, for example in src/ui-test/example.test.ts:

   import { assert } from "chai";
   import { ActivityBar } from "vscode-extension-tester";
   
   describe("My extension", () => {
     it("shows the Explorer view", async () => {
       const control = await new ActivityBar().getViewControl("Explorer");
       assert.isDefined(control);
     });
   });
   

3. Add an npm script that points extest at the compiled tests, then run it:

   "ui-test": "extest setup-and-run './out/ui-test/**/*.test.js'"
   

   npm run ui-test
   

extest setup-and-run downloads VS Code and ChromeDriver, packages and installs your extension, and runs the tests. Mocha's default 2 second timeout is rarely enough for UI tests, so raise it in a .mocharc.js file. Writing Simple Tests and Test Setup cover every option, including extester.config.json.

ExTester Runner

The ExTester Runner extension adds a view to the Activity Bar that lists your UI tests as a tree, runs a file, a folder or everything with one click, and shows the screenshots and logs from each run. It is also available on Open VSX. See the ExTester Runner guide.

Documentation

The full documentation is at redhat-developer.github.io/vscode-extension-tester.

• Installation and Supported Versions
• Writing Simple Tests
• Test Setup — CLI commands, environment variables and extester.config.json
• Mocha Configuration
• Debugging Tests, Taking Screenshots and Code Coverage
• Custom Page Objects
• Page Object Reference

For a complete, runnable project see the vscode-extension-tester-example repository.

Known issues

Platform caveats and answers to the most common problems are collected in KNOWN_ISSUES.md.

Getting help

• Questions and ideas: GitHub Discussions
• Bugs and feature requests: open an issue
• Security vulnerabilities: follow the security policy

Contributing

Contributions are welcome. The Contribution Guide explains how to build the project, run the test suite and submit a pull request.

License

Apache License 2.0