FileSaver.JS not working in chrome extension

[bilalasif]

Hi,
I had been using FileSaver in my chrome extension for quite some while but it stopped working suddenly. In some other recent issues, I have read that version 1.3.3 is working fine.
I am trying to install 1.3.3 by using "bower install file-saver#1.3.3" it installs 1.3.2, bower.json says it is 1.3.3 but in comments of filesave.js file, it still says 1.3.2. I did a bower cache clean as well any idea what am I doing wrong?
My extension on chrome stopped working unable to identify the reason for that as well.

Installing 1.3.8 via bower does not have the js file.

Any help in this regard would be appreciated.

[onaralili]

the same issue.

[gupta82anish]

@bilalasif Any updates on this issue? Any workaround this problem that you can suggest? I have to meet a deadline and i can't find one 😟

[bilalasif]

Hi Guys I have solved this issue by moving the filesaver from background script to content scripts.
Only FileSaver.js version 1.3.3 is working so far if you do "bower install file-saver#1.3.3" you will get it, dont worry if you see in the comments on top of filesaver.js file to be declaring it as 1.3.2 I think there is some issue with their release system.
Use 1.3.3 version move this to content script instead of background script it will work.
I was creating a zip file using JsZip plugin which also uses filesaver.js plugin in order to download the file previously I used to do everything in the background file but since I moved to contentscript with version 1.3.3 it works for me.
Hope this helps

[onaralili]

@bilalasif @gupta82anish I following worked for me

1. Download the latest version from here https://github.com/eligrey/FileSaver.js/releases/tag/1.3.8
2. Uncomment this line

   FileSaver.js/src/FileSaver.js

   Line 161 in e865e37

   //save_link.target = "_blank";

[gupta82anish]

@bilalasif @onaralili My extension is in Angular5.. I install FileSaver via npm install file-saver --save
Any suggestions on how to use FileSaver with Angular5 Chrome Extension?
Any help will be greatly appreciated!

[gupta82anish]

@bilalasif Also, how did you move it to contentscript if you installed it using bower?

[bilalasif]

@gupta82anish moving to contentscript only involved updating my manifest.json, previously I was using it in background script but now i mention it contentscript section of the manifest.json.
Once I have created the zipped file from background scrip i convert it to string below is the code

reader = new FileReader();
reader.readAsDataURL(content);
reader.onloadend = function() {
  var base64data = reader.result;
  chrome.tabs.sendMessage(tab_id, {method:'removeLoader', content:base64data, name:`${product_id}-${FolderIntials} Images.zip`});
}

On contentscript side in the message listener i do the following:

if (message.method === "removeLoader"){
  message.content = message.content.slice(28);
  var blob = b64toBlob(message.content,"application/zip");
  // see FileSaver.js
  saveAs(blob, message.name);
  removeLoader();
}

b64toBlob is a custom function and it downloads the zipped file.
In order to install from bower I use below command since only version 1.3.3 is working I have not tried the solution yet that @onaralili provided

bower install file-saver#1.3.3

Hope this helps

[gupta82anish]

Hey, i tried using XLSX.writeFile() method instead of FileSaver as I couldnt get it to work for me.
But XLSX.writeFile() also couldnt download the file. So i checked and found out that to download a file from Chrome Extensions, you need a "downloads" permission in your manifest.json file.
And use the chrome downloads API for downloading the file!