Ajouter une action de menu

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

Dans cet exemple, nous ajoutons une action au menu contextuel de requête dans le hub de requêtes d’élément de travail.

Conseil / Astuce

Pour obtenir les dernières instructions de développement d’extension, notamment les thèmes et la migration à partir de VSS. Sdk, consultez le portail du kit de développement logiciel (SDK) d’extension Azure DevOps.

Prerequisites

Mettre à jour le manifeste d’extension

Ajoutez votre action à la section contributions de votre manifeste d’extension.

...
    "contributions": [
        {
            "id": "myAction",
            "type": "ms.vss-web.action",
            "description": "Run in Hello hub action",
            "targets": [
                "ms.vss-work-web.work-item-query-menu"
            ],
            "properties": {
                "text": "Run in Hello hub",
                "title": "Run in Hello hub",
                "icon": "images/icon.png",
                "groupId": "actions",
                "uri": "action.html"
            }
        }
    ]
...

Propriétés

Propriété Descriptif
texte Texte qui apparaît dans l’élément de menu.
title Texte d’info-bulle qui s’affiche sur l’élément de menu.
icône URL vers une icône qui apparaît dans l’élément de menu. Les URL relatives sont résolues à l'aide de baseURI.
groupId Détermine l’emplacement où cet élément de menu apparaît par rapport aux autres.
URI URI vers une page qui inscrit le gestionnaire d’actions de menu (voir ci-dessous).
registeredObjectId (Facultatif) Nom du gestionnaire d’actions de menu inscrites. La valeur par défaut est l’ID de contributeur.

Découvrez tous les endroits où vous pouvez ajouter des actions dans des points d’extensibilité.

Votre page HTML

Votre action de menu est représentée par un script JavaScript incorporé dans un fichier HTML. Enregistrez le contenu suivant dans un fichier et un emplacement qui correspond à la référence à celui-ci dans le fichier manifeste de votre extension.

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Action Sample</title>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/require.js/2.3.6/require.min.js"></script>
    <script>
        window.requirejs.config({
            enforceDefine: true,
            paths: {
                'SDK': './lib/SDK.min'
            }
        });
        window.requirejs(['SDK'], function (SDK) {
            SDK.init();
            SDK.ready().then(() => {
                // Register the menu action handler
                SDK.register(SDK.getContributionId(), {
                    execute: function (actionContext) {
                        alert("Hello, world");
                    }
                });
            });
        });
    </script>
</head>
<body>
    <div>
        The end user doesn't see the content on this page.
        It runs in the background to handle the contributed menu item being selected.
    </div>
</body>
</html>

Conseil / Astuce

Pour plus d’informations, consultez les points d’extensibilité, les menus et les barres d’outils, le modèle contribution du système de conception de formule, la référence de l’API REST, les exemples d’extension et les ressources dans la communauté des développeurs.

Étapes suivantes

Empaqueter, publier et installer votre extension.

  • Last updated on