diff --git a/web_src/js/features/dropzone.js b/web_src/js/features/dropzone.js index 01c91892ba87b..ec50f20737ff4 100644 --- a/web_src/js/features/dropzone.js +++ b/web_src/js/features/dropzone.js @@ -4,7 +4,7 @@ import {clippie} from 'clippie'; import {showTemporaryTooltip} from '../modules/tippy.js'; import {GET, POST} from '../modules/fetch.js'; import {showErrorToast} from '../modules/toast.js'; -import {createElementFromHTML, createElement} from '../utils/dom.js'; +import {createElementFromHTML, createElement, elemGetAttributeNumber} from '../utils/dom.js'; const {csrfToken, i18n} = window.config; @@ -52,8 +52,8 @@ export async function initDropzone(dropzoneEl) { const dzInst = await createDropzone(dropzoneEl, { url: dropzoneEl.getAttribute('data-upload-url'), headers: {'X-Csrf-Token': csrfToken}, - maxFiles: dropzoneEl.getAttribute('data-max-file'), - maxFilesize: dropzoneEl.getAttribute('data-max-size'), + maxFiles: elemGetAttributeNumber('data-max-file', null), // match dropzone default value, no limit + maxFilesize: elemGetAttributeNumber('data-max-size', 256), // match dropzone default value: 256 MiB acceptedFiles: ['*/*', ''].includes(dropzoneEl.getAttribute('data-accepts')) ? null : dropzoneEl.getAttribute('data-accepts'), addRemoveLinks: true, dictDefaultMessage: dropzoneEl.getAttribute('data-default-message'), diff --git a/web_src/js/utils/dom.js b/web_src/js/utils/dom.js index 23cd268dd1f7b..b8acd7d33e0c5 100644 --- a/web_src/js/utils/dom.js +++ b/web_src/js/utils/dom.js @@ -318,3 +318,10 @@ export function createElement(tagName, attrs) { } return el; } + +export function elemGetAttributeNumber(el, attr, def) { + if (!el.hasAttribute(attr)) return def; + const v = parseInt(el.getAttribute(attr)); + if (Number.isNaN(v)) throw new Error(`Attribute "${attr}" is not a number`); + return v; +} diff --git a/web_src/js/utils/dom.test.js b/web_src/js/utils/dom.test.js index 4c9abdb395755..93a64ec2c4f00 100644 --- a/web_src/js/utils/dom.test.js +++ b/web_src/js/utils/dom.test.js @@ -1,4 +1,4 @@ -import {createElement, createElementFromHTML} from './dom.js'; +import {createElement, createElementFromHTML, elemGetAttributeNumber} from './dom.js'; test('createElementFromHTML', () => { expect(createElementFromHTML('foobar').outerHTML).toEqual('foobar'); @@ -14,3 +14,13 @@ test('createElement', () => { }); expect(el.outerHTML).toEqual(''); }); + +test('elemGetAttributeNumber', () => { + expect(elemGetAttributeNumber(createElementFromHTML('foo'), `data-key`)).toEqual(undefined); + expect(elemGetAttributeNumber(createElementFromHTML('foo'), `data-key`, null)).toEqual(null); + expect(elemGetAttributeNumber(createElementFromHTML('foo'), `data-key`, 1)).toEqual(1); + expect(elemGetAttributeNumber(createElementFromHTML('foo'), `data-key`)).toEqual(2); + expect(() => { + elemGetAttributeNumber(createElementFromHTML('foo'), `data-key`); + }).toThrowError('Attribute "data-key" is not a number'); +});