Aller au contenu principal

Web IDE

Le Web IDE est un éditeur de code complet, sur le modèle de VS Code, qui s'ouvre dans votre navigateur sur une branche du projet. Il vous permet de modifier le code sans rien installer, de commiter (ce qui lance le pipeline de la branche), d'ouvrir un terminal sur l'environnement, de vous faire aider par Karizma Agent et de résoudre les conflits d'une merge request.

Accès

Bouton Web IDE de la page projet. Deux conditions sont nécessaires :

  • votre rôle doit permettre le Web IDE : tous les rôles peuvent l'ouvrir, mais seuls les Super Admin, Admin et Developer peuvent commiter ;
  • le type de branche (production, staging, migration, développement) doit faire partie de votre Web IDE Access. Pour le modifier, contactez votre interlocuteur Karizma. Un Super Admin a toujours accès à toutes les branches.
Le Web IDE ouvert sur une branche de staging
Le Web IDE ouvert sur une branche de staging

Ouvrir le Web IDE​

  1. Sur la page projet, sélectionnez la branche.
  2. Cliquez sur Web IDE dans la barre d'actions. Le Web IDE s'ouvre dans un nouvel onglet du navigateur.

La barre de titre rappelle le projet et la branche. Si vous n'avez pas accès à la branche, un écran Access Denied s'affiche avec les boutons Go to my projects et Close IDE. Si votre session a expiré, l'écran Sign in required vous propose de vous reconnecter.

À la première ouverture, la page d'accueil présente les fonctions principales et des bonnes pratiques (Web IDE Best Practices), par exemple garder les modules Odoo à la racine du dépôt.

Modifier et commiter du code​

Le Web IDE ne fonctionne pas tout à fait comme un éditeur installé sur votre poste : enregistrer n'envoie rien vers GitLab.

  1. Modifiez vos fichiers dans l'éditeur.
  2. Enregistrez (Ctrl+S) : la modification est préparée dans le Web IDE, dans votre navigateur. Rien n'est encore envoyé.
  3. Ouvrez la vue Source Control. Le groupe Changes liste les fichiers ajoutés, modifiés, supprimés ou renommés. Open Changes affiche les différences d'un fichier.
  4. Saisissez un message de commit, puis cliquez sur Commit.

Toutes les modifications préparées partent en un seul commit sur la branche. Ce commit lance le pipeline de la branche : sur une staging ou sur la production, le code est construit puis déployé. Voir Déploiements et pipelines. Chaque commit est inscrit dans le journal d'audit (IDE Commit).

Commitez avant de fermer l'onglet

Tant que vous n'avez pas commité, vos modifications ne sont conservées que dans l'onglet du navigateur. Commitez avant de fermer ou de recharger la page.

Dans Source Control, vous pouvez aussi :

  • annuler les modifications d'un fichier (Discard Changes) ou de tous (Discard All Changes) ; cette action est définitive ;
  • faire rédiger le message de commit par l'IA avec Generate Commit Message with Karizma Agent.
remarque

Le volume total des modifications préparées est limité à 50 Mo.

Changer de branche​

L'élément de branche, dans la barre d'état en bas de l'écran, ouvre deux commandes :

  • Switch Branch… ouvre une autre branche du projet. Si vous avez des modifications non commitées, le Web IDE vous demande de les abandonner (Discard and switch).
  • Create New Branch… crée une branche puis ouvre le Web IDE dessus.

La vue Branch Compare compare deux branches : choisissez From (base) et To (target), puis lancez la comparaison.

Utiliser le terminal​

Le panneau Terminal ouvre une console sur le serveur de la branche, comme l'onglet SHELL, avec les mêmes droits. Il n'est disponible que sur la production et les stagings : une branche de développement ou de migration n'a pas de serveur.

Se faire aider par Karizma Agent​

Karizma Agent est l'assistant IA du Web IDE. Ouvrez sa conversation depuis la barre d'état (Toggle the Karizma Agent chat).

ModeFonctionnement
AgentL'assistant lit et parcourt lui-même les fichiers de la branche, y compris vos modifications non commitées, puis propose des modifications. Activé par défaut.
AskL'assistant répond à vos questions, sans parcourir lui-même les fichiers du projet.

Passez d'un mode à l'autre avec le sélecteur de la barre d'état, ou pour un seul message en le commençant par /agent ou /ask.

Les modifications proposées apparaissent dans les fichiers concernés (Created, Edited). Acceptez-les toutes avec Keep all. Elles sont préparées, pas commitées : relisez-les, puis commitez.

Depuis l'éditeur, d'autres commandes s'appuient sur l'assistant : Explain Selection, Refactor / Debug Selection, Modify Selection with an Instruction…, Insert Code at Cursor… et New Odoo Module via AI…, qui génère un module à partir d'une description.

Conditions d'utilisation
  • Karizma Agent n'est pas disponible sur la branche de production. Travaillez sur une staging ou une branche de développement.
  • Il faut pouvoir commiter sur la branche (Super Admin, Admin ou Developer).
  • Le projet doit avoir une clé Karizma AI active. Sinon, la conversation affiche This project has no active Karizma AI key : contactez votre interlocuteur Karizma.

Le sélecteur de modèle propose KZM AI (default model) et les modèles ouverts par la clé du projet (Project key) ou par votre organisation (Offered by organization). La consommation est décomptée du budget de la clé.

Les réglages de l'IA du projet (clé, budget, instructions, activation du mode Agent) sont gérés par l'équipe Karizma : contactez votre interlocuteur Karizma. Si le mode Agent est désactivé pour le projet, chaque message est traité en mode Ask.

Résoudre les conflits d'une merge request​

Lorsqu'une merge request est en conflit avec sa branche cible, vous pouvez résoudre le conflit dans le Web IDE.

  1. Sur la page de la merge request, cliquez sur Resolve in Web IDE. Le Web IDE s'ouvre sur la branche source et affiche la vue Merge Conflicts, qui liste les fichiers en conflit.
  2. Ouvrez un fichier. Au-dessus de chaque zone en conflit, choisissez :
    • Accept Current pour garder la version de la branche source ;
    • Accept Incoming pour garder la version de la branche cible ;
    • Accept Both pour garder les deux.
  3. Pour un fichier entier, utilisez Take the Left Side (source branch) ou Take the Right Side (target branch). Side by side affiche les deux versions côte à côte.
  4. Une fois tous les fichiers résolus, cliquez sur Resolve and commit.

La résolution est commitée sur la branche source sous forme de commit de fusion : GitLab considère le conflit comme résolu et la merge request peut être fusionnée. Le Web IDE refuse la résolution tant qu'un fichier contient encore des marqueurs de conflit ou qu'un fichier en conflit n'est pas traité. Cette action est réservée aux Super Admin et Admin.

Personnaliser l'éditeur​

Le Web IDE propose plusieurs thèmes (Karizma, Night Owl, GitHub Dark, GitHub Light, One Dark, Dracula, Monokai, Nord, Solarized Dark, Tomorrow Night, Cobalt2). Vos réglages et raccourcis clavier sont enregistrés dans votre profil et vous suivent d'un projet à l'autre.

Voir aussi​