Issue trying to change a loaded PDF in the embed - adobe-embed-api

Question

I'm using the Adobe PDF Embed API and can successfully display a PDF after a user selection. When my app starts up, I initialize a DC View object:
let dcView = new AdobeDC.View({
clientId: ADOBE_KEY,
divId: div
});
And after a user has dragged a file, I use a file reader to to throw a promise at it:
let reader = new FileReader();
let name = this.pdfFile.name;
reader.onloadend = function(e) {
let filePromise = Promise.resolve(e.target.result);
dcView.previewFile({
content: { promise: filePromise },
metaData: { fileName: name }
});
};
reader.readAsArrayBuffer(this.pdfFile);
This works perfectly... once. If I drag a file again, when it gets to the render portion, only the filename on top of the embed changes, not the actual rendered contents.

Answer 1

You'll need to recreate the AdobeDC.View object prior to loading a new document. I'm guessing that this is because there may be unresolved Promises if an operation takes a while to resolve like loading annotations or performing a search. Your new code might look like this...
let reader = new FileReader();
let name = this.pdfFile.name;
reader.onloadend = function(e) {
let filePromise = Promise.resolve(e.target.result);
let dcView = new AdobeDC.View({
clientId: ADOBE_KEY,
divId: div
});
dcView.previewFile({
content: { promise: filePromise },
metaData: { fileName: name }
});
};
reader.readAsArrayBuffer(this.pdfFile);