J'essaie d'écrire un test d'intégration pour un composant de téléchargement de fichiers, mais je ne parviens pas à déclencher un événement de changement sur le type d'entrée fichier. Alors que l'écouteur jQuery est déclenché, l'événement de changement de fichier n'est pas déclenché.
Je simule un événement avec un objet simple et je passe celui-ci à jQuery. trigger
méthode. Cela fonctionne bien si je ne mets pas en place la méthode target
de l'événement simulé. Dans ce cas, le gestionnaire d'événement jQuery et l'événement ember sont déclenchés.
Je me moque des fichiers avec Blob et de les utiliser comme target
de mon événement fictif. Si je passe celle-ci pour déclencher le gestionnaire d'événement jQuery est toujours déclenché mais l'événement ember ne l'est pas.
Voici comment cela se présente en code.
// mock a file
let file = new Blob(['content'], { type: 'image/jpeg' });
// mock an event
let event = { type: 'change' };
// set events target
event.target = { files: [file] };
this.$('input').trigger(event);
J'ai créé un Ember Twiddle qui démontre que this.$('input').trigger({ type: 'change' })
déclenche l'événement de changement d'ember mais this.$('input').trigger({ target: { files: [file] }, type: 'change' })
ne le fait pas alors que les deux fonctionnent pour le gestionnaire d'événements jQuery : https://ember-twiddle.com/5189be1875c147e96d31dea41668b006?openFiles=tests.integration.components.file-input-test.js%2C
Il fonctionnait dans les premières versions d'ember mais n'a pas été utilisé pendant un certain temps donc je ne suis pas tout à fait sûr quand il a été cassé.
Utilisation de jQuery.Event('change')
au lieu d'un simple objet donne les mêmes résultats. Cela ne fonctionne donc pas non plus :
jQuery.Event('change');
event.target = { files: [file] };
this.$('input').trigger(event);
Veuillez noter que le chapeau document.createEvent()
o new Event()
ne peut pas être utilisé puisque target
propriété de Événement est en lecture seule.
Je suis particulièrement confus que this.$('input').on('change', () => { })
est déclenché alors que l'événement de changement d'ember ne l'est pas.
Mise à jour : Je ne suis pas sûr que ça ait déjà fonctionné dans Ember. J'ai remarqué que l'exemple que j'avais en tête ( ember-cli-file-pickers uploadFileHelper ) ne peut fonctionner que parce qu'il n'utilise pas l'événement de changement de braises mais enregistre un gestionnaire d'événements jQuery dans le crochet didInsertElement.