Technote

by sizuhiko

PHPのスペックフレームワーク

<!– more –>

PHPでのBDDについては、何度か取り上げてきましたがほとんどがストーリフレームワークであるBehatについてで、スペックフレームワークについてはあまりふれてきませんでした。せっかく今回はPHPカンファレンス関西のLTで2種類のBDDフレームワークについて話したので、スペックフレームワークについてまとめてみたいと思います。

最初にたどり着くのはPHPSpec

LTのスライドでも紹介したのはPHPといえばまず最初に思いつく PHPSpec です。大抵はまず「言語プレフィクス+Spec」で検索してみますよね。PHPはユニットテストがPHPUnitだからPHPSpecだよね、と誰もが連想できます。

で、PHPSpecの書き方としては、

class DescribeNewBowlingGame extends PHPSpecContext {  
    private $_bowling = null;  
    public function before() {  
        $this->_bowling = $this->spec(new Bowling);  
    }  
    public function itShouldScore0ForGutterGame() {  
        for ($i=1; $i<=20; $i++) {  
            // someone is really bad at bowling!  
            $this->_bowling->hit(0);  
        }  
        $this->_bowling->score->should->equal(0);  
    }  
}  

のように、まぁPHPのコードだとすれば読むのはそれほど困難ではないわけですが、やっぱりSpec(仕様)という視点で眺めると、ちょっと無駄な記述が目立ちますよね。それは言語の文法だからしょうがない、そうなんですが。

その他のスペックフレームワーク

で、試しにGitHubで他にないのかと探すと、意外とスペックフレームワークがある事に気がつきました。

名前所感

PHPSpec 最初に出てくる有名どころ

pecs JSpecに影響を受けている。しばらくメンテされていない…

spectrum まだα版でドキュメントもロシア語しかないが、設計の筋が良くいろいろできそう。今後に期待

speciphy yuya-takeyamaさん(@yuya_takeyama)がRspecに影響を受けて作成。subjectが使える。コアはPHPSpecを利用している

Spec for PHP Hamcrestライブラリとtokengetall関数を使って、自然に英語として読める文章として記述が可能。解析した結果をPHPUnitのテストケースとして生成して実行している

以下のコードは、Speciphy を例にPHPSpec以外でどのように書けるかをあらわしています。pecsもspectrumもほぼ同じような記述になります。

namespace SpeciphyDSL;
return
describe('Bowling',
    describe('->score',
        context('all gutter game',
            subject(function () {
                $bowling = new Bowling;
                for ($i = 1; $i <= 20; $i++) {
                    $bowling->hit(0);
                }
                return $bowling;
            }),
            it('should equal 0', function ($bowling) {
                $bowling->score->should->equal(0);
            })
        )
    )
);

だいぶ読みやすくなりました。ではRSpecと比較してみま….す?えっ、やっちゃうの、それは….

describe Bowling, "#score" do
  it "returns 0 for all gutter game" do
    bowling = Bowling.new
    20.times { bowling.hit(0) }
    bowling.score.should eq(0)
  end
end

こんな感じです。subjectやcontext使っている違いとかありますが、PHPの場合はどうしても無名関数を使うのに

function () {…}

を使わなくてはならないので、そこが惜しいのです。

変態PHPスペックフレームワーク Spec for PHP

そこで Spec for PHP ということなのですが、こいつはだいぶ変態です(ごめんなさい。良い意味です)。まず先程紹介したような funcition(){ … } の無名関数で書いたような記法も使えます。それはほぼ同じように書く事が可能です。で、何が変態かと言うと Hamcrestライブラリとtokengetall関数を使って構文解析することで、以下のようなSpecが書けちゃいます。

describe "Bowling"
  describe "#score"
    it "returns 0 for all gutter game"
      $bowling = new Bowling;
      for ($i = 1; $i <= 20; $i++) {
        $bowling->hit(0);
      }
      $bowling->score should equal 0
    end
  end
end

it ブロックの内容は、Hamcrestを使って$bowling->score should equal 0 のように書いていますが、基本的にはPHPのソースコードであるとわかるでしょう。ただしdescribeやitなどの構文からはfunctionが消えて見通しが良くなっています。

では早速試してみましょう

Spec for PHP は以下の依存関係を持っています。

  • PHP 5.3
  • PHPUnit 3.5
  • Hamcrest matchers library(ベータ版のときに作成されたらしい)
  • PHP Object_Freezer 1.0.0

この記事の執筆時点で最新版の依存関係を適用すると、PHPUnitとHamcrestを利用している箇所で一部エラーになってしまいます。そこで、これらを修正し本家にPull Requestを送付しています。
このため、本家に取り込まれるまでは、私のforkリポジトリから取得することを推奨します。

https://github.com/sizuhiko/Spec-PHP

上記問題に対応するための修正と、日本語関連でPHP関数名の正規表現に x7f-xff の範囲を追加した修正が、 develop ブランチに入っていますので、こちらでお試しください。

まず必要なpearパッケージをインストールします。すでにインストール済みならスキップして構いません。

pear channel-discover pear.phpunit.de
pear install phpunit/PHPUnit
pear install phpunit/Object_Freezer
pear install Console_CommandLine

Install Hamcrest matchers library
pear channel-discover hamcrest.googlecode.com/svn/pear
pear install hamcrest/Hamcrest

つづいて、githubからcloneしてdevelopにスイッチします。

git clone git@github.com:sizuhiko/Spec-PHP.git
git checkout origin/develop -b develop

Spec for PHPはPHPUnit経由の実行方法と、Cliランナーも持っています。

  • phpunit tests/AllTests.php
  • ./spec4php.php tests

さいごに

Spec for PHP はテストコードを書いていて楽しい気分になれるような気がします。まだまだ奥がありそうなので、ちょっと追いかけてみようと思っています。また本家にPRが取り込まれたときなどに、インストール方法など更新予定です。

また、PHPのスペックフレームワークについて「もくもく会」か「勉強会」をやろうと思っていますので、こちらは@sizuhikoのTwitterなどをチェックしておいていただければと思います。

PHPカンファレンス関西2012に参加しました

<!– more –>PHPカンファレンス関西2012のため、5/11夕方から5/13昼頃まで大阪へ出かけていました。

今年は2トラックで興味深いセッションが多く、とても楽しめました。スタッフの皆様、スポンサー、並びに忍びの方々 ありがとうございます。

前夜祭では噂の無限もやしを食べられた(※1)し、懇親会や2次会、3次会ではかなり濃い技術ネタにあふれていてとても楽しかったです。あぁ、こう書くと飲みに行ったみたいに見えちゃいますね….(半分は事実ですが)

イベントでは「BDDで行こう」というLTが無事当選し、発表してきました。資料はこちら(TwileShare)です。タイミング良くこれから私が作成したCakeBehatの紹介が始まる、というところで銅鑼が鳴りまして、まぁ発表者的には美味しい流れでした www

きっかけは作れた(※2)ので、続きはWebで(GitHub) ということですね。スライドの内容とGitHubのREADMEを併せてみてもらえれば、CakeBehatが何をしているのかわかると思います。
とはいえまずはBehatを使ってもらって、その後でCakePHP使っている人はぜひ、という流れです。

それと懇親会LTが行われるということで、本編LTでも発表するので空気を読んで自重していたのですが、追加枠が出たということで14:30ぐらいの段階で申し込みました。懇親会まで3時間ぐらい、その間に本編LTもある中でスライド(TwileShare)を作成しました。内容はBlogで公開しているQueryPathの紹介と、GitHubで公開しているQPPHPのREADMEを合体したものです。これまでにLTをやったことない人でも、このように既出のBlog記事などから資料を作れば簡単にできると思います。@koyhogeさんの懇親会LTでも出てきたのですが、5分なので何があってもノリで切り抜けられる場合がほとんどです。見慣れた顔ぶれだけじゃなくて、新鮮なネタも応募してもらえるといいなぁと思います。

LTで発表したCakeBehatQPPHPについて、興味をもたれてわからないことがあれば、GitHubのissueなどでご連絡いただければと思います。

また来年のPHPカンファレンス関西が楽しみです。

それでは皆様、PHPカンファレンス(東京)とPHPMatsuri(福岡)でお会いしましょう!!

※1: もちろん有限になる場合があります。翌日3次会で行ったら終わっていたのです。。。

※2: 5分ではすべて紹介できないので、面白そうと思ってもらえたところで時間(銅鑼)になることで、Webサイトを訪問してもらえる&誤解を招かなくていいかなぁと思っていたりします。

QueryPathを使ってHTMLを操作する

<!– more –>昨年末phpQueryについて、これはいいね!と取り上げたのですが、その時点でも若干更新が止まっていたり、XHTMLの解釈が微妙だったりとかいくつか不安要因があったのですが、そんな不安を解消するjQueryインターフェースを実装したライブラリを発見しました。

それがQueryPathです。

QueryPathが当たり前に良いと思う点

  • 日本語が普通に使える
  • XHTMLが普通に使える
  • 更新されている
  • 拡張(extension)が書きやすい
  • テストコードがある
  • jQueryインターフェースがほぼ忠実に再現されている

こういう当たり前にできて欲しい事が、意外と日本語環境だとうまくできなかったりするのですが、特に意識することなくできるのは良いと思います。 もちろんmetaの文字コード指定など、ある程度ちゃんとHTMLが書かれている事は重要です。

QueryPathが独特と思う点

QueryPathは標準で5つの拡張機能(extension)を持っています。

  • QPDB : データベースへのアクセスと、検索結果をテンプレートへの差し込むことができるようになる
  • QPList:配列で渡した内容をtableタグやul、olなどに展開してHTML化できる
  • QPTPL:連想配列のキーをidやclassなどのクエリ情報と解釈して、テンプレート流し込み機能を提供する
  • QPXML:XMLを操作する拡張機能
  • QPXSL:XSLTを利用する拡張機能

独特というのは、拡張機能が簡単に実装できるので、拡張を使えばこんな事、あんな事、jQueryプラグインを書くかのように自由にできますよ、という部分に集約されると思います。

使ってみよう

インストール

QueryPathは3つの導入方法に対応しています。

  • PEARパッケージ
  • pharファイル
  • Composer

ここではpharファイルをダウンロードして始めてみます。pharファイル以外の導入方法はGitHubの公式ページを参照してください。

ダウンロードページより QueryPath-version.pharというファイルをダウンロードします。この記事時点での最新versionは2.1.2です。ダウンロードしたファイルの名前をQueryPath.pharにリネームしておきます。

サンプルHTMLの取得

前回のphpQueryと同じく、WORDPRESSの日本語TOPページのHTMLを使ってみたいと思います。

wget http://ja.wordpress.org/

phpshを使って試す

こちらも前回と同様に、簡単に試すにはインタラクティブシェルを使うのが便利なので、phpshを使います。

bash-3.2$ phpsh
Starting php
type 'h' or 'help' to see instructions & feature

php> require 'QueryPath.phar';

php> $html = htmlqp('index.html');

php> = $html->find('#blog .post .entry')->eq(0)->text()
"ntttttttttWordPress 3.3.2 が利用できるようになりました。これはすべての前バージョンへのセキュリティアップデートです。nWordPress に含まれる3つの外部ライブラリでセキュリティアップデートがありました:n    Plupload (バージョン 1.5.4)、WordPress ではメディアのアップロードに使用しています。n    SWFUpload、WordPress では以前にメディアのアップロードに使用していました。おそらくプラグインによってはまだ使われています。n    SWFObject、WordPress では以前に Flash コンテンツの埋め込みに使用していました。おそらくプラグインやテーマによってはまだ使われています。ntttttttt"

ブログエントリーの先頭記事を抜き出してみました。phpQueryは配列キーにセレクタを記述する方式だったのですが、QueryPathではPHP言語としての「->」の部分以外はjQueryと同じだとわかるでしょう。 またQueryPathにはqpというコア関数もあるのですが、こちらはXML用で、HTMLを利用する場合はhtmlqpを使っておいた方が良さそうです。

最後に

php> = $html->top()->html();

を実行すると、HTML全文を文字列として取得することができます。日本語がまったく問題ないことを確認できると思います。

※ $html->top()->innerXHTML(); ではなく、html関数でないと htmlタグとか含まれないので修正しました。(5/7)

まとめ

現時点でもHTMLの取得にはURL指定、ファイル指定など様々な対応がされており、DB連携やテンプレート機能などそのままでも結構つかえるんじゃないかと思っています。

ただ毎度DOM操作するの?とかいう部分もあるとは思うので、phpQueryっぽいPHP構文が含まれたPHPファイルを出力できるような拡張を作ってみたいなと思っています。まずは素のPHP部分から、その後でCakePHPとの連携も含んでみたいなぁという計画です。拡張名は標準のものを参考にするとQPPHP?なのかな。Pが続くと見づらいなぁ。名前は大事なので何か考えないと。。。

phpQueryを使ってデザイナーとプログラマーを完全分業できるようにする(導入編)

<!– more –>これまで多くのテンプレートエンジンが登場してきましたが、HTMLに全く手を入れないでデザイナーとプログラマーが分業することは困難でした。 もちろんSmartyのテンプレートが編集できる人がいたり、PHPTALのようにほとんどHTMLには手をつけない方法があったりと、これまでの方法でも分業することは可能だと思います。

ただHTMLには多少の手を入れなくてはいけない、そういう意味でKwartzのようにプレゼンテーションロジックを分割できるテンプレートシステムはとても良いと思っています。ただセレクターがCSS3セレクターでないのが難点かなぁと思っています。

そこで目を付けたのがphpQueryという、名前からして思い当たるjQueryのセレクター機能を搭載したPHP実装になっています。

phpQueryは内部的にPHPのDOMDocumentを使っていて、エレメントを探し出すのに便利なセレクター記法を持っています。

今回はphpQueryを使って静的HTMLの一部をPHPコードに書き換えるという導入をやってみます。

本当は時間があればViewコンポーネントまで作って、githubに展開したかったのですが、これは2012年早々の目標になる予定です。

phpQueryの取得

phpQueryは

  1. pear
  2. google-code
  3. github

のいずれかから導入可能です。この記事ではgithubから取得して進めます。

git clone git://github.com/bluelovers/phpQuery.git

サンプルHTMLの取得

この記事では、みんな大好きWORDPRESSの日本語TOPページのHTMLを使ってみたいと思います。

mkdir templates
wget http://ja.wordpress.org/
mv index.html templates

ここで注意なのですが、現在DOMDocumentではXHTMLを正しくパースできないようです。そこで、通常のHTMLとして解釈できるように先頭数行を以下のように書き換えます。

<html>
    <head>

DOCTYPEを削除し、htmlとheadにあった属性を削除しています。

ただXHTMLでなくHTML記法で書かれたページは問題ないので、この課題についてはあまり深入りせず先に進む事にします。

ただDOCTYPEや属性は、後で追加できるのでViewクラスにしたときに何かサポートできるようにしたいなぁと思っています。

の赤枠で囲った部分に関して、PHPの動的コードに変換してみましょう。

phpshを使って試す

簡単に試すにはインタラクティブシェルを使うのが便利なので、今回もphpshを使います。

bash-3.2$ phpsh
Starting php
type 'h' or 'help' to see instructions & features

php> require('phpQuery/phpQuery/phpQuery.php');
php> $file = file_get_contents('template/index.html');
php> $html = phpQuery::newDocumentHTML($file);
php> echo $html->html();

最後のhtml()で読み込んだHTMLがそのまま出力されることを確認しましょう。

ブログ記事の箇所のHTMLは以下のようになっています。

<div id="blog" class="section">
  <div class="main">
    <h3>ブログ</h3>
    <div class="post" id="post-2057">
    <h4><a href="http://ja.wordpress.org/2011/12/13/wordpress-3-3-ja/" rel="bookmark" title="WordPress 3.3 日本語版リリースのお知らせ へのパーマリンク">WordPress 3.3 日本語版リリースのお知らせ</a></h4>
    <h6>2011年12月13日</h6>
    <div class="entry">
      <p>WordPress 3.3 日本語版をリリースしました。</p>
    </div>
  </div>
  <div class="post" id="post-2042">
    <h4><a href="http://ja.wordpress.org/2011/12/13/wordpress-3-3-sonny/" rel="bookmark" title="WordPress 3.3「Sonny」 へのパーマリンク">WordPress 3.3「Sonny」</a></h4>
    <h6>2011年12月13日</h6>
    <div class="entry">
      <p>WordPress 3.3「Sonny」がご利用いただけるようになりました。</p>
    </div>
  </div>

ブログ記事は $posts という配列に入っていると仮定します。

php> $html['#blog .post:gt(0)']->remove();
php> $html['#blog .post']->wrapPHP('foreach($posts as $post) {', '}');
php> $html['#blog .post']->attrPHP('id', 'echo "post-$post->id;"');
php> $html['#blog .post h4 a']->attrPHP('href', 'echo $post->url;')->attrPHP('title', 'echo $post->title;')->php('echo $post->title;');
php> $html['#blog .post h6']->php('echo $post->date;');
php> $html['#blog .post .entry p']->php('echo $post->intro;');

php> print $html->php();                                                                                             

のようにphpshで実行すると、先ほどのHTML部分が以下のようになります。

<div id="blog" class="section">
  <div class="main">
    <h3>ブログ</h3>
    <?php  foreach($posts as $post) {  ?>
      <div class="post" id='<?php  echo "post-$post->id";  ?>'>
        <h4><a href="<?php  echo $post->url;  ?>" rel="bookmark" title="<?php  echo $post->title;  ?>"><?php  echo $post->title;  ?></a></h4>
        <h6><?php  echo $post->date;  ?></h6>
        <div class="entry">
          <p><?php  echo $post->intro;  ?></p>
        </div>
      </div>
    <?php  }  ?>
  </div>

どうです?

jQueryで見慣れたセレクタ記述と、少しのphpQueryの拡張記述で、HTMLを直接変更することなくPHPコードを含んだテンプレートファイルに変換することができました。

phpQueryが用意しているjQueryポートしたセレクタや、PHPコードを出力する拡張関数は、google-codeの公式ページを参照するとわかります。

さいごに

最初にHTMLファイルを読み込む部分や、最後にphp()関数を使ってPHPを含むコードに変換する部分をモジュール化して、各フレームワーク向けのViewコンポーネントとして提供したいなぁと思っています。

ただ普段使っているのがCakePHPばかりなので、他のフレームワークについてわかる人に協力してもらえたらなぁと思っています。

またViewコンポーネントにする際はQueryTemplatesというphpQueryを拡張したコードも使おうかなぁと思っています。

CakeBehat の master を CakePHP2.0 対応に切り替えました。Seleniumによるテストも簡単に。

CakeBehat for CakePHP2.0

PHPMatsuri 2011 で完了させた CakePHP2.0 対応ですが、しばらく 2.0 ブランチで開発バージョンとして扱っていたものを最新のCakePHP,Behat,Minkで動作確認してmasterに昇格させました。

https://github.com/sizuhiko/CakeBehat

はじめに

CakeBehatはCakePHPからBehatを呼び出してテストするためのプラグインです。CakePHP1.3対応として公開したのが2011年6月投稿です。

http://my.opera.com/sizuhiko/blog/2011/06/20/cakephp-behat

インストール

前提事項

  1. gitが利用可能なこと
  2. PHPUnitがインストールされていること
  3. CakePHP2.0.xがインストールされていること
  4. MySQLなどデータベースがインストールされていて、テスト用データベースが準備されていること

導入

CakePHPのルートディレクトリへ移動して、以下のコマンドを実行してください。

cd plugins
git clone git@github.com:sizuhiko/CakeBehat.git
cd ..

すると、plugins 配下に CakeBehat のディレクトリができているはずです。CakeBehatプラグインを有効にするためにbootstrapでプラグインの読み込みを行います。

app/Config/bootstrap.phpの最後に追加します。
....

CakePlugin::load('CakeBehat');

次に、CakeBehatで必要なBehatやMinkをダウンロードし、featues を初期化します。CakePHPのルートディレクトリに移動して、以下のコマンドを実行します。

lib/Cake/Console/cake CakeBehat.init

するとCakePHPのルートディレクトリに featues ディレクトリができているはずです。 その他にplugins/CakeBehat/Console/Command の下に behat.phar と mink.phar がダウンロードされます。

環境設定

Behat/Mink環境設定

app/Config/behat.yml がinitコマンドによって生成されています。

5行目に

base_url: http://test.localhost:8888/application-name/

という設定があります。これはアプリケーションのルートパスを設定するもので、ホスト名、ポート番号、アプリケーション名などを指定します。ホスト名はできるだけtest環境と識別可能なものにしておく事がオススメです。

実行する

基本的な環境設定は、ここまでで、behatは実行可能な状況になっています。 具体的にサンプルアプリケーションのコードを使っての解説は、以前のPostと同じなので、以下のURLから確認してください。

http://my.opera.com/sizuhiko/blog/2011/06/20/cakephp-behat

ただし実行コマンドがプラグイン化に伴って変更されています。プラグイン名が付いたので、cake behat というシンプルなものからは少し遠くなってしまいましたが、以下のコマンドを実行してください。

lib/Cake/Console/cake CakeBehat.bdd

Ajaxを利用したページをテストしたい

最新版のMinkでは、Ajaxを使ったページをテストできるように、ブラウザエンジンを選択することができるようになっています。

  1. GoutteDriver : Ajaxは使えないがライトなブラウザテストが可能
  2. SahiDriver:ブラウザのプロキシ設定が必要だが、様々なブラウザでテストが可能
  3. ZombieDriver:Node.js を使ったブラウザテストが可能
  4. SeleniumDriver:Mink1.2 からサポートされた、お馴染みのSeleniumによるテストが可能

公式のBehatやMinkのドキュメントを参照すると、Seleniumなどを使う場合の方法が書いていませんコードを書いて初期化しないといけませんが、Behat+Minkのインテグレーションでは、behat.ymlに設定するだけで簡単にSeleniumによるテストが実行できるようになります。

JavaScriptセッションエンジンを指定する

CakeBehatではデフォルトのJavaScriptセッションエンジンをSeleniumとしています。app/Config/behat.yml の 4行目に

javascript_session:   selenium

設定を入れてあります。まだ試していませんが、sahiやzombieを使う場合はこの設定を変更すれば動作するはずです。

JavaScriptを使ったページをテストしたいシナリオでは

@javascript アノテーションをfeatureに指定します。

サンプルアプリケーション(blogチュートリアル)のindex.ctpでDeleteボタンがクリックされたときにtrエレメントを消すだけの実装を追加してみました。app/View/Posts/index.ctp

<td><a href="javascript:void(0);" onclick="$(this).closest('tr').remove();">Delete<?php echo $index++; ?></a>

のようにしました。

このリンク「Delete3」をクリックして3行目を削除するfeatureを書きます。

  @javascript
  シナリオ: 記事を削除できること
    前提 "トップページ" を表示している
    かつ "Title strikes back" と表示されていること
    もし "Delete3" のリンク先へ移動する
    ならば "Title strikes back" と表示されていないこと

「リンクをクリックする」みたいなステップへ書き換えた方が本当は直感的なのですが、とりあえず「リンク先へ移動する」を使っています。

後は、Seleniumを実行しておくだけです。

java -jar selenium-server-standalone-2.14.0.jar 

これだけです。特にSeleniumを使うと意識しなくても、@javascriptを付けたシナリオだけでFirefoxが起動してテストが実行されます。もちろんこのJavaScriptを使ったテストも成功します。

さいごに

BehatやMinkは少しのバージョンアップ違いでうまく動かないケースがあります。もしCakeBehatを使ってうまく動作しないケースなどはgithubのissueなどに書き込んでいただければ、改善していきたいと思っていますのでよろしくお願いします。