Comment charger localement les librairies Webforms pour éviter les problèmes avec AJAX ?

Certains champs de webform nécessitent des librairies externes comme le champ “note” qui permet à l'utilisateur de noter avec des étoiles.

J’ai constaté que ces champs ne fonctionnaient pas correctement si Ajax était activé. Ajax peut-être utile si par exemple vous créez un formulaire en plusieurs étapes. L'utilisateur ne recharge pas la page entre chaque étape. C’est plus ergonomique et l'expérience est nettement meilleure.

installer localement les librairies

La solution est d’installer localement les librairies. C’est d’ailleurs indiqué dans l’onglet Webforms/forms configuration / Librairies (/admin/structure/webform/config/libraries) :

The Webform module utilizes third-party Open Source libraries to enhance webform elements and to provide additional functionality. It is recommended that these libraries are installed in your Drupal installation's /libraries or /web/libraries directory. If these libraries are not installed, they will be automatically loaded from a CDN. All libraries are optional and can be excluded via the admin settings form.

Plusieurs méthodes sont indiquées pour installer localement les librairies. La méthode conseillée est d'utiliser Composer Merge Plugin.

Composer Merge Plugin

Le module Webform est livré avec un fichier "composer.libraries.json" contenant des informations sur toutes les bibliothèques à jour requises par le module lui-même, et nous utiliserons donc ce fichier pour installer toutes les bibliothèques en fusionnant le "composer.libraries" .json" avec le fichier "composer.json" de notre site Drupal.

Installation du plugin :

composer require wikimedia/composer-merge-plugin

Editez le fichier "composer.json" de votre site et sous le "extra": { section ajoutez:

"merge-plugin": {
            "include": [
                "web/modules/contrib/webform/composer.libraries.json"
            ]
        },

Désormais, chaque fois que le fichier "composer.json" est mis à jour, il lira également le contenu du fichier "composer.libraries.json" situé dans web/modules/contrib/webform/ et se mettra à jour en conséquence.

Pour que le fichier "composer.json" installe toutes les bibliothèques mentionnées en tant que CDN dans le "composer.libraries.json", à partir d'un terminal, exécutez composer update --lock ou composer update si l'option de verrouillage ne fonctionne pas.

Si vous souhaitez installer toutes les bibliothèques mentionnées dans un répertoire local sur votre serveur Web, généralement web/libraries, vous devez exécuter

composer update --with-dependencies

Cette méthode garantit que composer va extraire les bibliothèques de la source CDN et stockera une copie dans votre répertoire de bibliothèques dans votre installation Drupal.