Extending VSTS - Setup

Last year Visual Studio Team Services (formerly known as Visual Studio Online) released support for extensions. There are some great samples on GitHub and a growing number of finished extensions in the marketplace. One of my published extensions is Estimate, a planning poker implementation for VSTS.

Extending VSTS is really easy, there is documentation and some great examples at the official GitHub repository.

Since I work on the Agile planning tools and work item tracking, I would like to show with a few simple examples how you can add functionality to your backlogs, boards, and queries. To make it really easy I've published a small seed project that contributes a single menu item to the work item context menu and which will be the base for some extensions with a bit more functionality. If you're already familiar with VSTS extensions feel free to skip immediately to part 2.

The seed project is available at GitHub; here is a step by step description how to build, publish, and install it:

1. First you need a VSTS account, it's free, just register with your Microsoft account.

2. 

3. Generate a personal access token: Login to VSTS, go to My Security:

then to the Personal access tokens section:

4. Clone (or download as zip and extract) the seed project from:
   https://github.com/cschleiden/vsts-extension-ts-seed-simple

5. Install nodejs

6. cd into the folder where you placed the project in step 4

7. Install required dependencies with

npm install

8. Open the extension manifest, vss-extension.json

9. 

10. As part of step 5, the TFS Cross Platform Command Line Interface was installed. This will be used to package and publish the extension. Login to your account by executing

tfx login --service-url https://marketplace.visualstudio.com

• Finally, execute

grunt publish-dev

to build, package, and publish the extension using the development configuration. If everything works the output should be similar to this:

• Share with your account: The extension has now been published as a private extension, no one else can see it yet. To test it, we need to share it with our account. There are two ways, one is using the tfx command line, the other is using again the Marketplace. When you login again you should now see the extension and a Share button:

• Install: After sharing the extension, it should show up in the Manage extensions page of your VSTS account:

• Test: If you now navigate to a query result (create a query and some work items if you haven't) and open the context menu for any work item, you should see the menu action contributed by the extension: