Unknown Error $jscomp is not defined on uploadFile
Question
I am facing a weird error that I am unable to properly trace. It happens when i drag and drop an image for upload.

When I click on the line "at fetchFile (grapes.js:17107)" I see this function
fetchFile: function fetchFile() {
var model = this.model;
var file = model.get('file');
if (file) {
var fu = this.em.get('AssetManager').FileUploader();
fu.uploadFile({
dataTransfer: { files: [file] }
}, function (res) {
var obj = res && res.data && res.data[0];
var src = obj && obj.src;
src && model.set({ src: src });
});
model.set('file', '');
}
},
Please note that I have modified the uploadFile with the below code that I have adapted from the original source
//Asset Manager
const initialAsset = {
upload: true, //disable uploads
assets: assetsImages, //Assets as array
openAssetsOnDrop: 0, //// Open the asset manager once files are been dropped via the dropzone
dropzone: false, //Active the dropzone disable/hide the upload dropzone in asset modal
dropzoneContent: dropzone_content,
noAssets: 'No <b>assets</b> here, drag to upload', //No assets message
uploadFile: (e) => {
// List files dropped
const files = e.dataTransfer ? e.dataTransfer.files : e.target.files;
const response = {
data: [],
};
// Unlikely, widely supported now
if (!FileReader) {
this.onUploadError(
new Error('Unsupported platform, FileReader is not defined')
);
return;
}
const promises = [];
const mimeTypeMatcher = /^(.+)\/(.+)$/;
for (const file of files) {
// For each file a reader (to read the base64 URL)
// and a promise (to track and merge results and errors)
const promise = new Promise((resolve, reject) => {
const reader = new FileReader();
reader.addEventListener('load', (event) => {
let type;
const name = file.name;
// Try to find the MIME type of the file.
const match = mimeTypeMatcher.exec(file.type);
if (match) {
type = match[1]; // The first part in the MIME, "image" in image/png
} else {
type = file.type;
}
// If it's an image, try to find its size
if (type === 'image') {
const data = {
src: reader.result,
name,
type,
height: 0,
width: 0,
};
const image = new Image();
image.addEventListener('error', (error) => {
reject(error);
});
image.addEventListener('load', () => {
data.height = image.height;
data.width = image.width;
resolve(data);
});
image.src = data.src;
} else if (type) {
// Not an image, but has a type
resolve({
src: reader.result,
name,
type,
});
} else {
// No type found, resolve with the URL only
resolve(reader.result);
}
});
reader.addEventListener('error', (error) => {
reject(error);
});
reader.addEventListener('abort', (error) => {
reject('Aborted');
});
reader.readAsDataURL(file);
});
promises.push(promise);
}
Promise.all(promises).then(
(data) => {
response.data = data;
//Start bubble upload
attachImages(response.data, make_private, attach_to);
},
(error) => {
//Usage - instance.publishState(string: Exposed state name, Value);
instance.publishState('error_messages', error.toString());
//Usage - instance.triggerEvent(string: Event's name);
instance.triggerEvent('error');
console.warn(error);
}
);
},
};
Your help is greatly appreciated
Answers (3)
Hello anyone here. I hate to see all my hours of work in this go to waste. All opinions welcome!
When I click on the line "at fetchFile (grapes.js:17107)" I see this function
Which is just a step before you real issue... click on uploadFile step and you will find the issue
This thread has been automatically locked since there has not been any recent activity after it was closed. Please open a new issue for related bugs.
Related Questions and Answers
Continue research with similar issue discussions.
Issue #401
Cannot upload images
Hi, while uploading an image through asset manager, I get the following error: Assetmanager configuration at editor init looks like Folder...
Issue #1119
upload image has a misstake
when i drag a image into a block,then this image can not be setted,and when i click it,there is nothing
Issue #1237
Before you drag and drop the image,there was nothing in assetManager
and I don't know how to set the backgroundImage
Issue #1070
[QUESTION] Image insert blocked
I'm trying to build a website with grapesjs and now i'm facing the problem, that i can't insert any image from my PC. When i try to upload...
Paid Plugins That Match This Issue
Curated by issue keywords and label relevance to help you ship faster.
Loading paid plugin recommendations...
Browse Plugin Categories
Jump directly to plugin category pages on the marketplace.