Partager via

Points d’extensibilité

Azure DevOps Services | Azure DevOps Server | Azure DevOps Server 2022

Les extensions ajoutent des fonctionnalités à l’interface utilisateur Azure DevOps et à l’aire REST. Cet article répertorie les points d’extensibilité les plus courants que vous pouvez cibler et affiche les ID que vous utilisez dans votre manifeste d’extension. Pour obtenir une vue d’ensemble du modèle d’extension et des modèles de contribution, consultez le modèle de contribution.

Conseil / Astuce

Si vous démarrez une nouvelle extension Azure DevOps, essayez d'abord ces collections d'exemples maintenues : elles fonctionnent avec les builds de produit actuels et couvrent les scénarios modernes (par exemple, en ajoutant des onglets sur les pages de requête de tirage).

Si un exemple ne fonctionne pas dans votre organisation, installez-le dans une organisation personnelle ou de test et comparez les ID cibles et les versions d’API du manifeste d’extension avec les documents actuels. Pour obtenir des informations de référence et des API, consultez :

Hubs et groupes de hubs

Les hubs et les groupes de hubs fournissent une navigation principale dans Azure DevOps (par exemple, Fichiers, Versions, Backlogs, Requêtes). Un hub appartient à un groupe hub ; Par exemple, le hub Files appartient au groupe hub Azure Repos au niveau du projet. Les groupes hub peuvent exister au niveau de l’organisation/de la collecte ou au niveau du projet. La plupart des extensions contribuent au niveau du projet.

Le tableau suivant répertorie les groupes hub courants et leurs ID de contribution.

Nom id Niveau Aperçu de l'image
Azure Boards ms.vss-work-web.work-hub-group Projet/équipe Capture d’écran du hub de travail personnalisé ajouté à Azure Boards.
Azure Repos ms.vss-code-web.code-hub-group Projet/équipe Capture d’écran du hub de travail personnalisé ajouté à Azure Repos.
Azure Pipelines ms.vss-build-web.build-release-hub-group Projet/équipe Capture d’écran du hub personnalisé ajouté à Azure Pipelines.
Azure Test Plans (Plans de test Azure) ms.vss-test-web.test-hub-group Projet/équipe Capture d’écran du hub personnalisé ajouté aux plans de test Azure.
Paramètres du projet ms.vss-web.project-admin-hub-group Projet Capture d’écran du hub d’administration de projet personnalisé.
Paramètres de l’organisation ms.vss-web.collection-admin-hub-group Organisation/collection Capture d’écran du hub d’administration d’organisation personnalisé.

Contribuer à un hub

Cet exemple montre une contribution au hub qui cible le groupe hub de code :

{
  "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 est le type de contribution. L’extension vss-web publiée sous l’éditeur ms définit ce type. Ce type définit les propriétés facultatives et requises pour les contributions de ce type (par exemple, nom, ordre).
  • ms.vss-code-web.code-hub-group est l’ID complet de la contribution du groupe hub que ce hub cible. L’extension vss-code-web publiée sous l’éditeur ms déclare cette contribution.
  • my-custom-hub est l’ID court de cette contribution ; {publisherId}.{extensionId}.my-custom-hub est l’ID complet.

Ajouter une icône à votre menu ou barre d’outils

Ajoutez une propriété d’icône pour pouvoir la référencer directement par nom.

Nous vous recommandons de fournir votre propre icône. À l’aide de votre propre exemple d’icône :

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

À l'aide de l'exemple Office UI Fabric Icons :

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

Note

Les icônes, icon et les propriétés iconName, ne prennent pas en charge les contributions des onglets. Ils fonctionnent uniquement pour les hubs, les menus et les barres d’outils.

Paramètres des menus et des barres d’outils

Nom ID de la cible
Barre d’outils Vue d’ensemble de l’organisation/collection ms.vss-admin-web.collection-overview-toolbar-menu
Grille de présentation des projets de la collection ms.vss-admin-web.projects-grid-menu
Barre d’outils Vue d’ensemble du projet ms.vss-admin-web.project-overview-toolbar-menu
Grille de vue d'ensemble des équipes du projet ms.vss-admin-web.teams-grid-menu

Menu et barre d’outils Azure Boards

Nom ID de la cible Aperçu de l'image
Menu d'interrogation des éléments de travail ms.vss-work-web.work-item-query-menu Capture d’écran de l’action de requête personnalisée ajoutée au menu de requête.
Menu de la barre d'outils des résultats de la requête d'élément de travail ms.vss-work-web.work-item-query-results-toolbar-menu Capture d'écran de l'action du menu de la barre d'outils personnalisée Résultats de la requête.
Menu des résultats de la requête de l'élément de travail ms.vss-work-web.query-result-work-item-menu Capture d’écran de l’action personnalisée dans le menu des résultats de la requête.
Onglet des résultats de la requête de l'élément de travail ms.vss-work-web.query-tabs Capture d’écran de l’onglet pivot personnalisé de la barre d’outils de requête.
Élément de travail pour le menu contextuel ms.vss-work-web.work-item-toolbar-menu Capture d'écran des actions de la barre d'outils des éléments de travail personnalisés.
Menu des éléments du carnet de commandes ms.vss-work-web.backlog-item-menu Capture d'écran des options du menu personnalisé des actions sur les éléments du backlog.
Menu filtre pivot du tableau de sprint ms.vss-work-web.sprint-board-pivot-filter-menu Capture d'écran du menu du filtre pivot du tableau de sprint.
Menu du filtre pivot du tableau ms.vss-work-web.backlog-board-pivot-filter-menu Capture d'écran des actions du filtre pivot du tableau des backlogs.
Menu de la carte ms.vss-work-web.backlog-board-card-item-menu
Onglet Backlog du produit ms.vss-work-web.product-backlog-tabs Capture d'écran de l'onglet personnalisé du carnet de commandes du produit.
Onglet Backlog d'itération ms.vss-work-web.iteration-backlog-tabs Capture d'écran des itérations Onglet personnalisé du carnet de bord.
Volet du carnet de commandes du portefeuille ms.vss-work-web.portfolio-backlog-toolpane Capture d'écran du volet personnalisé du carnet de commandes du portefeuille.
Volet du carnet de commandes du produit ms.vss-work-web.requirement-backlog-toolpane Capture d'écran du volet personnalisé du carnet de commandes du produit.
Volet de backlog d'itération ms.vss-work-web.iteration-backlog-toolpane Capture d'écran du volet personnalisé du carnet de bord de l'itération.

Menu et barre d’outils Azure Pipelines

Nom ID de la cible Aperçu
Menu de construction terminé ms.vss-build-web.completed-build-menu Capture d’écran des actions de génération terminées.
Action de la barre d'outils Résultats des tests ms.vss-test-web.test-results-actions-menu Capture d'écran de l'action de la barre d'outils des résultats du test.
Onglet Détails du résultat de test ms.vss-test-web.test-result-details-tab-items Capture d’écran de l’onglet Détails du résultat du test.
Menu contextuel de l'explorateur de pipeline de validation ms.vss-releaseManagement-web.release-definition-explorer-context-menu Capture d’écran du menu contextuel de l’Explorateur de définitions.
Vue détaillée du pipeline, bouton d'en-tête ms.vss-build-web.pipelines-header-menu Capture d’écran de la vue des détails du pipeline, menu d’en-tête.
Vue détaillée du pipeline, menu contextuel du dossier ms.vss-build-web.pipelines-folder-menu Capture d’écran de la vue des détails du pipeline, menu contextuel du dossier.

Tâches Azure Pipelines

Les tâches permettent d'effectuer des travaux dans un build ou une release. Pour plus d’informations, consultez Ajouter une extension de tâche de pipelines personnalisée.

Menu et barre d’outils Azure Repos

Nom ID de la cible Aperçu de l'image
Menu de l'élément source (grille) ms.vss-code-web.source-grid-item-menu Capture d'écran des actions de la grille d'éléments du référentiel.
Menu de l'élément source (arbre) ms.vss-code-web.source-tree-item-menu Capture d'écran des actions disponibles dans l'arborescence des éléments du référentiel.
Menu de l'élément source (tableau et arborescence) ms.vss-code-web.source-item-menu Capture d'écran des actions sur les éléments du référentiel.
Modifier le menu de l'élément de liste ms.vss-code-web.change-list-item-menu
Menu des éléments du résumé de la liste des modifications ms.vss-code-web.change-list-summary-item-menu
Menu de l'arbre des branches de Git ms.vss-code-web.git-branches-tree-menu Capture d’écran de l’arborescence des branches Git.
Menu des actions de demande de tirage Git ms.vss-code-web.pull-request-action-menu Capture d’écran des actions de pull request git.
Onglets de demande de tirage Git (pivots) ms.vss-code-web.pr-tabs Capture d'écran de l'onglet demande de tirage.
Menu de la liste des livraisons de Git ms.vss-code-web.git-commit-list-menu Capture d’écran du menu liste de validation Git.
Menu détaillé des livraisons Git ms.vss-code-web.git-commit-details-menu Capture d'écran du menu détaillé git commit.

Menu et barre d’outils Plans de test Azure

Nom ID de la cible Aperçu de l'image
Menu de la grille d'exécution des tests ms.vss-test-web.test-run-grid-menu Capture d'écran du menu de la grille de test.
Menu arborescence des suites de plans de test ms.vss-test-web.test-plans-suites-context Capture d'écran du menu de la grille de test.
Onglet pivot du hub de plan de test ms.vss-test-web.test-plan-pivot-tabs Capture d’écran de l’onglet pivot du hub de test.

Autres points d’extensibilité

  • Widget de tableau de bord : une extension peut contribuer à un nouveau type de widget que les utilisateurs peuvent ajouter à un tableau de bord. Découvrez comment contribuer à un widget de tableau de bord.
  • Formulaire d’élément de travail : les extensions améliorent le formulaire d’élément de travail avec de nouvelles sections, onglets, actions, et rendeurs de champs personnalisés. Pour plus d'informations, lisez comment étendre le formulaire des éléments de travail.
  • Hooks de service : un consommateur est le service auquel les Hooks de service envoient des événements. Une extension peut contribuer aux services grand public. Un utilisateur (ou programmatiquement) configure ces services pour envoyer des événements à ce service. Pour plus d'informations, veuillez consulter Créer un consommateur personnalisé pour les hooks de service.
  • Last updated on