Les traductions sont fournies par des outils de traduction automatique. En cas de conflit entre le contenu d'une traduction et celui de la version originale en anglais, la version anglaise prévaudra.
# Utilisation de AWS Step Functions Workflow Studio
Les sections suivantes décrivent comment utiliser AWS Step Functions Workflow Studio dans le AWS Toolkit for Visual Studio Code. Pour des informations détaillées sur AWS Step Functions Workflow Studio, consultez la rubrique [Développement de flux](https://docs.aws.amazon.com//step-functions/latest/dg/developing-workflows.html) de travail dans le Guide du *AWS Step Functions*développeur
## Ouverture de Workflow Studio
La liste suivante décrit les différents chemins disponibles pour ouvrir Workflow Studio dans VS Code.
**Note**
Pour utiliser Workflow Studio dans VS Code, l'extension de votre fichier `Amazon State Language` (ASL) qui contient votre définition de machine à états doit se terminer par `asl.json` `asl.yml` ou`asl.yaml`. [Pour plus d'informations sur le téléchargement ou la création d'une nouvelle définition de machine à états dans le AWS kit d'outils, consultez les sections *Téléchargement de machines* à *états et Création d'une nouvelle définition de machine* à états dans la AWS Step Functions rubrique Utilisation de ce guide de l'utilisateur.](https://docs.aws.amazon.com/toolkit-for-vscode/latest/userguide/building-stepfunctions.html)
+ Dans l' AWS explorateur, ouvrez le menu contextuel (clic droit) d'un `ASL` fichier contenant une définition de machine à états, puis choisissez **Ouvrir dans Workflow Studio**.
+ Dans un `ASL` fichier ouvert contenant une définition de machine à états, choisissez l'icône **Ouvrir avec Workflow Studio** située à côté des onglets dans la fenêtre de l'éditeur VS Code.
+ Dans un `ASL` fichier ouvert contenant une définition de machine à états, choisissez la CodeLens commande **Ouvrir avec Workflow Studio**, située en haut du fichier.
+ La fermeture et la réouverture d'un `ASL` fichier contenant une définition de machine à états rouvrent automatiquement le fichier dans Workflow Studio, sauf si le Workflow Studio par défaut est désactivé manuellement.
## Mode design et mode code
Workflow Studio dispose de deux modes pour travailler avec vos `ASL` fichiers contenant une définition de machine à états : le mode **Design** et **le mode Code**. Le mode **Design** fournit une interface graphique pour visualiser vos flux de travail lorsque vous créez des prototypes. Le mode **code** dispose d'un éditeur de code intégré dans lequel vous pouvez afficher, écrire et modifier les `ASL` définitions dans vos flux de travail.
**Note**
Pour des informations détaillées sur chacune des sections de l'interface utilisateur en mode Design et en mode Code, consultez la rubrique [Utilisation de Workflow Studio](https://docs.aws.amazon.com//step-functions/latest/dg/workflow-studio.html) dans le guide du *AWS Step Functions*développeur. Toutes les fonctionnalités de Workflow Studio ne sont pas disponibles dans le AWS Toolkit, comme le **mode Config**, par exemple.
L'interface utilisateur du mode **Design** comporte 7 sections principales, comme indiqué et décrit dans l'image suivante.
1. Boutons de mode : boutons permettant de basculer entre les modes **Design** et **Code**.
1. Boutons utilitaires : ensemble de boutons permettant d'effectuer des tâches, telles que quitter Workflow Studio, enregistrer vos flux de travail ou exporter des `ASL` définitions dans un fichier JSON ou YAML.
1. Barre d'outils de conception : barre d'outils contenant un ensemble de boutons permettant d'effectuer des actions courantes, telles que l'annulation, la suppression et le contrôle du zoom.
1. Navigateur d'états : navigateur contenant drag-and-drop les états de votre canevas de flux de travail. Les états sont organisés en onglets et définis sous la forme d'**actions**, de **flux** et de **modèles**.
1. Le canevas et le graphique du flux de travail : un rendu visuel de votre flux de travail dans lequel vous pouvez supprimer, réorganiser et sélectionner des états pour la configuration.
1. Panneau d'inspection : affichez et modifiez les propriétés de n'importe quel état sélectionné sur le canevas. **En fonction de l'état sélectionné dans le graphique du flux de travail en canevas, les onglets contiennent des options spécifiques à l'état pour la **configuration**, les **entrées/sorties**, les **variables** et la gestion des erreurs.**
1. Liens d'information : ouvre un panneau contenant des informations contextuelles lorsque vous avez besoin d'aide. Ces panneaux incluent également des liens vers des sujets connexes dans le guide du *AWS Step Functions*développeur.
![\[Le mode de conception de l'interface utilisateur de Workflow Studio dans le AWS kit d'outils\]](http://docs.aws.amazon.com/fr_fr/toolkit-for-vscode/latest/userguide/images/SFNWFS022025.png)
## Utilisation de tests à état unique lors de la conception
Depuis l'interface utilisateur des états de test de Workflow Studio, vous pouvez tester les états individuels de votre machine à états. Cela inclut la possibilité de fournir des entrées d'état, de définir des variables et d'effectuer des substitutions à la fois AWS SAM et des substitutions de CloudFormation définitions.
Pour en savoir plus sur l'infrastructure en tant que code (IaC), les définitions des ressources et la transformation des données, consultez les rubriques [Using AWS SAM to build Step Functions workflows](https://docs.aws.amazon.com/step-functions/latest/dg/concepts-sam-sfn.html) et [Transforming data with JSONata in Step Functions](https://docs.aws.amazon.com/step-functions/latest/dg/transforming-data.html) du Guide du *AWS Step Functions*développeur.
La procédure suivante décrit comment ouvrir l'interface utilisateur de l'état de test dans Workflow Studio.
**Ouverture de l'interface utilisateur de l'état de test**
1. Dans l'onglet Mode **design** de Workflow Studio, accédez au canevas et choisissez un état pour l'ouvrir dans le panneau **Inspector**.
1. Dans le panneau **Inspector**, cliquez sur le bouton **Test state**.
1. L'interface utilisateur de **l'état du test** s'ouvre dans VS Code.
L'interface utilisateur de l'état de test comporte 3 onglets principaux : **Entrée de test**, **Arguments et sortie**, Définition de **l'état**. L'onglet **Test input** comporte 3 champs supplémentaires qui vous permettent de fournir une **entrée d'état**, de définir des **variables** et de spécifier **des substitutions de définition** à partir de vos CloudFormation modèles AWS SAM ou modèles. Dans l'onglet **Définition de l'état**, vous pouvez ajuster le flux de travail et effectuer un nouveau test. Lorsque vous avez terminé d'exécuter les tests, vous pouvez appliquer et enregistrer les modifications apportées à la définition de votre machine à états.
La capture d'écran suivante montre l'interface utilisateur de l'état de test, qui inclut une définition des ressources thématiques.
![\[L'interface utilisateur de l'état de test de Workflow Studio dans le AWS Toolkit\]](http://docs.aws.amazon.com/fr_fr/toolkit-for-vscode/latest/userguide/images/SFNWFSteststate022025.png)
## Désactivation de Workflow Studio par défaut
Par défaut, Workflow Studio est l'éditeur par défaut pour `ASL` les fichiers contenant une définition de machine à états. Vous pouvez désactiver le paramètre par défaut en modifiant votre `settings.json` fichier dans votre `.vscode` répertoire local. Si vous désactivez Workflow Studio par défaut, il est toujours accessible via les méthodes répertoriées dans la section *Ouverture de Workflow Studio*, située dans cette rubrique.
Pour modifier votre `settings.json` fichier depuis VS Code, procédez comme suit.
1. Dans VS Code, ouvrez la **palette de commandes** en appuyant sur **option\$1shift\$1p** (Mac) ou **ctrl\$1shift\$1p** (Windows).
1. Dans la **palette de commandes** VS Code, entrez **Open User Settings (JSON)** dans le champ de recherche et choisissez l'option lorsqu'elle apparaît dans la liste.
1. `settings.json`Dans votre éditeur, ajoutez la modification suivante à votre fichier.
```
{
"workbench.editorAssociations": {
// Use all the following overrides or a specific one for a certain file type
"*.asl.json": "default",
"*.asl.yaml": "default",
"*.asl.yml": "default"
}
}
```
1. Enregistrez vos modifications `settings.json` et actualisez ou redémarrez VS Code.