fix(boot): issue with fetching user settings

When we start up the app we attempt to fetch the users store settings from IndexedDb by loading up a hidden browser window and execute code within it to connect to and fetch settings from the database. This fix ensures that we properly close out this hidden window once we have fetched the user settings. This resolves an issue that prevented the production build from starting up fully.
LN-Zap · Oct 30, 2018 · 9b7b972 · 9b7b972
1 parent d2e40ed
commit 9b7b972
Show file tree

Hide file tree

Showing 6 changed files with 59 additions and 12 deletions.
diff --git a/app/empty.html b/app/empty.html
@@ -0,0 +1,4 @@
+<!DOCTYPE html>
+<html>
+  <body>This empty html page is used for internal purposes. See fetchSettings() main.dev.js</body>
+</html>
diff --git a/app/main.dev.js b/app/main.dev.js
@@ -29,14 +29,17 @@ mainLog.time('Time until app is ready')
  * @return {[type]} 'settings' store from indexedDb.
  */
 const fetchSettings = () => {
-  const win = new BrowserWindow({ show: false })
+  const win = new BrowserWindow({ show: false, focusable: false })
   if (process.env.HOT) {
     const port = process.env.PORT || 1212
-    win.loadURL(`http://localhost:${port}`)
+    win.loadURL(`http://localhost:${port}/dist/empty.html`)
   } else {
-    win.loadURL(`file://${__dirname}`)
+    win.loadURL(`file://${__dirname}/dist/empty.html`)
   }
 
+  // Once we have fetched (or failed to fetch) the user settings, destroy the window.
+  win.on('load-settings-done', () => process.nextTick(() => win.destroy()))
+
   const dbName = getDbName()
   mainLog.debug(`Fetching user settings from indexedDb (using database "%s")`, dbName)
 
@@ -69,8 +72,13 @@ const fetchSettings = () => {
     )
     .then(res => {
       mainLog.debug('Got user settings: %o', res)
+      win.emit('load-settings-done')
       return res
     })
+    .catch(err => {
+      win.emit('load-settings-done')
+      throw err
+    })
 }
 
 const getSetting = (store, key) => {
@@ -90,13 +98,15 @@ app.on('ready', async () => {
   let theme = {}
   let locale
 
-  try {
-    const settings = await fetchSettings()
-    locale = getSetting(settings, 'locale')
-    const themeKey = getSetting(settings, 'theme')
-    theme = themes[themeKey]
-  } catch (e) {
-    mainLog.warn('Unable to determine user locale and theme', e)
+  if (!process.env.DISABLE_INIT) {
+    try {
+      const settings = await fetchSettings()
+      locale = getSetting(settings, 'locale')
+      const themeKey = getSetting(settings, 'theme')
+      theme = themes[themeKey]
+    } catch (e) {
+      mainLog.warn('Unable to determine user locale and theme', e)
+    }
   }
 
   // Create a new browser window.

diff --git a/internals/webpack/webpack.config.renderer.dev.js b/internals/webpack/webpack.config.renderer.dev.js
@@ -13,6 +13,7 @@ import webpack from 'webpack'
 import merge from 'webpack-merge'
 import { spawn, execSync } from 'child_process'
 import HtmlWebpackPlugin from 'html-webpack-plugin'
+import CopyWebpackPlugin from 'copy-webpack-plugin'
 import AddAssetHtmlPlugin from 'add-asset-html-webpack-plugin'
 import CspHtmlWebpackPlugin from 'csp-html-webpack-plugin'
 import baseConfig, { rootDir } from './webpack.config.base'
@@ -195,6 +196,8 @@ export default merge.smart(baseConfig, {
       debug: true
     }),
 
+    new CopyWebpackPlugin([path.join('app', 'empty.html')]),
+
     new HtmlWebpackPlugin({
       template: path.join('app', 'app.html')
     }),

diff --git a/internals/webpack/webpack.config.renderer.prod.js b/internals/webpack/webpack.config.renderer.prod.js
@@ -5,6 +5,7 @@
 import path from 'path'
 import MiniCssExtractPlugin from 'mini-css-extract-plugin'
 import HtmlWebpackPlugin from 'html-webpack-plugin'
+import CopyWebpackPlugin from 'copy-webpack-plugin'
 import CspHtmlWebpackPlugin from 'csp-html-webpack-plugin'
 import { BundleAnalyzerPlugin } from 'webpack-bundle-analyzer'
 import CleanWebpackPlugin from 'clean-webpack-plugin'
@@ -147,6 +148,8 @@ export default merge.smart(baseConfig, {
   plugins: [
     new CleanWebpackPlugin([path.join('app', 'dist')]),
 
+    new CopyWebpackPlugin([path.join('app', 'empty.html')]),
+
     new MiniCssExtractPlugin(),
 
     new HtmlWebpackPlugin({

diff --git a/package.json b/package.json
@@ -39,7 +39,7 @@
     "storybook:build": "build-storybook",
     "storybook:deploy": "npm run storybook:build && gh-pages -t -r git@github.com:LN-Zap/zap-desktop.git -d storybook-static -o origin -b gh-pages",
     "test": "npm run lint && npm run lint-styles && npm run flow && npm run build && npm run test-unit && npm run test-e2e",
-    "test-base": "cross-env NODE_ENV=test BABEL_DISABLE_CACHE=true ELECTRON_DISABLE_SECURITY_WARNINGS=true node --trace-warnings ./node_modules/jest/bin/jest --maxWorkers=2 --forceExit",
+    "test-base": "cross-env NODE_ENV=test BABEL_DISABLE_CACHE=true DISABLE_INIT=true ELECTRON_DISABLE_SECURITY_WARNINGS=true node --trace-warnings ./node_modules/jest/bin/jest --maxWorkers=2 --forceExit",
     "test-unit": "npm run test-base -- --coverage ./test/unit",
     "test-e2e": "npm run test-base -- ./test/e2e",
     "test-ci": "npm run test-e2e && npm run test-unit"
@@ -233,6 +233,7 @@
     "chalk": "^2.4.1",
     "clean-webpack-plugin": "^0.1.19",
     "concurrently": "^4.0.1",
+    "copy-webpack-plugin": "^4.5.4",
     "coveralls": "^3.0.2",
     "cross-env": "^5.2.0",
     "cross-spawn": "^6.0.5",

diff --git a/yarn.lock b/yarn.lock
@@ -5178,6 +5178,20 @@ copy-to-clipboard@^3.0.8:
   dependencies:
     toggle-selection "^1.0.3"
 
+copy-webpack-plugin@^4.5.4:
+  version "4.5.4"
+  resolved "https://registry.yarnpkg.com/copy-webpack-plugin/-/copy-webpack-plugin-4.5.4.tgz#f2b2782b3cd5225535c3dc166a80067e7d940f27"
+  integrity sha512-0lstlEyj74OAtYMrDxlNZsU7cwFijAI3Ofz2fD6Mpo9r4xCv4yegfa3uHIKvZY1NSuOtE9nvG6TAhJ+uz9gDaQ==
+  dependencies:
+    cacache "^10.0.4"
+    find-cache-dir "^1.0.0"
+    globby "^7.1.1"
+    is-glob "^4.0.0"
+    loader-utils "^1.1.0"
+    minimatch "^3.0.4"
+    p-limit "^1.0.0"
+    serialize-javascript "^1.4.0"
+
 core-js@2.5.7, core-js@^2.4.0, core-js@^2.4.1, core-js@^2.5.0, core-js@^2.5.3, core-js@^2.5.7:
   version "2.5.7"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-2.5.7.tgz#f972608ff0cead68b841a16a932d0b183791814e"
@@ -8032,6 +8046,18 @@ globby@^6.1.0:
     pify "^2.0.0"
     pinkie-promise "^2.0.0"
 
+globby@^7.1.1:
+  version "7.1.1"
+  resolved "https://registry.yarnpkg.com/globby/-/globby-7.1.1.tgz#fb2ccff9401f8600945dfada97440cca972b8680"
+  integrity sha1-+yzP+UAfhgCUXfral0QMypcrhoA=
+  dependencies:
+    array-union "^1.0.1"
+    dir-glob "^2.0.0"
+    glob "^7.1.2"
+    ignore "^3.3.5"
+    pify "^3.0.0"
+    slash "^1.0.0"
+
 globby@^8.0.0:
   version "8.0.1"
   resolved "https://registry.yarnpkg.com/globby/-/globby-8.0.1.tgz#b5ad48b8aa80b35b814fc1281ecc851f1d2b5b50"
@@ -12239,7 +12265,7 @@ p-is-promise@^1.1.0:
   resolved "https://registry.yarnpkg.com/p-is-promise/-/p-is-promise-1.1.0.tgz#9c9456989e9f6588017b0434d56097675c3da05e"
   integrity sha1-nJRWmJ6fZYgBewQ01WCXZ1w9oF4=
 
-p-limit@^1.1.0:
+p-limit@^1.0.0, p-limit@^1.1.0:
   version "1.3.0"
   resolved "https://registry.yarnpkg.com/p-limit/-/p-limit-1.3.0.tgz#b86bd5f0c25690911c7590fcbfc2010d54b3ccb8"
   integrity sha512-vvcXsLAJ9Dr5rQOPk7toZQZJApBl2K4J6dANSsEuh6QI41JYcsS/qhTGa9ErIUUgK3WNQoJYvylxvjqmiqEA9Q==