lion/packages/ui/components/input-file/test/FileValidators.test.js
gerjanvangeest d2de984f0b
Feat/input file (#1881)
* feat(input-file): create input-file component

* chore: improvements after review

* chore: update after review

* chore: update translations

* chore: - fixed demo with form submit, submit was not prevented
       - fixed checking allowed file extensions
       - fixed clicking on select file button in drag and drop area

* chore: since the input-file does not upload files itself but enables user to select files, I replaced "upload" and "upload" with "select" and "selected" where applicable

* chore: - removed unused properties allowedFileTypes and allowedFileExtensions from lion-input-file
       - cleaned up docs

* chore: - changed type Array.<type> to Array<type>
       - removed redundant type definition

* fix: - FocusMixin: moved registering events for from connectedCallback to firstUpdated since _focusableNode is sometimes not available yet
     - SlotMixin: changed updated to update in since slots were rendered too late (related to previous fix in FocusMixin.js)

* fix: renamed lion-uploaded-file-list.js to lion-selected-file-list.js

* fix: fixed test for lion-selected-file-list

* fix: fixed typ

* wip

* fix: - fixed issue with multiple file selection where element would not select valid files after invalid ones
     - added getMessage method to FileValidation that returns empty string to prevent message being shown that error message must be configured
     - fixed tests

* chore: replaced `uploadOnFormSubmit` with `uploadOnSelect` and flipped the default value to false. When `uploadOnSelect` is set to true, the file will be uploaded as soon as it is selected.

* fix: - replaced `uploadOnFormSubmit` with `uploadOnSelect` and flipped the default value to false. When `uploadOnSelect` is set to true, the file will be uploaded as soon as it is selected.
     - fixed issue where a valid file was not selected and added to the file list if it was preceded by an invalid file

* chore: removed redundant README.md

* fix: fixed failing test

* chore: added missing type annotation

* chore: annotated event param as optional

---------

Co-authored-by: Danny Moerkerke <danny.moerkerke@ing.com>
Co-authored-by: Thijs Louisse <Thijs.Louisse@ing.com>
2023-06-06 11:30:43 +02:00

170 lines
5.5 KiB
JavaScript

import { expect } from '@open-wc/testing';
import { IsAcceptedFile } from '../src/validators.js';
describe('lion-input-file: IsAcceptedFile', () => {
describe('valid file type', () => {
it('should return false for allowed file extension .csv', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ name: 'foo.csv' }], {
allowedFileExtensions: ['.csv'],
allowedFileTypes: undefined,
});
expect(returnVal).to.be.false;
});
it('should return false for allowed file extension .csv and .pdf', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ name: 'foo.pdf' }], {
allowedFileExtensions: ['.csv', '.pdf'],
allowedFileTypes: undefined,
});
expect(returnVal).to.be.false;
});
it('should return true for not allowed file extension .csv and .pdf', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ name: 'foo.pdf' }], {
allowedFileExtensions: ['.txt'],
allowedFileTypes: undefined,
});
expect(returnVal).to.be.true;
});
it('should return false for valid file type for single file', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: 'foo' }], {
allowedFileTypes: ['foo'],
});
expect(returnVal).to.be.false;
});
it('should return false for valid file type for multiple file', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: 'foo' }, { type: 'foo' }], {
allowedFileTypes: ['foo'],
});
expect(returnVal).to.be.false;
});
it('should return false if no file types are defined, and has small file size', async () => {
const fileTypeObj = new IsAcceptedFile();
const returnVal = fileTypeObj.execute(
[
// @ts-ignore ignore file typing
{ type: 'foo', size: 1 },
// @ts-ignore ignore file typing
{ type: 'foo', size: 1 },
],
{
allowedFileTypes: [],
maxFileSize: 1028,
},
);
expect(returnVal).to.be.false;
});
it('should return false for valid file type for multiple file and multiple allowed types', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: 'foo' }, { type: 'bar' }], {
allowedFileTypes: ['foo', 'bar'],
});
expect(returnVal).to.be.false;
});
});
describe('invalid file type', () => {
it('should return true for invalid file type for single file', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: 'bar' }], {
allowedFileTypes: ['foo'],
});
expect(returnVal).to.be.true;
});
it('should return false for invalid file type for multiple file', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: 'foo' }, { type: 'bar' }], {
allowedFileTypes: ['foo'],
});
expect(returnVal).to.be.true;
});
it('should return false for invalid file type for multiple file and multiple allowed types', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: 'foo' }, { type: 'pdf' }], {
allowedFileTypes: ['foo', 'bar'],
});
expect(returnVal).to.be.true;
});
it('should return true for invalid file type for empty type', async () => {
const fileTypeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileTypeObj.execute([{ type: '' }], {
allowedFileTypes: ['foo'],
});
expect(returnVal).to.be.true;
});
});
describe('valid file size', () => {
it('should return false for valid file size for single file', async () => {
const fileSizeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileSizeObj.execute([{ size: 5 }], {
maxFileSize: 10,
});
expect(returnVal).to.be.false;
});
it('should return false for valid file size for multiple file', async () => {
const fileSizeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileSizeObj.execute([{ size: 5 }, { size: 9 }], {
maxFileSize: 10,
});
expect(returnVal).to.be.false;
});
});
describe('invalid file size', () => {
it('should return true for invalid file size for single file', async () => {
const fileSizeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileSizeObj.execute([{ size: 5 }], {
maxFileSize: 3,
});
expect(returnVal).to.be.true;
});
it('should return false for invalid file size for multiple file', async () => {
const fileSizeObj = new IsAcceptedFile();
// @ts-ignore ignore file typing
const returnVal = fileSizeObj.execute([{ size: 5 }, { size: 9 }], {
maxFileSize: 7,
});
expect(returnVal).to.be.true;
});
});
});