I am trying to test an image that is being uploaded and converted into base64; however, it stops at the imageCompression(), it doesn't catch or fulfill the promise. When i console logged event.target.files[0] it shows File: {}. In need of guidance to successfully pass this test.
test
import ChickenPotPieIMG from '../../assets/images/chicken-pot-pie-test-img.jpg'
test('uploading image should be converted to base64 and display on the Dom', async () => {
const { getByTestId, getByText } = render(<CreateForm />, {wrapper: AuthProvider});
await act(() => Promise.resolve());
const file = new File([ChickenPotPieIMG], 'dummypicture.png', {type: 'image/png'})
const imageInput = getByTestId('image-input');
fireEvent.change(imageInput, {target: {files: [file]}})
await act(() => Promise.resolve());
expect(getByTestId('image-output')).not.toBeNull();
})
Component
const toBase64 = (file) => new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
function imageFileHandler(file) {
setDisplay(file);
toBase64(file).then((data) => setSelectedFile(data));
}
function imageCompressor(event) {
const file = event.target.files[0];
console.log(typeof file)
const options = {
maxSizeMB: 0.05,
maxWidthOrHeight: 700,
useWebWorker: true,
};
imageCompression(file, options) // stops right here
.then((compressedFile) => {
imageFileHandler(compressedFile);
})
.catch(() => setErrorForm('unable to convert image file'));
}
Aucun commentaire:
Enregistrer un commentaire