DGNum/demarches-normaliennes
14
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

Merge pull request #5530 from betagouv/ignore-progress-bar-errors

Browse source 
Usager : lorsque qu'une barre qui affiche la progression de l'envoi d'un fichier disparait de la page, la Console ne remonte plus d'erreurs Javascript
This commit is contained in:
Pierre de La Morinerie 2020-09-03 15:16:44 +02:00 committed by GitHub
commit 0d9ac9ffd9
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
1 changed files with 19 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

18
app/javascript/shared/activestorage/progress-bar.js
View file

@ -7,6 +7,12 @@ const COMPLETE_CLASS = 'direct-upload--complete';
rendering upload progress bar. It is used to handle rendering upload progress bar. It is used to handle
direct-upload form ujs events but also in the direct-upload form ujs events but also in the
Uploader delegate used with uploads on json api. Uploader delegate used with uploads on json api.
As the associated DOM element may disappear for some
reason (a dynamic React list, an element being removed
and recreated again later, etc.), this class doesn't
raise any error if the associated DOM element cannot
be found.
*/ */
export default class ProgressBar { export default class ProgressBar {
static init(input, id, file) { static init(input, id, file) {
@ -17,28 +23,32 @@ export default class ProgressBar {
static start(id) { static start(id) {
const element = getDirectUploadElement(id); const element = getDirectUploadElement(id);
if (element) {
element.classList.remove(PENDING_CLASS); element.classList.remove(PENDING_CLASS);
} }
}
static progress(id, progress) { static progress(id, progress) {
const element = getDirectUploadProgressElement(id); const element = getDirectUploadProgressElement(id);
if (element) {
element.style.width = `${progress}%`; element.style.width = `${progress}%`;
} }
}
static error(id, error) { static error(id, error) {
const element = getDirectUploadElement(id); const element = getDirectUploadElement(id);
if (element) {
element.classList.add(ERROR_CLASS); element.classList.add(ERROR_CLASS);
element.setAttribute('title', error); element.setAttribute('title', error);
} }
}
static end(id) { static end(id) {
const element = getDirectUploadElement(id); const element = getDirectUploadElement(id);
if (element) {
element.classList.add(COMPLETE_CLASS); element.classList.add(COMPLETE_CLASS);
} }
}
static render(id, filename) { static render(id, filename) {
return `<div id="direct-upload-${id}" class="direct-upload ${PENDING_CLASS}" data-direct-upload-id="${id}"> return `<div id="direct-upload-${id}" class="direct-upload ${PENDING_CLASS}" data-direct-upload-id="${id}">