Extensibility points

TFS 2018

Extensions enhance the Azure DevOps user experience by contributing new capabilities. In this article, we highlight the most common extensibility points that your extension can target. For more information about the Azure DevOps extensibility model, see the Contribution model.

The Contributions Guide extension is a sample extension. Install this extension into your organization. Once it's installed, you see the extensibility points that are available. We recommend you install this extension into a personal or test organization. The source for this extension is also available. Also, find a sample of a repository creation extension point here.

For more information, see the following references:

Hubs and hub groups

Hubs and hub groups are the primary navigation elements in Azure DevOps. Files, Releases, Backlogs, and Queries are examples of hubs. A hub belongs to a hub group. The Files hub, for example, belongs to the project-level Azure Repos hub group. Hub groups can exist at the organization or collection level or the project level. Most extensions contribute to the project level.

The following table describes the most common hub groups in Azure DevOps that you can contribute hubs to.

Name ID Level Preview image
Code ms.vss-code-web.code-hub-group Project/team Custom code hub, TFS versions
Work ms.vss-work-web.work-hub-group Project/team Custom work hub, TFS versions
Build and Release ms.vss-build-web.build-release-hub-group Project/team Custom build and release hub, TFS versions
Test ms.vss-test-web.test-hub-group Project/team Custom test hub, TFS versions
Project settings ms.vss-web.project-admin-hub-group Project Custom project admin hub, TFS versions
Collection settings ms.vss-web.collection-admin-hub-group Collection Custom collection admin hub, TFS versions

Example

The following example shows how to contribute a hub to the Code hub group:

{
    ...
    "contributions": [
        {
            "id": "my-custom-hub",
            "type": "ms.vss-web.hub",
            "targets": [
                "ms.vss-code-web.code-hub-group"
            ],
            "properties": {
                "name": "Code Hub",
                "order": 30,
                "uri": "/views/code/custom.html"
            }
        }
    ]
}
  • ms.vss-web.hub is the type of this contribution. This type is defined in the vss-web extension published under the ms publisher. This type declares optional and required properties that are required by contributions of this type (for example, name, order, and so on).
  • ms.vss-code-web.code-hub-group is the full ID of the hub group contribution this hub is targeting. This contribution is declared in the vss-code-web extension published under the ms publisher
  • my-custom-hub is the short ID of this contribution; {publisherId}.{extensionId}.my-custom-hub is the full ID

Add an icon to your menu or toolbar

Add an icon property, so it can be used directly by name.

We recommend providing your own icon. Using your own icon example:

           "name": "Sample hub",
           "uri": "dist/Hub/Hub.html",
           "icon": "asset://static/sample-icon.png",
           "supportsMobile": true
       }

Using the Office UI Fabric Icons example:

            "iconName": "Code",
            "name": "Code Hub",
            "order": 30,
            "uri": "/views/code/custom.html"
        }

Settings for menus and toolbars

Name Target ID
Organization/collection) overview toolbar ms.vss-admin-web.collection-overview-toolbar-menu
Collection overview projects grid ms.vss-admin-web.projects-grid-menu
Project overview toolbar ms.vss-admin-web.project-overview-toolbar-menu
Project overview teams grid ms.vss-admin-web.teams-grid-menu

Work menu and toolbar

Name Target ID Preview image
Work item query menu ms.vss-work-web.work-item-query-menu Custom query action added to query menu, TFS versions
Work item query results toolbar menu ms.vss-work-web.work-item-query-results-toolbar-menu Query Results custom toolbar menu action, TFS versions
Work item query results menu item ms.vss-work-web.query-result-work-item-menu Query Result Item Menu custom action, TFS versions
Work item query results tab ms.vss-work-web.query-tabs Query toolbar custom pivot tab, TFS versions
Work item for context menu ms.vss-work-web.work-item-toolbar-menu Custom work item toolbar actions, TFS versions
Backlog item menu ms.vss-work-web.backlog-item-menu Backlog item actions custom menu options, TFS versions
Sprint board pivot filter menu ms.vss-work-web.sprint-board-pivot-filter-menu Sprint Board Pivot Filter Actions, TFS versions
Board pivot filter menu ms.vss-work-web.backlog-board-pivot-filter-menu Backlog Board Pivot Filter Actions, TFS versions
Card menu ms.vss-work-web.backlog-board-card-item-menu
Product backlog tab ms.vss-work-web.product-backlog-tabs Product Backlog Custom Tab, TFS versions
Iteration backlog tab ms.vss-work-web.iteration-backlog-tabs Iterations Backlog Custom Tab, TFS versions
Portfolio backlog pane ms.vss-work-web.portfolio-backlog-toolpane Portfolio Backlog Custom Pane, TFS versions
Product backlog pane ms.vss-work-web.requirement-backlog-toolpane Product Backlog Custom Pane, TFS versions
Iteration backlog pane ms.vss-work-web.iteration-backlog-toolpane Iteration Backlog Custom Pane, TFS versions

Build menu and toolbar

Name Target ID Preview image
Completed build menu ms.vss-build-web.completed-build-menu Completed Build Actions, TFS versions
Build definitions menu ms.vss-build-web.build-definition-menu Build Definition Actions, TFS versions
Test results toolbar action ms.vss-test-web.test-results-actions-menu Test Results Toolbar Action, TFS versions
Test result details tab ms.vss-test-web.test-result-details-tab-items Test Result Details Tab, TFS versions

Release menu and toolbar

Name Target ID Preview
Release pipeline explorer context menu ms.vss-releaseManagement-web.release-definition-explorer-context-menu Definition Explorer Context Menu, TFS versions
Release pipeline explorer toolbar menu ms.vss-releaseManagement-web.release-definition-explorer-toolbar-menu Definition Explorer Toolbar Menu, TFS versions
Release summary toolbar menu ms.vss-releaseManagement-web.release-editor-tool-bar-menu Release Summary Toolbar Menu, TFS versions
Release summary tab ms.vss-releaseManagement-web.release-details-view Release Summary Tab, TFS versions
Release summary section ms.vss-releaseManagement-web.release-details-summary-tab Release Summary Section, TFS versions

Code menu and toolbar

Name Target ID Preview image
Source item (grid) menu ms.vss-code-web.source-grid-item-menu Source Item Grid Actions, TFS versions
Source item (tree) menu ms.vss-code-web.source-tree-item-menu Source Item Tree Actions, TFS versions
Source item (grid and tree) menu ms.vss-code-web.source-item-menu
Change list item menu ms.vss-code-web.change-list-item-menu
Change list summary item menu ms.vss-code-web.change-list-summary-item-menu
Git branches tree menu ms.vss-code-web.git-branches-tree-menu Git Branches Tree, TFS versions
Git pull request actions menu ms.vss-code-web.pull-request-action-menu Git Pull Request Actions, TFS versions
Git pull request tabs (pivots) ms.vss-code-web.pr-tabs Git Pull Request Tab, TFS versions
Git commit listing menu ms.vss-code-web.git-commit-list-menu Git Commit List Menu, TFS versions
Git commit detail menu ms.vss-code-web.git-commit-details-menu Git Commit Detail Menu, TFS versions

Test menu and toolbar

Name Target ID Preview image
Test run grid menu ms.vss-test-web.test-run-grid-menu
Test plan suites tree menu ms.vss-test-web.test-plans-suites-context
Test plan hub pivot tab ms.vss-test-web.test-plan-pivot-tabs Test Hub Pivot Tab, TFS versions

Other extensibility points

  • Dashboard widget: An extension can contribute a new type of widget that can be added by users to a dashboard. Learn how to contribute a dashboard widget.
  • Work item form: The work item form is enhanced by extensions with new sections, tabs, actions, and custom field renderers. For more information, learn how to extend the work item form.
  • Service hooks: A "consumer" is the service that events are sent to in Service Hooks. An extension can contribute consumer services. These services get configured by a user (or programmatically), to send events to that service. For more information, see contribute a service hooks consumer.
  • Features:

Name: Feature (on-premises only)
Target ID: ms.vss-web.managed-features-onprem