Тестирование файлового ввода с помощью React и Enzyme, предоставление входного файла в смоделированном событии

Question

У меня возникли сложности с тестированием моего компонента ввода файлов с помощью Enzyme. Ввод файла является довольно стандартным, он вызывает функцию изменения файла onChange, событие, которое он отправляет, нуждается в массиве файлов, и у файла должно быть имя, чтобы функция не вызывала ошибок. Этот компонент ниже;

import * as React from 'react';
import { generateGuid } from '../../../../utilities/GuidGenerator';

export interface Props {
    styles?: Object;
    acceptedExtensions: string;
    fileLoadedFunc: (file: string) => void;
}

const FileInput = ({ styles, acceptedExtensions, fileLoadedFunc }: Props) => {
    var id = generateGuid().slice(0, 6);

    var fileChangedFunc = (e: React.ChangeEvent) => {
        var file = (e.target as HTMLInputElement).files[0];
        if (file) {
            var fileName = file.name.length > 22 ? file.name.slice(0, 16).trimRight().concat("... .", file.name.slice(file.name.length - 3)) : file.name;
            document.getElementById(id).parentElement.previousSibling.childNodes[1].textContent = fileName;
            var reader = new FileReader();
            reader.addEventListener("load", () => {
                fileLoadedFunc(reader.result as string);
            }, false);

            if (file) {
                reader.readAsDataURL(file);
            }
        }
    }

return (
    <div style={styles} className="fileInput" >
        <label htmlFor={id} >
            <i className="zmdi zmdi-upload zmdi-hc-2x" />
            <div>Select File</div>
        </label>
        <div>
            <input accept={acceptedExtensions} id={id} type="file" onChange={(e: React.ChangeEvent) => { fileChangedFunc(e) }} />
        </div>
    </div>
);
}

export default FileInput;

И тест, который я написал, ниже.

import * as React from 'react';
import * as Enzyme from 'enzyme';
import * as Adapter from 'enzyme-adapter-react-16';
import FileInput from './FileInput';

Enzyme.configure({ adapter: new Adapter() });

describe('FileInput', () => {
    test('loads in whatever file it\'s given on change event', () => {
        var loadedFile = null;
        var fileInput = Enzyme.mount(<FileInput acceptedExtensions="image/png" fileLoadedFunc={(file: string) => { loadedFile = file }} />);
        fileInput.find('input').at(0).simulate('change', {
            target: {
                files: ['dummyValue.png']
            }
        });
    });
});

Этот тест вызывает ошибку TypeError: Cannot read property 'length' of undefined из-за отсутствия имени файла.

Для того, чтобы смоделировать и протестировать это должным образом, мне нужно будет загрузить файл здесь, как мне это сделать? Есть ли способ предоставить событие изменения с файлом, или я мог бы дать файлу ввода путь к файлу?