Update electron demo (#2027)

Srijon Saha · ianjennings · web-flow · commit 5b1440a186ec · 2020-06-28T03:22:46.000-04:00
* Update electron demo to version 9

[ci skip]

Co-authored-by: Ian Jennings &lt;ian@meetjennings.com&gt;
diff --git a/demos/electron/README.md b/demos/electron/README.md
@@ -1,9 +1,11 @@
 # Electron
 
 This library is compatible with Electron and should just work out of the box.
-The demonstration uses Electron 1.7.5.  The library is added via `require` from
-the render process.  It can also be required from the main process, as shown in
-this demo to render a version string in the About dialog on OSX.
+The demonstration uses Electron 9.0.5.  The library is added via `require` from
+the renderer process. Note that Electron now requires `nodeIntegration: true`
+in order to `require('XLSX')` in the renderer process. It can also be required
+from the main process, as shown in this demo to render a version string in the
+About dialog on OSX.
 
 The standard HTML5 `FileReader` techniques from the browser apply to Electron.
 This demo includes a drag-and-drop box as well as a file input box, mirroring
diff --git a/demos/electron/index.html b/demos/electron/index.html
@@ -4,6 +4,7 @@
 <html>
 <head>
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
+<meta http-equiv="Content-Security-Policy" content="script-src 'self' https:">
 <title>SheetJS Electron Demo</title>
 <style>
 #drop{
diff --git a/demos/electron/index.js b/demos/electron/index.js
@@ -1,5 +1,5 @@
-/* xlsx.js (C) 2013-present SheetJS -- http://sheetjs.com */
-/*global Uint8Array, console */
+/* xlsx.js (C) 2013-present SheetJS -- https://sheetjs.com */
+/* global Uint8Array, console */
 /* exported export_xlsx */
 /* eslint no-use-before-define:0 */
 var XLSX = require('xlsx');
@@ -19,16 +19,6 @@ var process_wb = (function() {
 	};
 })();
 
-var _gaq = _gaq || [];
-_gaq.push(['_setAccount', 'UA-36810333-1']);
-_gaq.push(['_trackPageview']);
-
-(function() {
-	var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
-	ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
-	var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
-})();
-
 var do_file = (function() {
 	return function do_file(files) {
 		var f = files[0];
@@ -64,16 +54,16 @@ var do_file = (function() {
 
 (function() {
 	var readf = document.getElementById('readf');
-	function handleF(/*e*/) {
-		var o = electron.dialog.showOpenDialog({
+	async function handleF(/*e*/) {
+		var o = await electron.dialog.showOpenDialog({
 			title: 'Select a file',
 			filters: [{
 				name: "Spreadsheets",
 				extensions: "xls|xlsx|xlsm|xlsb|xml|xlw|xlc|csv|txt|dif|sylk|slk|prn|ods|fods|uos|dbf|wks|123|wq1|qpw|htm|html".split("|")
 			}],
 			properties: ['openFile']
 		});
-		if(o.length > 0) process_wb(XLSX.readFile(o[0]));
+		if(o.filePaths.length > 0) process_wb(XLSX.readFile(o.filePaths[0]));
 	}
 	readf.addEventListener('click', handleF, false);
 })();
@@ -87,18 +77,18 @@ var do_file = (function() {
 var export_xlsx = (function() {
 	var HTMLOUT = document.getElementById('htmlout');
 	var XTENSION = "xls|xlsx|xlsm|xlsb|xml|csv|txt|dif|sylk|slk|prn|ods|fods|htm|html".split("|")
-	return function() {
+	return async function() {
 		var wb = XLSX.utils.table_to_book(HTMLOUT);
-		var o = electron.dialog.showSaveDialog({
+		var o = await electron.dialog.showSaveDialog({
 			title: 'Save file as',
 			filters: [{
 				name: "Spreadsheets",
 				extensions: XTENSION
 			}]
 		});
-		console.log(o);
-		XLSX.writeFile(wb, o);
-		electron.dialog.showMessageBox({ message: "Exported data to " + o, buttons: ["OK"] });
+		console.log(o.filePath);
+		XLSX.writeFile(wb, o.filePath);
+		electron.dialog.showMessageBox({ message: "Exported data to " + o.filePath, buttons: ["OK"] });
 	};
 })();
 void export_xlsx;
diff --git a/demos/electron/main.js b/demos/electron/main.js
@@ -7,14 +7,20 @@ var app = electron.app;
 var win = null;
 
 function createWindow() {
-	if(win) return;
-	win = new electron.BrowserWindow({width:800, height:600});
+	if (win) return;
+	win = new electron.BrowserWindow({
+		width: 800, height: 600,
+		webPreferences: {
+			nodeIntegration: true,
+			enableRemoteModule: true
+		}
+	});
 	win.loadURL("file://" + __dirname + "/index.html");
 	win.webContents.openDevTools();
-	win.on('closed', function() { win = null; });
+	win.on('closed', function () { win = null; });
 }
-if(app.setAboutPanelOptions) app.setAboutPanelOptions({ applicationName: 'sheetjs-electron', applicationVersion: "XLSX " + XLSX.version, copyright: "(C) 2017-present SheetJS LLC" });
-app.on('open-file', function() { console.log(arguments); });
+if (app.setAboutPanelOptions) app.setAboutPanelOptions({ applicationName: 'sheetjs-electron', applicationVersion: "XLSX " + XLSX.version, copyright: "(C) 2017-present SheetJS LLC" });
+app.on('open-file', function () { console.log(arguments); });
 app.on('ready', createWindow);
 app.on('activate', createWindow);
-app.on('window-all-closed', function() { if(process.platform !== 'darwin') app.quit(); });
+app.on('window-all-closed', function () { if (process.platform !== 'darwin') app.quit(); });
diff --git a/demos/electron/package.json b/demos/electron/package.json
@@ -4,7 +4,10 @@
 	"version": "0.0.0",
 	"main": "main.js",
 	"dependencies": {
-		"electron": "~1.7.x",
-		"xlsx": "*"
+		"xlsx": "*",
+		"electron": "^9.0.5"
+	},
+	"scripts": {
+		"start": "electron ."
 	}
 }

Original file line number	Diff line number	Diff line change
`@@ -4,7 +4,10 @@`
`4`	`4`	`"version": "0.0.0",`
`5`	`5`	`"main": "main.js",`
`6`	`6`	`"dependencies": {`
`7`		`- "electron": "~1.7.x",`
`8`		`- "xlsx": "*"`
	`7`	`+ "xlsx": "*",`
	`8`	`+ "electron": "^9.0.5"`
	`9`	`+ },`
	`10`	`+ "scripts": {`
	`11`	`+ "start": "electron ."`
`9`	`12`	`}`
`10`	`13`	`}`