svgdom

svgdom est une implémentation DOM simple conçue pour faire fonctionner SVG.js sans interface graphique sur Node.js. Bien qu'elle ait été initialement créée dans ce but, elle est devenue plus complète et peut être utilisée par toute personne ayant besoin d'un DOM XML, SVG ou HTML. Les usages typiques incluent la génération de fichiers SVG sur un serveur, le test de code SVG sans navigateur et la création d'outils de pipeline d'actifs qui inspectent ou transforment la géométrie SVG. Pour démarrer avec SVG.js v3.x, il faut installer @svgdotjs/svg.js et svgdom. Vous importez createSVGWindow depuis svgdom et SVG ainsi que registerWindow depuis @svgdotjs/svg.js. createSVGWindow renvoie une fenêtre avec un document et un nœud racine SVG. Après avoir enregistré la fenêtre et le document, vous créez un canevas à partir de document.documentElement et utilisez SVG.js normalement, par exemple en dessinant un rectangle, en le remplissant, en le déplaçant, puis en produisant le SVG sous forme de chaîne ou via outerHTML. Au-delà de SVG, svgdom peut créer une fenêtre HTML avec createHTMLWindow, ou une fenêtre XML générique avec createWindow, en passant un URI d'espace de noms et un nœud racine, comme MathML. Sur Node.js 22.13 ou une version plus récente, svgdom peut être chargé directement avec require en tant que module CommonJS. Le projet documente des écarts intentionnels par rapport au DOM. Il privilégie une API petite et pratique pour l'usage de SVG sans interface graphique plutôt qu'une conformité complète au DOM des navigateurs. document.createElement hérite de l'espace de noms du document, donc createSVGDocument().createElement('rect') crée un SVGRectElement dans l'espace de noms SVG, contrairement à un DOM XML de navigateur où createElement crée un élément sans espace de noms et où createElementNS est requis. Le comportement HTML est déduit de l'espace de noms du document : un document avec l'espace de noms XHTML reçoit la casse des noms HTML, des sélecteurs de type HTML insensibles à la casse, la sérialisation des éléments vides HTML et la restriction HTML sur CDATA. svgdom n'implémente pas actuellement l'algorithme de parsing HTML tolérant ; HTMLParser et innerHTML utilisent un analyseur XML strict, donc le balisage doit être bien formé et la récupération de balises en désordre, les balises de fin optionnelles et les comportements similaires ne sont pas pris en charge. Pour les zones de texte, les polices doivent d'abord être chargées. svgdom charge Open Sans-Regular par défaut lorsqu'aucun fichier de police pour la police spécifiée n'est trouvé. Les options de configuration permettent de définir un répertoire de polices, de mapper des familles de polices à des fichiers et de précharger les polices afin d'éviter un délai de chargement lors de la première utilisation. Les mêmes fonctions peuvent être importées directement. Les limitations connues incluent les propriétés de police telles que gras et italique qui ne sont prises en charge que lorsque la police correspondante est explicitement chargée, par exemple en mappant Arial-italic à arial_italic.ttf. querySelector prend en charge un ensemble limité de pseudo-classes : empty, first-child, last-child, nth-child, nth-last-child, first-of-type, last-of-type, nth-of-type, nth-last-of-type, only-child, only-of-type, has, is, root, not, matches, scope et where. Les pseudo-classes nth-child et nth-last-child prennent également en charge la syntaxe du sélecteur of. Les valeurs d'attribut contenant un crochet fermant ne sont actuellement pas analysées correctement dans les sélecteurs, même lorsqu'elles sont entre guillemets. svgdom peut être utilisé dans d'autres projets, bien que certaines fonctions ne soient pas nécessaires à SVG.js et donc non implémentées ou non testées. Le README indique que childNodes est un tableau. Le projet accepte les issues et les pull requests pour les fonctionnalités nécessaires et propose des liens de don et de parrainage.