なんか書いていこうぜー.com

Let's write something good

Electronアプリ開発に protractor 入れた話

2016-01-06
  • Share on Facebook
  • Tweet
  • Add to Pocket

趣味で Electron アプリを少しずつ作成しているのであるが、JavaScript のテストをまともに書ききったことがないため、導入してみようと思い、E2E のツールとしてprotractor を導入したので、メモ。

protractor とは

AngularJS の end to end testing tool として生まれているが、AngularJS を使っていなくても導入できる。 AngularJS を使っている場合は、{hoge} みたいな画面に bind している値を取得できて便利らしい。

導入すると一緒にインストールされる webdriver-manager を使ってブラウザを動作させてテストを実行する。

導入

https://angular.github.io/protractor/#/tutorial を見ながら導入する。

$ npm i --save-dev protractor
$ ./node_modules/.bin/webdriver-manager update

project の直下に conf.js を作成し、ここにend to end test の設定を書き、protractor conf.js してテストを流す。

$ protractor conf.js

conf.js にいろいろと設定を書いておき、この設定にそってテストが実行される。設定の書き方は Configuration File Reference を見ながら書く。

{% gist a58824ebbfadee1c788b #file-conf-js %}

L2-7 は、power-assert を使うために、babel-plugin-espower を噛ませる設定。

L10 の chromedriver は、protractor を導入した際に一緒にインストールされたものを指定する。 L11 は、./node_modules/.bin/webdriver-manager start した際にコンソールに出力されるアドレスを記載する。

L14-16 に実行する end to end test のパターンを記載する。流しやすいように e2e というディレクトリを作成してそこにテストを配置した。 L17-24 で、Electron 用の設定を記載している。browserName には chrome を、chromeOptionsbinary には electron-prebuilt のバイナリのパスを指定している。

ここがあまり調べても載ってなかったのだが、argsapp= として、Electron の entry point になっているjs を指定する必要がある。 これがないと、blank のElectron のページが立ち上がって終わる…

L26 の browser.ignoreSynchronization = true; は非AngularJS なアプリで protractor を利用する際に必要とのこと。参照: stackoverflow

{% gist 99c2337c1d611b322356 #file-showhome-e2e-js %}

browser.get(url) みたいなもので希望するページを指定できたりするが、Electron の場合、起動時に開いているページについて特に指定しなくてもOKっぽい。トップページの class=“title” に “こんにちは” とあればテストが通る。

大事なこと

Electron アプリの場合、argsapp=entry point の js が必要です。

※ GitHub のソース検索すると、http://localhost:8000 と書いてあるソースが多いが、それでは動かなかった…ここに到達するのに時間かかった。using-selenium-and-webdriver.md3. Connect to chrome driver のコメント見て気がついた…

arch の kernel を update したとき

2015-08-04
  • Share on Facebook
  • Tweet
  • Add to Pocket

MBA を Arch Linux 機にしているのであるが、kernel が update するたびに、wifi が動作しなくなってしまう。

仮に今は、yaourt broadcom-wl-dkmsyaourt mba6x_bl-dkms を再インストールして回避してる。 実際はもっとよい(というか正しい)対処法があるのだろうけど、これをやると module をビルドして depmod コマンドを内部で発行してくれているみたいなので、動作するようになってる。

ここらへんは何読んだらわかるようになるんだろう…?

active_decorator の spec でハマった話

2015-07-30
  • Share on Facebook
  • Tweet
  • Add to Pocket

今日、app/modelsに配置されているただの class で表示用のメソッドがごにょごにょ生えているのを ActiveDecorator に移動させてはどうかと指摘をいただいたので、移動させた。 spec が 1 件だけあったので、これも Decorator のテストに書き換えようとして、ハマった。

まとめ(先に)

  • Thank you, @flada_auxv san!
  • ActiveDecorator のテストをするとき、Controllerインスタンスから view_context を生成すると思うけど、ApplicationControlle#request を設定しておくと、URL使うテストでハマらない。

コード例と現象

まずは、例とするコード(若干適当なところが…)

class GroupSummary
  def initialize(group, total_count, failure_count)
    @group         = group
    @total_count   = total_count.to_i
    @failure_count = failure_count.to_i
  end
end

module GroupSummaryDecorator
  # NOTE これがポイント
  def summary_url
    group_summary_url(@group)
  end

  # こいつらはテストしても期待通りに動く
  def success_count
    @total_count - @failure_count
  end
end

describe GroupSummaryDecorator do
  let(:group) { FactoryGirl.create(:group) }
  let(:group_summary) { GroupSummary.new(group, 0, 0) }

  before do
    ActiveDecorator::ViewContext.push ApplicationController.new.view_context
  end

  after do
    ActiveDecorator::ViewContext.pop
  end

  describe '#summary_url' do
    before do
      ActiveDecorator::Decorator.instance.decorate group_summary
    end

    specify do
      expect(group_summary.summary_url).to eq 'http://localhost:3000/groups/1000'
    end
  end
end

bundle exec rspec spec/decorators/group_summary_decorator_spec.rb
# => NoMethodError: undefined method `group_summary_url` for #<GroupSummary:0x00000000>

ActiveDecorator::ViewContext に ApplicationController インスタンスの viewcontext を push しているにもかかわらず NoMethodError が出る。 Decorator のメソッドはみつかっているものの、その中の urlfor なパスがないって言われる。

調べてみた

ググッてみると、以下の記事をみつけた。

Testing Draper decorators with real helpers, including URL helpers.

hogepath、fugaurl のような Decorator内で urlfor なメソッドを使いたい場合は、viewcontext のレシーバとなる Controller のインスタンスに request を設定しなければならない様子。

これは ActiveDecoratorが、ここで methodmissing を利用して viewcontext にある同メソッドを呼び出すと思うのですが、ここで actionpack/lib/action_controller/metal/url_for.rb で上書きされている url_optionsurl_for で利用しており、その影響で request が空だとうまく URL が作成できないため(らしい)。

ActionDispatch::TestRequest という便利なものが用意されているので、これを ApplicationController#request に代入してやるとうまいこと URL が作られた。

describe GroupSummaryDecorator do
  let(:group) { FactoryGirl.create(:group) }
  let(:group_summary) { GroupSummary.new(group, 0, 0) }

  before do
    controller = ApplicationController.new
    controller.request = ActionDispatch::TestRequest.new

    ActiveDecorator::ViewContext.push controller.view_context
  end
  ------
end

bundle exec rspec spec/decorators/group_summary_decorator_spec.rb
# => passed

※ URL の port がうまく設定されず困っていたが、このTestRequestのリファレンスみると、‘HTTP_HOST’ に対してホスト名とポートをくっつけたものを渡せば反映されるっぽいので、反映したらうまくポートも反映されたのであった。

関西Ruby会議06に参加してLTしてきた

2015-07-12
  • Share on Facebook
  • Tweet
  • Add to Pocket

CFP だして LT 通ったので、夜な夜なせっせこアプリを作っていたのだけれど間に合わず、当日本番までに動くものを用意できなかったので、ハマったところを挙げてスライド作ってみた。

前日最終ということで脳内練習したら時間余ったので、急遽5枚くらい追加したのであるが、ド緊張でスピードが出ず全く到達しなかったemoji-sob

発表時 poltergeist のくだりで、「ポルターガイストのくせに、モノが動かずに(エラーメッセージの)文字列だけが返ってくる」と話したのであるが、この部分はそもそもポルターガイストは何もしていないのに物体が勝手に動いたりする現象なのに、モノが動かないのはポルターガイスト現象って… という意味を掛けた感じだったのであるが、懇親会で会話したところ「めんどくせぇ!」と一蹴されたのであった。

伝わらなかったらしい。emoji-sweat_drops

※スライドにも書いてあるけど、2.0.0 でモノが動くようになっているので安心してご利用ください。emoji-smile

本番で時間が足りなかったので到達してないのであるが、まとめとして「涙の数だけ強くなれるよ…」というのを入れていて、この部分で「アスファルトに咲く花ではないけど」という岡本真夜的な雰囲気を醸し出す枕詞をつける予定だったので、到達しなかったのが非常に残念であった。

さすがにここはわかってもらえたはず…

会自体は平和な雰囲気で進んでいき、基調講演であるMatzのRuby開発の変遷の話や、ささださんのキーワード引数の話、スポンサーLT、CFPから採択された発表、LTなどなど、あっという間に時間が過ぎていった感じがした。

今回の関西Ruby会議は、実装や業務で投入したものの話が多く、非常に勉強になるものが多かったと思った。ささださんの発表でキーワード引数をブロック引数にも使えることを初めて知った。emoji-memo

なんかスライドまとまってた関西Ruby会議06 スライドまとめ #kanrk06のでリンク貼っておきます。

何ヶ月前から準備をしていたスタッフのみなさん、当日スタッフのみなさん、基調講演のMatzとささださん、発表者のみなさん、スポンサー各位、参加者のみなさんお疲れ様でした。ありがとうございましたemoji-bow

※スタッフのみなさんはまだ終わっていないのは存じあげておりますが一旦の区切りとして。

minami.rb最初で最後のLT大会に参加してきた

2015-03-29
  • Share on Facebook
  • Tweet
  • Add to Pocket

minami.rb が終了する というので、最初で最後のLT大会 に LT 申し込んで参加してきました。

雰囲気

終わるとかいう悲観的な雰囲気は一切なく、同窓会的な雰囲気のある感じでした。

特に何も持ってくる必要はない、と言われつつも、みんなおやつを持参してくるのが実に minami.rb っぽい。↑これが全部ではなかった…

参加者は、大阪で開催しているにもかかわらず兵庫、和歌山、神奈川、東京などから来ているという幅広さ。

会場は、糸屋町STUDIO というところで、もともと写真撮影に使うスタジオらしいのだけれども、こういう感じのイベントにも提供をしているんだそうな。

前半戦

一発目の発表者が遅れてくる(後半戦に結局やった)というハプニングが発生しつつ、飛ばして順番に LT をしていくスタイル。今回は 5 分は目安ということで進行していきました。

自分語りや、minami.rb の思い出・成長記録、テックトーク、エバンジェリストの活動報告などなど皆々様思い思いの LT を実施しておりました。

↓ 私の発表はこれ。

前半戦の〆として、辻田さんの LT。 minami.rb の歴史を振り返ってこれまでにやったことなんかを発表されておりました。

酒・飯

後半戦に入る前に、酒・飯です。これも minami.rb らしいところなんですが、日本酒を主として参加者がこんだけ酒持ってきましたemoji-smile (全部は呑みきれませんでしたけどね)

他にも寿司とか、おでん、お手製のオードブル、(酒呑みらしく)漬物 などなど。 (料理もっと撮影しておけばよかったけど、忘れてた。。)

かなりみなさんご歓談しておりまして、後半の開始が遅れておりました。

後半戦

だいぶ酒入ってきたので、ゆるい感じになりつつ、LT を再開。 コミュニティに対する活動報告や、Rails を勉強してつまずいたところの復習、Rails で解決させた悩み、mruby の話や、3 分クッキングまで多種多様の楽しい LT がありました。

↓ 5 分の LT で、3 分間クッキング(例のBGMつき) をやってできたナポリタンを振る舞った跡

ファウンダの一人である、よしださんのモチベーションと学習方法についての LT で後半戦は終了となりました。

後半戦があった後、食べ物、飲み物を胃の中に入れる時間があったので、みんなで食べ飲みしてました。 21 時に会が終了ということで、最後に辻田さんからお言葉をいただいて〆となりました。

最後に、minami.rb を終了する理由について語られて(後日ブログに書くとのこと)、参加者・関係者の皆様に感謝の言葉を述べられて終了となりました。

会場の片付けをした後、出口でメッセージつきのお菓子をいただきましたemoji-exclamation(写真は控えます)

最後に

辻田さん、吉田さん、minami.rb の運営お疲れ様でした!

私含め、たくさんのメンバーが minami.rb に参加して、minami.rb から Ruby, Rails, お酒(w), その他技術やコミュニティに関する刺激を受けたと思います。 minami.rb は終了しますが、活動が止まるお二人ではないと思いますので、今後のご活躍をお祈りしつつ、応援しております。ありがとうございました emoji-bow