seleniumを使ってJavaScriptのみでWebUIを自動操作する
目的
seleniumをnode.jsで操作する
これによりJavaScriptのみでWebUIの自動操作が可能になる。

前提
 node.jsがインストールされている

Chromeでの自動操作
1. 下記のコマンドを実行
npm install selenium-webdriver

2. 以下のソースコードを実行


var webdriver = require('selenium-webdriver');
require('webdriver-helper');

var driver = new webdriver.Builder().
withCapabilities(webdriver.Capabilities.chrome()).
//withCapabilities(webdriver.Capabilities.ie()).
//withCapabilities(webdriver.Capabilities.firefox()).
build();

driver.get('https://secure.nicovideo.jp/secure/login_form');
driver.findElement(webdriver.By.xpath('//div[@class="loginFormWrap"]//form//input[@id="mail"]')).sendKeys('test');
driver.findElement(webdriver.By.xpath('//div[@class="loginFormWrap"]//form//input[@type="submit"]')).click();
driver.wait(function() {
return driver.findElement(webdriver.By.xpath('//div[@class="loginFormWrap"]//div[@class="wrongPass"]/p')).getText().then(function(txt) {
return '入力したメールアドレスまたはパスワードが間違っています' === txt;
});
}, 5000);
driver.quit();


IEでの自動操作
1. selenium-server-standaloneとIEDriverServerを入手する
http://docs.seleniumhq.org/download/

2. selenium-server-standaloneを起動する
java -jar selenium-server-standalone-2.39.0.jar -Dwebdriver.ie.driver=C:\dev\node\selenium\IEDriverServer32.exe

3. 以下を実行

var webdriver = require('selenium-webdriver');
require('webdriver-helper');

var driver = new webdriver.Builder().
//withCapabilities(webdriver.Capabilities.chrome()).
withCapabilities(webdriver.Capabilities.ie()).
//withCapabilities(webdriver.Capabilities.firefox()).
build();

driver.get('https://secure.nicovideo.jp/secure/login_form');
driver.findElement(webdriver.By.xpath('//div[@class="loginFormWrap"]//form//input[@id="mail"]')).sendKeys('test');
driver.findElement(webdriver.By.xpath('//div[@class="loginFormWrap"]//form//input[@type="submit"]')).click();
driver.wait(function() {
return driver.findElement(webdriver.By.xpath('//div[@class="loginFormWrap"]//div[@class="wrongPass"]/p')).getText().then(function(txt) {
return '入力したメールアドレスまたはパスワードが間違っています' === txt;
});
}, 5000);
driver.quit();

注意
Selectの操作はoptionに対してclick()を行う。
Javaとかと違って便利なSelectクラスなどはない。

IEのSendKeyが遅い場合は、IEDriverServerを64bitにしたり、32bitにしてみる。
http://devadjust.exblog.jp/19305561/


[PR]
# by mima_ita | 2014-06-11 18:04 | node.js
node.js + expressにおける多言語化の考察
目的:
本稿はnode.js+expressにおいて多言語化をどのようにするか考察する。

サンプル:
http://needtec.sakura.ne.jp/release/node_globalization_sample.zip

このサンプルはログイン画面とユーザ登録画面について、多言語化対応できるように実装している。
Sequelizeのエラーメッセージについては、対応できていない


More
[PR]
# by mima_ita | 2014-06-08 00:09 | node.js
sequelizeによるマイグレーションの方法
sequelize-cliをインストールすることにより、DBのマイグレーションが可能になる。
この機能により、本来は困難であるはずのDBスキーマーの更新を容易にすることが可能になる。

下記を参考にすること。
http://sequelizejs.com/docs/latest/migrations

More
[PR]
# by mima_ita | 2014-06-05 22:46 | node.js
Sequelizeの基本的な使い方
特徴:

SequelizeはMYSQL,MariaDB,SQLite,Postgresに簡単にアクセスするためのNode.jsのライブラリだ。

以下の機能を有している。
  • オブジェクトとDBの関連を取り持ってくれる。
    これは1テーブルだけの関係ではなく、複数のテーブルの関連を定義することができる。
  • 入力されたデータが適切かどうかのバリデーションチェックを行う。
  • トランザクションのサポートしている。 
  • マイグレーションの機能をサポートしている。
    これにより、データベースのスキーマの更新が容易になる。
  • 1.7.8ではロックの機能は有していないので、自前でSELECT FOR UPDATEなどをしなければならない。
    しかし、開発中の2.0.0-devにはロックの機能をサポートしている。




More
[PR]
# by mima_ita | 2014-06-05 22:36 | node.js
ぼくのかんがえたさいきょーのnode.jsの開発環境
この資料では「ボクのかんがえた最強のnode.jsの開発環境について」説明するよ!

はじめに

ここでは僕の考えた最強のnode.jsの開発環境について説明します。
node.jsはJavascriptの一種でサーバーサイドの処理を実装できます。
つまり、JavaScript使えるだけで、Web開発ができます。
やったね、社長、人件費が下がるよ!

node.jsのインストール方法

http://nodejs.org/
ここから、インストーラなりソースなり取得してインストールする。
Windows,Macはインストーラが存在しており、debianとかはソースから作成する。
Windowsの場合、ちょっと癖があり、VS2008や、VS2012との混在環境だとnpm installが失敗することがある。
その場合は、環境変数を調整してVS2010が動作するようにしておくこと。

node.jsのデバッグ方法
サーバーサイドのデバッグはできない。
そう思っていた時期が僕にもありました。

node-inspector とChromeを使えばデバッグできます。
https://github.com/node-inspector/node-inspector

インストール方法
>npm install -g node-inspector

デバッグ対象のアプリケーションの起動
>node --debug server.js
debugger listening on port 5858
--debugフラグを使用して対象のアプリケーションを起動すると、デバッグポートが表示される。
もしデバッグポートを変更したい場合は下記のようにする
node --debug=5859 app.js
もし、一行目でブレークを賭けたい場合は次の通り

node --debug-brk=5859 app.js


node-inspectorの起動

デバッグ対象のアプリケーションを起動したらnode-inspectorを起動する。
これにより、ブラウザ経由でデバッグが可能になる。
>node-inspector --web-port 8081 --debug-port 5859

--debug-portはデバッグ対象のプロセスのポート
--web-portはブラウザでデバッグするために使用するポートである。

Chromeによるデバッグ
chromeでnode-inspectorを実行時に支持されたURLにアクセスするとデバッグが可能になる。
先の例だと、以下のようなURLになる。

http://ホスト名:8081/debug?port=5859

b0232065_17150540.png

node.jsのメモリーリークの調べ方

クライアントサイドのメモリのスナップショット
クライアントサイドに関してはChromeなりなんなりの開発ツールを使えばいい。
Chromeの場合はF12を押下してProfilesタブでヒープのスナップショットをとれば、どの関数でどのオブジェクトがどれだけ、存在するかがわかる。
b0232065_17195900.png
b0232065_18261624.png
サーバサイドのメモリのスナップショット
node-webkit-agentを使用して、メモリのスナップショットを取ることが可能である
https://github.com/c4milo/node-webkit-agent

1. node-webkit-agentのインストール
>npm install webkit-devtools-agent

2.下記の命令を任意のソースに記述。
var agent = require('webkit-devtools-agent');

3. アプリケーションを起動

4. 以下のコマンドを実行
kill -SIGUSR2 <the process id of your nodejs app>

5. その後、Chromeで以下のURLにアクセスする
http://c4milo.github.io/node-webkit-agent/26.0.1410.65/inspector.html?host=デバッグ対象のホスト名:9999&page=0

その後は、Profileにてメモリのスナップショットを取得すればよい。
b0232065_17515347.png
なお、node.jsは世代別のガベージコレクションなので、解放したつもりでもメモリが残っている場合がある。そのときは、任意のタイミングでガベージコレクトを行ったあと、メモリのスナップショットを確認する。

ガベージコレクションを確実に走らせたい場合は以下のような処理が必要である。

まず、プログラム中でガベージクレクタを実行したい箇所に次のコードを埋め込む。
if(global.gc) {
global.gc();
}
そして、アプリを起動する際に--expose_gcを指定する
>node --expose_gc server.js

静的解析

gjslintによる静的解析
gjslintで不味い書き方を調べる。
jenkinsによって日々検査するとよい。
http://needtec.exblog.jp/22639788/

platoによるコードメトリックスの収集
platoを使用することで、ソースの行数や複雑度を計測できる。
https://github.com/es-analysis/plato

インストール方法:
npm install -g plato

実行方法:
plato -r -d report ./src
これによりreportフォルダ以下にHTMLが作成される。
b0232065_18012551.png
b0232065_18040282.png
おおむねComplexityが高いものがバグを発生しやすいので、テストケースの数や、リファクタリングの目安として監視する。
これもjenkinsで日々作成するといい。

テストの自動化

jasmine-nodeによるサーバー単体テストの記述

サーバサイドの単体テストはjasmine-nodeで記述するといい。
https://github.com/mhevery/jasmine-node

--junitreportと--outputfolderオプションを用いることでjunitの形式でXMLを出力できる。
これによりjenkinsでの集計が可能になる。


jasmine1.3とjs-test-driverによるクライアントサイドの自動化

クライアントサイドの処理は厄介だ。
なぜなら、同じテストを異なるブラウザで確認しないといけない。

これはjs-test-driverとjasmine1.3とjasmine-jstd-adapterを組み合わせることで実現可能だ。
http://www.atmarkit.co.jp/ait/articles/1301/21/news017_4.html

jasmineは現在2.0も存在するが、js-test-driverと組み合わせて使うには1.3である必要がある。
これにより、サーバーサイドと同じテストコードの書き方でクライアントも記述できる。


seleniumによるUIテストの自動化

seleniumを用いることで、UIのテストが自動化できる。
ただし、これは導入コストと維持コストが極めて高いので、ここぞという時だけに絞ること。

http://www.atmarkit.co.jp/ait/articles/0908/19/news109.html


[PR]
# by mima_ita | 2014-06-01 18:23 | node.js



実験ですお
検索
カテゴリ
最新の記事
.NET4.5におけるasy..
at 2014-07-02 00:46
.NETでTwitterを検..
at 2014-06-29 00:49
Redmineのプラグインで..
at 2014-06-28 03:29
IO.popenのwrite..
at 2014-06-28 03:25
RedmineのWikiでU..
at 2014-06-28 03:16
以前の記事
最新のトラックバック
その他のジャンル
ブログパーツ