Fix file export fails in Edge. Fix #237

zotero · Aug 9, 2021 · 9e2594b · 9e2594b
1 parent 9af8e79
commit 9e2594b
Show file tree

Hide file tree

Showing 3 changed files with 20 additions and 16 deletions.
diff --git a/src/js/components/container.jsx b/src/js/components/container.jsx
@@ -3,6 +3,7 @@ import ZoteroBib from 'zotero-translation-client';
 import copy from 'copy-to-clipboard';
 import SmoothScroll from 'smooth-scroll';
 import PropTypes from 'prop-types';
+import { saveAs } from 'file-saver';
 
 import { calcOffset, dedupMultipleChoiceItems, ensureNoBlankItems, fetchFromPermalink,
 getOneTimeBibliographyOrFallback, getExpandedCitationStyles, getItemsCSL, isDuplicate, isLikeUrl,
@@ -441,7 +442,7 @@ const BibWebContainer = props => {
 		return '';
 	}, [state.xml, state.styleHasBibliography]);
 
-	const getFileData = useCallback(async format => {
+	const handleDownloadFile = useCallback(async format => {
 		var fileContents, separator, bibStyle, preamble = '';
 
 		if(format === 'ris') {
@@ -472,12 +473,18 @@ const BibWebContainer = props => {
 		}
 
 		const fileName = `citations.${exportFormats[format].extension}`;
-		const file = new File(
-			[fileContents],
-			fileName,
-			{ type: exportFormats[format].mime }
-		);
-		return file;
+		try {
+			const file = new File(
+				[fileContents],
+				fileName,
+				{ type: exportFormats[format].mime }
+			);
+			saveAs(file);
+		} catch(_) {
+			// Old Edge & Safari, see #237
+			const blob = new Blob([fileContents], { type: exportFormats[format].mime });
+			saveAs(blob, fileName);
+		}
 	}, [handleError, state.xml, state.styleHasBibliography]);
 
 	const handleError = useCallback((errorMessage, errorData) => {
@@ -1135,7 +1142,6 @@ const BibWebContainer = props => {
 
 	return (<ZBib
 		getCopyData = { getCopyData }
-		getFileData = { getFileData }
 		bibliography = { state.bibliography }
 		citationCopyModifiers = { citationCopyModifiers }
 		citationHtml = { citationHtml }
@@ -1169,6 +1175,7 @@ const BibWebContainer = props => {
 		onDeleteCitations = { handleDeleteCitations }
 		onDeleteEntry = { handleDeleteEntry }
 		onDismiss = { handleDismiss }
+		onDownloadFile = { handleDownloadFile }
 		onEditorClose = { handleCloseEditor }
 		onEditorOpen = { handleOpenEditor }
 		onError = { handleError }

diff --git a/src/js/components/export-tools.jsx b/src/js/components/export-tools.jsx
@@ -6,7 +6,6 @@ import Dropdown from 'reactstrap/lib/Dropdown';
 import DropdownToggle from 'reactstrap/lib/DropdownToggle';
 import DropdownMenu from 'reactstrap/lib/DropdownMenu';
 import DropdownItem from 'reactstrap/lib/DropdownItem';
-import { saveAs } from 'file-saver';
 
 import exportFormats from '../constants/export-formats';
 import Button from './ui/button';
@@ -52,7 +51,7 @@ ExportOption.propTypes = {
 };
 
 const ExportTools = props => {
-	const { bibliography, getCopyData, getFileData, onSaveToZoteroShow } = props;
+	const { bibliography, getCopyData, onDownloadFile, onSaveToZoteroShow } = props;
 	const [isDropdownOpen, setIsDropdownOpen] = useState(false);
 	const [clipboardConfirmations, setClipboardConfirmations] = useState({});
 	const dropdownTimer = useRef(null);
@@ -76,10 +75,8 @@ const ExportTools = props => {
 			return;
 		}
 
-		const file = await getFileData(format);
-		saveAs(file);
-
-	}, [getFileData, onSaveToZoteroShow]);
+		onDownloadFile(format);
+	}, [onDownloadFile, onSaveToZoteroShow]);
 
 	const handleToggleDropdown = useCallback(ev => {
 		const isFromCopyTrigger = ev.target && ev.target.closest('.clipboard-trigger');
@@ -157,8 +154,8 @@ const ExportTools = props => {
 ExportTools.propTypes = {
 	bibliography: PropTypes.object,
 	getCopyData: PropTypes.func.isRequired,
-	getFileData: PropTypes.func.isRequired,
 	isReadOnly: PropTypes.bool,
+	onDownloadFile: PropTypes.func.isRequired,
 	onSaveToZoteroShow: PropTypes.func.isRequired,
 }
 

diff --git a/src/js/components/zbib.jsx b/src/js/components/zbib.jsx
@@ -82,7 +82,7 @@ class ZBib extends React.PureComponent {
 							<div className="container">
 								<h2>Export</h2>
 								<ExportTools { ...pick(this.props, ['bibliography', 'getCopyData',
-									'getFileData', 'isReadOnly', 'onSaveToZoteroShow']) }
+									'onDownloadFile', 'isReadOnly', 'onSaveToZoteroShow']) }
 								/>
 							</div>
 						</section>