Recettes
Les modifications les plus courantes, pas à pas. Chacune renvoie à la page qui en explique le pourquoi. Dans tous les cas, finir par npm run lint, npm test, npm run build, une vérification dans le navigateur, et la documentation dans le même commit.
Ajouter un texte à l'interface
- Ajouter la clé dans
src/i18n/messages/en.ts, à sa place dans l'arborescence (fileExplorer.…,git.dialogs.…). - L'ajouter dans les neuf autres langues (
fr,de,es,it,pt,nl,pl,ru,uk), avec leurs formes de pluriel si le message a uncount. - L'utiliser :
t('ma.cle', { name })dans un service ou un store,i18nStore.t(…)dans un composant.
Le typage refuse une clé inexistante ; tests/interface/i18n.spec.ts refuse une langue incomplète. Voir Langues de l'interface.
Ajouter une action de l'IDE (menu, palette, raccourci)
- Déclarer une
Commanddans une source desrc/commands/catalog.ts:idstable,category,title: () => t('commands.…'),icon, éventuellementkeybinding(Mod-k),enabled(),checked(), etrun(), qui appelle un store ou un composable. - Pour la faire figurer dans un menu, ajouter son
iddanssrc/commands/menus.ts. - Si elle concerne Git, la mettre dans
gitCommands: elle disparaîtra quand la page hôte désactive Git.
tests/interface/commands.spec.ts vérifie que chaque entrée de menu existe et qu'aucun raccourci n'est attribué deux fois. Voir Commandes.
Ajouter une commande au terminal
Écrire un
ShellCommanddans le module de sa famille (src/services/terminal/fs/,git/,python/,system.ts) :tsexport const hello: ShellCommand = { name: 'hello', group: 'system', usage: 'terminal.cmd.hello.usage', summary: 'terminal.cmd.hello.summary', run: (args, ctx) => stdout(t('terminal.hello', { dir: ctx.ws.relative(ctx.cwd) })), }L'ajouter au registre
COMMANDS(src/services/terminal/index.ts) : l'aide et la complétion la proposent seules.Ses textes (
usage,summary, sorties) dans les dix langues.Un test dans
tests/terminal/aveccreateShell()(tests/helpers/terminal.ts).
La commande ne touche que le TerminalContext (ctx.ws, ctx.cwd, ctx.io…), jamais un store. Voir Terminal.
Ajouter un langage
- Créer
src/languages/<langage>.tsqui exporte unLanguageSupport(extensions, coloration, et ce qu'il sait faire : exécution, analyse, formatage, plan). - L'ajouter à
LANGUAGES(src/languages/index.ts). - S'il s'exécute par un noyau Basthon : ajouter le paquet
@basthon/kernel-<x>(même version que les autres), son entrée dansKERNEL_CLASSES(src/services/kernels.ts) et dansvite-plugin-basthon.ts. - Son icône dans
src/utils/fileIcons.tssi besoin.
Voir Langages.
Modifier ce qui s'écrit dans le workspace
- Écrire par
vfs(ouworkspace.fs), ou pargitServicepour une opération Git. - Plusieurs écritures : les envelopper dans
vfs.batch(ouworkspace.batchsi Git est concerné). - Ne rien rafraîchir à la main ; si un nouvel état doit suivre le workspace, l'abonner dans son store :
onScopeDispose(vfs.onChange(…)). - Si isomorphic-git écrit des fichiers de travail hors de
gitService, appelervfs.notifyChange().
Voir Stores et synchronisation.
Faire évoluer le format des liens de partage
Le format d'instantané est versionné (SNAPSHOT_VERSION, src/services/project/snapshot.ts).
- Augmenter
SNAPSHOT_VERSIONet décrire le nouveau format dansProjectSnapshot. - Adapter
isProjectSnapshot; pour garder les anciens liens, convertir l'ancienne version plutôt que de l'accepter telle quelle. - Mettre à jour
tests/project/project-snapshot.spec.tset Le projet et ses formats.
Ajouter une option réglable par la page hôte
- L'ajouter à
EmbeddingOptions,DEFAULT_EMBEDDING_OPTIONSetparseOptions(src/services/embedding.ts). - L'exposer dans le store
embedding, puis l'appliquer par abonnement réactif dans les stores concernés. - La tester dans
tests/interface/embedding.spec.tset la décrire dans Intégration dans une page hôte : c'est le contrat avec Capytale.
Ajouter une extension intégrée
- Déclarer son identifiant dans
ExtensionId(src/services/extensions/types.ts). - Définir sa fiche dans
BUILTIN_EXTENSIONS(src/services/extensions/index.ts) :id,nameKey,descriptionKey,author,version,icon(icône Lucide ou logo SVG officiel), et son activation par défaut (defaultEnabled: boolean). - Ajouter ses libellés traduits dans les dix langues (
src/i18n/messages/). - Conditionner l'apparition de ses commandes, boutons ou panneaux avec
extensionsStore.isEnabled(id). - Tester son activation, sa persistance et ses effets dans
tests/interface/extensions.spec.ts.
Ajouter un composant
- Le ranger dans le dossier de sa zone (
layout/,sidebar/,editor/,console/,common/) ; s'il grossit, ses sous-composants vont dans un dossier à son nom. - Il lit les stores et appelle leurs actions lui-même ; ses textes passent par
i18nStore.t. - Fenêtre modale :
BaseDialog. Menu :MenuButton. Arbre :useTreeNavigation. Poignée :useSeparator. Champ qui capture Tab :useTabEscape. - Couleurs de texte par les jetons
text-vscode-*; icône seule enaria-hidden, avec unaria-labelsur son bouton. - L'ajouter à l'audit de
tests/accessibility/accessibility-axe.spec.ts, et ses touches àkeyboard-navigation.spec.ts.
Voir Accessibilité et Interface et composants.
Enregistrer une préférence
Par src/utils/storage.ts (readPreference, readNumberPreference, readBooleanPreference, writePreference…), jamais localStorage : le stockage peut être absent ou refusé, et une valeur lue est validée (bornes, valeur par défaut). La préférence vit dans le store qui la concerne (layout, theme, i18n).
Mettre à jour Basthon
- Changer la version de tous les paquets
@basthon/*danspackage.json(la même partout), puisnpm install. - Lancer
npm run test:e2e: seuls les tests de bout en bout exercent le vrai noyau. - Vérifier dans le navigateur un programme Python avec
input(), une sortie turtle et matplotlib, un fichier SQL et un fichier OCaml.
Le dossier publié (basthon/<version>-<empreinte>/) change seul : les navigateurs téléchargent les nouveaux noyaux, et le service worker supprime l'ancien cache. Voir Intégration de Basthon.
Écrire un test
- Comportement de CapyCode (stores, services, composants) : Vitest, dans
tests/<domaine>/, avec le faux noyau si l'exécution est en jeu. - Comportement qui dépend du vrai Python (paquets, tracebacks,
input()) : Playwright, danstests/e2e/<domaine>/. - Un commentaire en français en tête du fichier ; le
README.mddu dossier mis à jour.
Voir Tests.