From 1dc90e326290650cfee4809f316dea38921ddfa9 Mon Sep 17 00:00:00 2001
From: Przemek Wiech <pwiech@gmail.com>
Date: Sat, 2 Mar 2019 13:31:16 +0100
Subject: [PATCH] Using file-saver package for better cross-browser support.

---
 package.json  |  3 +++
 src/chart.tsx | 18 ++++++------------
 src/index.tsx |  1 +
 3 files changed, 10 insertions(+), 12 deletions(-)

diff --git a/package.json b/package.json
index 5da6429..ad1ae33 100644
--- a/package.json
+++ b/package.json
@@ -3,9 +3,11 @@
   "version": "1.0.0",
   "main": "src/index.tsx",
   "dependencies": {
+    "canvas-toBlob": "^1.0.0",
     "canvg": "^1.5.3",
     "d3": "^5.7.0",
     "detect-browser": "^4.1.0",
+    "file-saver": "^2.0.1",
     "history": "^4.7.2",
     "md5": "^2.2.1",
     "query-string": "^5.1.1",
@@ -19,6 +21,7 @@
   },
   "devDependencies": {
     "@types/d3": "^5.5.0",
+    "@types/file-saver": "^2.0.0",
     "@types/history": "^4.7.2",
     "@types/jest": "*",
     "@types/md5": "^2.1.33",
diff --git a/src/chart.tsx b/src/chart.tsx
index a8455c9..b882d40 100644
--- a/src/chart.tsx
+++ b/src/chart.tsx
@@ -2,6 +2,7 @@ import * as d3 from 'd3';
 import * as React from 'react';
 import canvg from 'canvg';
 import {intlShape} from 'react-intl';
+import {saveAs} from 'file-saver';
 import {
   JsonGedcomData,
   ChartHandle,
@@ -162,13 +163,8 @@ export class Chart extends React.PureComponent<ChartProps, {}> {
   }
 
   downloadSvg() {
-    const hiddenElement = document.createElement('a');
-    hiddenElement.href = URL.createObjectURL(
-      new Blob([this.getSvgContents()], {type: 'image/svg+xml'}),
-    );
-    hiddenElement.target = '_blank';
-    hiddenElement.download = 'topola.svg';
-    hiddenElement.click();
+    const blob = new Blob([this.getSvgContents()], {type: 'image/svg+xml'});
+    saveAs(blob, 'topola.svg');
   }
 
   downloadPng() {
@@ -193,11 +189,9 @@ export class Chart extends React.PureComponent<ChartProps, {}> {
       scaleHeight: canvas.height,
     });
     const onBlob = (blob: Blob | null) => {
-      const hiddenElement = document.createElement('a');
-      hiddenElement.href = URL.createObjectURL(blob);
-      hiddenElement.target = '_blank';
-      hiddenElement.download = 'topola.png';
-      hiddenElement.click();
+      if (blob) {
+        saveAs(blob, 'topola.png');
+      }
     };
     canvas.toBlob(onBlob, 'image/png');
   }
diff --git a/src/index.tsx b/src/index.tsx
index b030b1e..1c344db 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -10,6 +10,7 @@ import {HashRouter as Router, Route} from 'react-router-dom';
 import {IntlProvider} from 'react-intl';
 import './index.css';
 import 'semantic-ui-css/semantic.min.css';
+import 'canvas-toBlob';
 
 addLocaleData([...locale_en, ...locale_pl]);