Mon objectif

Cette page me sert d’aide-mémoire mais peut être utile à d’autres.

Je voudrais tester des modifications sur des cartes Home Assistant, afin de proposer des améliorations aux développeurs.

Dans cette page, je vais modifier une carte de la série des cartes de Pronote de delphiki.

Organisation des fichiers sur Home Assistant

Les cartes sont des scripts JavaScript qui sont en principe enregistrés dans /homeassistant/www/community

Dans ces dossiers, on retrouve le fichier JS et sa version compactée en GZ.

Organisation des fichiers sur GitHub

Je prends donc l’exemple du dépôt des cartes Pronote.

Les fichiers sources des cartes sont dans lovelace-xx/src/cards.

Je récupère un fichier JS de carte et je le place sur mon HA

Dans mon exemple du jour, je vais récupérer la carte absences-card.js et je la place dans le dossier /homeassistant/www/community/lovelace-pronote/cards de mon HA.

Je dois déclarer cette carte comme Ressource dans HA

Dans Paramètres / Tableaux de bord / Ressources (3 points en haut à droite), je clique sur

J’ajoute donc mon fichier JS : /hacsfiles/lovelace-pronote/cards/absences-card.js

C’est terminé, à ce stade, la carte fonctionnera sur le Dashboard.

Je me suis demandé s’il fallait retirer la carte pronote.js des ressources pour tester la nouvelle carte, afin d’éviter un doublon de déclaration. Visiblement non, c’est la nouvelle qui est prise en compte. J’ignore comment HA gère la priorité des codes JS, je complèterai ce paragraphe si j’arrive à comprendre.

Je teste une carte absences sur le Dashboard

type: custom:pronote-absences-card
entity: sensor.pronote_xx_coralie_absences
display_header: true
child_name: Coralie

Cela fonctionne :

Je fais un test de modification

Je fais un test de modification pour vérifier que mon code absences-card.js est bien celui qui génère la carte.

J’édite le fichier absences-card.js et je vais changer la ligne

<ha-icon icon="mdi:check"></ha-icon>

par la ligne

<ha-icon icon="mdi:account-school-outline"></ha-icon>

pour changer la coche d’absence.

Important !!!! Il faut actualiser le fichier JS qui est en cache dans le navigateur, il faut donc l’ouvrir et faire un petit F5.

Donc dans une autre fenêtre du navigateur, j’ouvre le fichier :

http://homeassistant.local:8123/hacsfiles/lovelace-pronote/cards/absences-card.js

Je reviens sur mon onglet Pronote et j’actualise la page, la coche a bien changé :

Je peux ainsi modifier le code

À ce stade, je peux donc modifier le code du fichier JS qui génère la carte.

Ainsi, si je peux proposer aux développeurs des améliorations, au lieu de jouer au …

Toute ressemblance avec des personnes existantes ou ayant existé est purement fortuite et non intentionnelle. 🥳