InvalidCharacterError on chart export

[martgnz]

I'm not sure if this is my machine's problem. I was doing some commits and changing stuff on the repo when suddenly I got this error after clicking the Download image button.

Uncaught InvalidCharacterError: Failed to execute 'btoa' on 'Window': The string to be encoded contains characters outside of the Latin1 range

To investigate further I did a clean clone and the error keeps popping out. I'm not sure what I've changed that broke the save-svg-as-png functionality.

Do you have any idea?

Thanks

[yanofsky]

Interesting, @mhkeller was having the same issue but with a non-standard setup.

Is it happening in only one browser or all browsers?

[mhkeller]

I wonder if this is something creeping into production Chrome from Canary or something like that. @martgnz are you using Chrome 46.0.2490.80 (64-bit) or newer?

[martgnz]

@yanofsky This happens on latest Chrome, FF and Safari on El Capitan.

The strange thing was that image export was working at first and then it stopped. The hosted version works fine though.

@mhkeller Yay, Chrome 46.0.2490.80

[mhkeller]

I'm also on El Capitan if that is part of the mix and getting the same behaviors as you in those browsers and the hosted version.

[mhkeller]

@joannaskao just tested on 10.9.5 with up to date browsers and seeing the same errors. Hosted version works for her.

[martgnz]

@mhkeller I'm going to fork the v2 branch and see how it goes. Does your electron app work?

The weird thing is that I remember it working when I just cloned the repo at first. And now a fresh clone doesn't work either. Maybe some npm dependencies got updated and broke it?

[martgnz]

@yanofsky doing a git checkout a508c42 (a commit which seems nearby to the hosted version), doesn't solve the issue. After running npm install again the error persists.

I've tried on my Ubuntu machine and I get the same problem.

[bwareham]

I ran into the same problem, but discovered a workaround that may provide some clues for someone who understands the code better than I do. It was happening when the time series years were displayed in the 'XX format (as the default data is formatted). When I changed them to the 20XX format AND downloaded an .svg version first, then it would let me download a .png version as well. It would seem the apostrophe in the date is the culprit.

Until there's a better fix, I removed 'XX as an option in the date format chooser and set the auto default format to 'yyyy'.

[yanofsky]

great find @bwareha!

Apologies for not getting to this sooner I'll try to fix over the holiday

[yanofsky]

@bwareham I can't replicate on a clean version of the repo anymore in any browser but I can replicate with this http://tools.bilware.info/Chartbuilder/ could you give me access to to that repo so I can take a look?

[bwareham]

Added the build here: https://github.com/bwareham/MPR-Chartbuilder

[yanofsky]

Long story short, the library we use to do the svg to png transformation has fixed this bug but hasn't updated the package on npm

Until that happens you can do this to get the most recent version of the library into your version of Chartbuilder

# from the Chartbuilder directory
git clone https://github.com/exupero/saveSvgAsPng.git ../saveSvgAsPng
cp ../saveSvgAsPng/saveSvgAsPng.js ./node_modules/save-svg-as-png/saveSvgAsPng.js
rm -rf ../saveSvgAsPng

That worked for me, let me know if that fixes it for you all

[yanofsky]

The SaveSvgAsPng library has been updated on npm.

Pull the latest and then npm install to update

I'll reopen if any of you are still having issues.

[bwareham]

Just got around to installing the update. That seems to have done the job. Thanks for the fix.