Integrate sentry.io

README.md

@@ -42,3 +42,11 @@ yarn bundle
 ## Development guide
 
 [./docs/DEV_GUIDE.md](./docs/DEV_GUIDE.md)
+
+### Upgrading electron version
+
+When upgrading, upload debug symbols to sentry:
+```
+node sentry-symbols.js
+```
+https://docs.sentry.io/platforms/javascript/electron/#uploading-debug-information

package.json

@@ -21,6 +21,7 @@
     "@fortawesome/free-solid-svg-icons": "^5.13.0",
     "@fortawesome/react-fontawesome": "^0.1.9",
     "@mysteriumnetwork/terms": "^0.0.24",
+    "@sentry/electron": "1.3.0",
     "byte-size": "^6.2.0",
     "history": "^4.10.1",
     "lodash": "^4.17.15",
@@ -45,6 +46,7 @@
     "universal-analytics": "^0.4.20"
   },
   "devDependencies": {
+    "@sentry/cli": "^1.52.3",
     "@types/css-font-loading-module": "^0.0.4",
     "@types/lodash": "^4.14.149",
     "@types/node": "12.12.35",
@@ -60,6 +62,7 @@
     "@typescript-eslint/parser": "^2.28.0",
     "electron": "^8.2.3",
     "electron-builder": "^22.5.1",
+    "electron-download": "^4.1.1",
     "electron-webpack": "^2.8.2",
     "electron-webpack-ts": "^4.0.1",
     "eslint": "^6.8.0",
@@ -74,6 +77,7 @@
     "webpack": "^4.42.1"
   },
   "analyticsAccountId": "UA-89155936-2",
+  "sentryDsn": "https://[email protected]/5222592",
   "electronWebpack": {
     "renderer": {
       "webpackConfig": "webpack.renderer.additions.js"

sentry-symbols.js

@@ -0,0 +1,106 @@
+#!/usr/bin/env node
+/* eslint-disable */
+
+let SentryCli;
+let download;
+
+try {
+  SentryCli = require('@sentry/cli');
+  download = require('electron-download');
+} catch (e) {
+  console.error('ERROR: Missing required packages, please run:');
+  console.error('npm install --save-dev @sentry/cli electron-download');
+  process.exit(1);
+}
+
+const VERSION = /\bv?(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)\.(?:0|[1-9]\d*)(?:-[\da-z-]+(?:\.[\da-z-]+)*)?(?:\+[\da-z-]+(?:\.[\da-z-]+)*)?\b/i;
+const SYMBOL_CACHE_FOLDER = '.electron-symbols';
+const package = require('./package.json');
+const sentryCli = new SentryCli('./sentry.properties');
+
+async function main() {
+  let version = getElectronVersion();
+  if (!version) {
+    console.error('Cannot detect electron version, check package.json');
+    return;
+  }
+
+  console.log('We are starting to download all possible electron symbols');
+  console.log('We need it in order to symbolicate native crashes');
+  console.log(
+    'This step is only needed once whenever you update your electron version',
+  );
+  console.log('Just call this script again it should do everything for you.');
+
+  let zipPath = await downloadSymbols({
+    version,
+    platform: 'darwin',
+    arch: 'x64',
+    dsym: true,
+  });
+  await sentryCli.execute(['upload-dif', '-t', 'dsym', zipPath], true);
+
+  zipPath = await downloadSymbols({
+    version,
+    platform: 'win32',
+    arch: 'ia32',
+    symbols: true,
+  });
+  await sentryCli.execute(['upload-dif', '-t', 'breakpad', zipPath], true);
+
+  zipPath = await downloadSymbols({
+    version,
+    platform: 'win32',
+    arch: 'x64',
+    symbols: true,
+  });
+  await sentryCli.execute(['upload-dif', '-t', 'breakpad', zipPath], true);
+
+  zipPath = await downloadSymbols({
+    version,
+    platform: 'linux',
+    arch: 'x64',
+    symbols: true,
+  });
+  await sentryCli.execute(['upload-dif', '-t', 'breakpad', zipPath], true);
+
+  console.log('Finished downloading and uploading to Sentry');
+  console.log(`Feel free to delete the ${SYMBOL_CACHE_FOLDER}`);
+}
+
+function getElectronVersion() {
+  if (!package) {
+    return false;
+  }
+
+  let electronVersion =
+    (package.dependencies && package.dependencies.electron) ||
+    (package.devDependencies && package.devDependencies.electron);
+
+  if (!electronVersion) {
+    return false;
+  }
+
+  const matches = VERSION.exec(electronVersion);
+  return matches ? matches[0] : false;
+}
+
+async function downloadSymbols(options) {
+  return new Promise((resolve, reject) => {
+    download(
+      {
+        ...options,
+        cache: SYMBOL_CACHE_FOLDER,
+      },
+      (err, zipPath) => {
+        if (err) {
+          reject(err);
+        } else {
+          resolve(zipPath);
+        }
+      },
+    );
+  });
+}
+
+main().catch(e => console.error(e));

sentry.properties

@@ -0,0 +1,5 @@
+defaults.url=https://sentry.io/
+defaults.org=mysterium-network
+defaults.project=mysterium-vpn-desktop
+auth.token=20b8c458cd2e4ff59f49900bf5c4fa5c38f330287e354e66bce180792d1a28a7
+cli.executable=../../.config/yarn/global/node_modules/@sentry/cli/bin/sentry-cli

src/main/index.tsx

@@ -7,22 +7,25 @@
 import * as path from "path"
 import { format as formatUrl } from "url"
 
-import { app, BrowserWindow, ipcMain, Tray, Menu } from "electron"
+import * as Sentry from "@sentry/electron"
+import { app, BrowserWindow, ipcMain, Menu, Tray } from "electron"
 
 import * as packageJson from "../../package.json"
 import { winSize } from "../config"
 import { supervisor } from "../supervisor/supervisor"
 import {
-    setupGlobals as setupAnalyticsGlobals,
+    initialize as initializeAnalytics,
     setupApp as setupAnalyticsForApp,
+    setupGlobals as setupAnalyticsGlobals,
     setupWindow as setupAnalyticsForWindow,
-    initialize as initializeAnalytics,
 } from "../analytics/analytics-main"
 
 import { createTray, refreshTrayIcon } from "./tray"
 import { MainIpcListenChannels, WebIpcListenChannels } from "./ipc"
 import { createMenu } from "./menu"
 
+Sentry.init({ dsn: packageJson.sentryDsn })
+
 const isDevelopment = process.env.NODE_ENV !== "production"
 
 // eslint-disable-next-line @typescript-eslint/ban-ts-ignore
@@ -113,6 +116,7 @@ const createWindow = async (): Promise<BrowserWindow> => {
 app.on("ready", async () => {
     win = await createWindow()
     tray = createTray(app, win)
+    throw new Error("dududu")
     initializeAnalytics()
     setupAnalyticsGlobals()
     setupAnalyticsForApp(app)

src/renderer/index.tsx

@@ -10,9 +10,13 @@ import fs from "fs"
 import React from "react"
 import ReactDOM from "react-dom"
 import { createGlobalStyle } from "styled-components"
+import * as Sentry from "@sentry/electron"
 
 import "mobx-react-lite/batchingForReactDom"
 import { Routes } from "../navigation/routes"
+import * as packageJson from "../../package.json"
+
+Sentry.init({ dsn: packageJson.sentryDsn })
 
 const robotoLightPath = path.join(__static, "/fonts/Roboto-Light.ttf")
 const robotoLightBuffer = fs.readFileSync(robotoLightPath)