[WIP]Electronつかってみた

いまさらElectronつかってみた。

quick-start

公式サイトに従って、quick-startする。

git clone https://github.com/electron/electron-quick-start
cd electron-quick-start
npm install && npm start

画面が表示された。

アーキテクチャ

Electronアプリケーションは2種類のプロセスで構成される。

	メインプロセス	レンダラープロセス
同時プロセス数	1個	n個
呼び出し元	Electron	メインプロセス
ネイティブリソースアクセス	できる	できない

パッケージング

以下の3種類のツールがある。

• electron-packager
  • platform別の実行ファイルを生成できる。electron-forgeに移行する予定のようだ。
• electron-builder
  • インストーラを生成できる。
• electron-forge
  • packagerとbuilderの両方の機能があるが、まだ開発中らしい。

electron-packager

npx electron-packager . --platform=win32 --arch=x64 --ignore=\".git(ignore)\" --overwrite --icon=icon.icns

テスティング

spectron

test/spec.js

const Application = require('spectron').Application
const assert = require('assert')
const electronPath = require('electron')
const path = require('path')

describe('Application launch', function() {
  this.timeout(10000)

  beforeEach(function() {
    this.app = new Application({
      path: electronPath,
      args: [path.join(__dirname, '..')]
    })
    return this.app.start()
  })

  afterEach(function() {
    if (this.app && this.app.isRunning()) {
      return this.app.stop()
    }
  })

  it('shows an initial window', function() {
    return this.app.client.getWindowCount().then(function(count) {
      assert.equal(count, 1)
    })
  })
})

package.json

{
...
  "main": "main.js",
  "scripts": {
    "test": "mocha"
  },
  "devDependencies": {
...
    "mocha": "^6.0.2",
    "spectron": "^5.0.0"
...
  }
...
}