vagrant on mac で rspec with capybara (selenium)
mac vagrant 環境の railsのテストを rspec with capybara (Selenium)を使ってテストしたいってときに
※ Vagrant環境下におけるブラウザテストについて(Chrome編) | hifive開発者ブログ
を参考(◎とてもわかりやすい!!)にやってみた上で個人的に迷った点を補足した内容です。
前提
vagrant側でrails+rspec with capybara 環境構築済み
gem 'rspec-rails' gem 'capybara' gem 'selenium-webdriver'
設定の手順
1) Vagrantfileに下記を追加 し、vagrant 起動
Vagrant.configure(***) do | config | 〜 end の間に記載
config.vm.network :forwarded_port, guest: 3000, host: 3000
仮想環境側の3000番ポートがそのまま母艦の3000番ポートにつながっています。そのため母艦の http://localhost:3000/ にアクセスすると、仮想環境の http://localhost:3000/ にアクセスしたのと同じになります。
・・母艦って表現わかりやすいなぁ。ホストとゲストってピンとこないし。
2) vagrant環境の rails 開発環境の spec/rails_helper.rb に下記 追記
# use chrome driver with capybara Capybara.javascript_driver = ENV['DRIVER'] ? ENV['DRIVER'].to_sym : :chrome Capybara.app_host = [:safari, :chrome, :firefox, :iphone, :ipad].include?(Capybara.javascript_driver) ? "http://localhost:3000" : "http://10.0.2.2:3000" Capybara.default_wait_time = 10 Capybara.run_server = false Capybara.register_driver :chrome do |app| Capybara::Selenium::Driver.new app, browser: :remote, desired_capabilities: Selenium::WebDriver::Remote::Capabilities.chrome, url: "http://10.0.2.2:4444/wd/hub" end
※ 参考元からコピペ後 IPを 「10.0.2.2」に変更
10.0.2.2 は vagrant(ゲスト)側からみた 「母艦」(ホスト)側のIPとなるとのこと↓
参考:VirtualBox 内のゲスト OS からホスト OS にアクセスしたい · GitHub
3)vagrant環境 で railsサーバ 起動 = localhost:3000 で動く
rails s
※当方 動かず。。→ rails 4.2 だったため
rails s -b 0.0.0.0
【小ネタ】PHPのエイプリルフールネタは終わった?
本日は4/1ですね。様々なエイプリルフールネタがネット上を賑わしていますが、
phpのエイプリルフールネタは、
phpinfo();
を実行すると、phpのロゴが変わっている(主に動物)
って内容だったのですが、
久々(多分3年ぶり)本日実行してみたら、、
変わってない。。普通でしたね。。
いつからやめちゃったのかな。。
…そして、気づいた。はてなブログのエイプリルフールネタ。
http://staff.hatenablog.com/entry/2013/04/01/000000
今記事作ったら日付が 2013-3-32 となってる。
Titanium Studio 推奨環境 スペック
最新(2013/1/16時点)のTitanium Studio で開発するための推奨スペック等を。
参考 : Titanium サポートページより
- ハード
- JDK (Java Development Kit)
- Android SDK(Android SDK Manager よりインストール)
- Xcode (iOS開発用)
- 4.2 ~ 4.5.2
- iOS 5.1には 4.3以上、iOS 6.0の開発には 4.5以上が必要
他のツールは最新版をインストールしとけば問題無しかと。
Windows7 Titanium Studio 開発環境構築手順 ~ Android アプリ開発準備 ~
Windows 7 に Titanium Studio でAndroidアプリを開発するための環境構築手順をさっくりまとめます。
※ 大変参考になるページがありました。 64bit対応した手順ですので、こちらもぜひご参考に。
Java (JDK)のインストール
- http://www.oracle.com/technetwork/java/javase/downloads/index.html から [Java SE 6 Update 33]の[JDK Download]をクリック
- 「Accept License Agreement」を選択してから 「Windows x86」(32bit)
「Windows x64」(64bitの場合)⇒64bitの場合も「Windows x86」をクリックする⇒ダウンロード(■図1) - インストールexeを実行してインストール完了
- ユーザ環境変数「JAVA_HOME」JDKをインストールしたPATH(例:C:\Program Files\Java\jdk1.6.0_33\)を設定してください。
■図1
■図2 環境変数設定(コントロールパネル>システムとセキュリティ>システム からの遷移)
Android SDKのインストール
- http://developer.android.com/sdk/index.html より ダウンロード
- インストーラexeを実行してインストール (※ インストールパスを「 C:\Android\android-sdk 」に設定しました。)
- インストールされたファイル内の「adb.exe」を別のフォルダにコピー (※1)
- システム環境変数「path」に 追加 (※2、■図3)
- ⇒ 完了後 SDK Manager 起動 し、AndroidのAPIをダウンロード
【全てのAPIをダウンロードするのが一番確実です。】
※1 adb.exe の コピー
コピーするファイル
C:\Android\android-sdk\platform-tools\adb.exe
コピー先フォルダ( ここへコピーアンドペースト)
C:\Android\android-sdk\tools
※2 システム環境変数「path」 に
C:\Android\android-sdk\platform-tools;C:\Android\android-sdk\tools;
を追加
■図3 pathの設定方法
Titanium studio
『Titanium Mobileで開発するiPhone/Androidアプリ』の著者である @donayama さんが、補完稿としてインストール周りの章を追記・修正されたものを公開されています。
こちらをベースに説明します。
ダウンロード~インストール
- 上記資料(PDF) 2-3. Titanium Studioのインストール に添って Windows用インストーラーexe ファイルをダウンロードして下さい。
- 2-3-2. Windows 7 の項を参考にインストールを行なって下さい。
今回 (2012/6/27 現在)インストールしたTitanium Studio の バージョン
Titanium Studio, build: 2.0.2.201205311912 (c) Copyright 2012 by Appcelerator, Inc. All rights reserved. Build: jenkins-titanium-rcp-master-204 (origin/master) Date: 31 May 2012, 19:15:04
開発環境 確認作業 (Androidアプリを構築してみる)
上記資料(PDF)2-5. Hello Worldプロジェクトの作成をガイドにすすめてみましょう。
- Titanium Studio 起動 (■図4-a workspace を各自指定してください。)
- 起動時にログインを促されます(■図4-b) ダウンロード時に取得したアカウントでログインしましょう。
※ Titanium Studioはネットに繋がっていないと起動できません。 - 起動後git supportの設定を促すダイヤログがでますが、だまってOKして、しばらく待ちましょう。
- 起動時にログインを促されます(■図4-b) ダウンロード時に取得したアカウントでログインしましょう。
- 起動後 Titanium Mobile Projectを新規作成(■図5)
- Projectを設定⇒構築(■図6)
- Android Emulater用にビルド⇒起動(■図7)
- エミュレータが立ち上がって、Console欄のログ出力が収まったら、エミュレータ内でアプリをたちあげてみましょう。(■図8)
■図4-a
■図4-b
■図5
■図6
■図7
■図8
… というわけで、これにて 無事(!?)Androidアプリが開発できる環境が整いましたね。
お役に立てれば幸いです。m(__)m
JavaScriptでGoogleカレンダーのデフォルト表示月を動的にする方法 (2
前回からものすごーく時は過ぎているのですが、続編をちゃんと書こうとおもいます。
※説明は上記前回既読を前提に書いております。
本内容の前提条件
- ※ 運用に合わせ、20日を過ぎていたら翌月。20未満なら当月の予定を出す。という制御にした。
- googleカレンダー埋め込み iframe (<iframe src="https://www.google.com/calendar/embed?...."...</iframe>)以外のiframeはページ内に存在しない
というわけでそのjavascriptからgoogleの日付パラメータを動的に変える実装をさらっとご紹介。
1)googleカレンダーの日付パラメータに渡す javascript date.js を作成
冗長すぎるという。。m(__)m
/* from(yyyymm01)生成 現在日付 > middday なら 翌月、そうでなければ当月01日を返す */ function getDate(midday){ var addmonth = 1; var date = new Date(); var year = date.getFullYear(); var day = date.getDate(); if (day > midday) { addmonth = 2; } var month = date.getMonth() + addmonth; if (month < 10) { month = "0" + month; } var strDate = year + month + "01"; return strDate; } /* to(yyyymm02)生成 現在日付 > middday なら 翌月、そうでなければ当月02日を返す */ function getDateto(midday){ var date = new Date(); var year = date.getFullYear(); var day = date.getDate(); if (day > midday) { addmonth = 2; } var month = date.getMonth() + addmonth; //getMonth は 0-11を取得 if (month < 10) { month = "0" + month; } var strDate = year + month + "02"; return strDate; } /* 「&dates=yyyymm01/yyyymm02」を googleカレンダー埋め込み iframe<iframe src="https://www.google.com/calendar/embed?...." のsrc属性の末尾に足しこむ。 */ function setGoogleDates(midday) { //alert (getDate(1)); var midday = 12; var obj= document.getElementsByTagName("iframe")[0]; // ページ内の一番最初(0個目)のiframe=googleカレンダーである場合。 obj.src = obj.src+'&dates='+getDate(midday) + "/" + getDateto(midday); // ここで足し込む }
あとは1)のdate.jsをサイト上に配置し、
googleカレンダーを埋め込んだHTML内で
<script type="text/javascript" src="./date.js"></script> <*-- HTMLとdate.jsが同じ階層においてある場合 -->
とかすれば、これで完成なう。。のはず。。
自分と同じ境遇(HTML上でgoogleカレンダーを動的に表示したい。)の方がいれば。 お役に立てれば幸いでございまする。
JavaScriptでGoogleカレンダーのデフォルト表示月を動的にする方法 (1
こんにちは。
今日は うちの会社のスクールの空きスケジュールを
googleカレンダーを使って公開するときに
「今月もう終わるのに今月のカレンダーの予定が出てても意味ないなー、来月の予定を表示したいなー」
現在日付が月の末日近く 例)20日 になったら、翌月のカレンダーを表示したい。
ってことで、まず 公開するgoogleカレンダー側で表示範囲を指定する方法を調べると。
に iframe srcパラメータに
&dates=表示範囲from(yyyymmdd)/ 表示範囲to (yyyymmdd) 例)&dates=20120501/201205/31 ⇒ 2012/5/1 ~ 2012/5/31 の期間を表示する。
見たいな感じでいけるらしい。
で、表示するカレンダーは月単位なので、
律儀にtoを月末にしなくとも、fromより新しい日であれば
いいのでは?ってことで、
&dates=20120501/20120502 (5/1~5/2)
で試してみたところ結果は一緒。OKこれならtoを生成するのもfrom+1日で済むのでらくちん。
ってことで動的に表示するフローは以下のとおりに。
1.月の末日近くの日付を定義 (例 20
2.現在日 > 1.の日付の場合
googleカレンダーパラメータの末尾に下記値を追加
&dates=翌月一日/翌月二日 ex) &dates=20120501/20120502
してみようとおもう。
で、PHPでちゃちゃっとやるかってとこですが、
…実はうちのスクールのwebサイトはCMSで構築してて
そのコンテンツはphpコード非対応。。あべしっ。。
というわけで、動的にするには。。javascriptでやっつけるしか無いですね。。
続きは(2 は次回までのおたのしみに。。
どうしても Titanium Studio 環境を windows 7 に 構築できない人へ
初ブログです。
スマホアプリ向け開発環境 Titanium studio の環境準備にには
多くの方が詳細な記事にされています(ありがたい限りですね。)
下記のページを参考させて頂きました。
Windows7環境でTitanium Studioをインストール
それらの情報を拝借したのですが、いかんせん癖があり、構築までハマリまくりました。
で、試行錯誤の末、なんとか 新規アプリ、kitchensink (サンプル)の起動まで行くことができました。
ということで。
上記の記事を踏まえてもTitanium studioのWIN7へのインストールが解決できない方に
もしかしたら助けになるかもと思い
実体験から感じたポイントを記載してみました。
titanium studioのバージョンは以下の通り
titanium studio Build: jenkins-titanium-rcp-master-138 (origin/master) Date: 14 February 2012, 12:10:43
以下ポイントです。 (※ 不要なこともあるかもしれませんが。。他に術がなければお試し下さい。)
■JDK
- jdk 6 をインストール(※7はだめです。)
こちらのURLより↓のDownloadボタンで取得したものをインストール
- インストールディレクトリは カッコを含むディレクトリ以下にするのはやめる。例) program files(x86)
(自分はC:\Program Files\Java\jdk1.6.0_31 にインストール) - 環境変数pathに「上記インストールディレクトリ/bin」を追加
(自分の場合: ;C:\Program Files\Java\jdk1.6.0_31\bin )
- sdkをインストールしたディレクトリ(※)\android-sdk\platform-tools\adb.exe
⇒ インストールしたディレクトリ (※) \android-sdk\tools ディレクトリへコピー
(※)自分の場合: c:\Android - 環境変数pathを インストールしたディレクトリ (※) \platform-tools; インストールしたディレクトリ (※) \tools へのフルパスを追加
(自分の場合 : C:\Android\android-sdk\platform-tools;C:\Android\android-sdk\tools)
- 起動は 「管理者として実行」 。
- androidsdkは 2.2(v8)を全てダウンロード。(時間がかかるができれば全てverダウンロードするのが吉)
■titanium studio
- [app explorer]-[Run Configurations...] で android API は Google APIs Android 2.2 を指定しましょう
- 結構起動まで時間かかるので、じっとまつ
- eclipseベースのソフトなので基本重い。他にも 重いソフトを立ち上げているとちゃんと動かないかも。
- こまったらPC再起動。