×
Copy
Open
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
プラグインで開発 at 秋のお茶会 #wbehime
Slide 2
Slide 2 text
参考書
Slide 3
Slide 3 text
WordPress 1. コンテンツ管理 -> WordPress の基本機能 2. デザインのカスタマイズ -> テーマ制作で対応 3. 機能追加 -> 独自プラグインで対応
Slide 4
Slide 4 text
Plugin Handbook goo.gl/XK0sRI
Slide 5
Slide 5 text
Plugin 作成で最低限必要なもの plugins$ mkdir sfd-handbook sfd-handbook$ vi sfd-handbook.php
Slide 6
Slide 6 text
テストコードを書こう 参考までに、昨年の Coderetreat "Global Day of Coderetreat 2014 in Matsuyama" agile459.doorkeeper.jp/events/16066 ペア（ 2 人一組）でプログラムの問 題を TDD で解くトレーニングのイ ベント。世界同時（同日）開催。
Slide 7
Slide 7 text
TDD のメリット ワンアクション (phpunit 実行 ) で、 一連の動作確認ができます。 ブラウザで所定のページを開いて動 作確認して、でも別のページが壊れ ていて ... 、のようなデバッグ作業が 格段に効率化できます。
Slide 8
Slide 8 text
テスト駆動開発の参考記事 WP-CLI+PHPUnit を使った WordPress プラグインのユニットテスト（１） https://firegoby.jp/archives/5498 WP-CLI+PHPUnit を使った WordPress プラグインのユニットテスト（２） https://firegoby.jp/archives/5511
Slide 9
Slide 9 text
環境が整っている前提で ... 仮想環境（べいぐらんと）を起動 $ vagrant up 仮想環境に ssh で入る $ vagrant ssh wordpress ディレクトリへ移動 $ cd /var/www/wordpress WP-CLI でプラグインのひな形を生成 $ wp scaffold plugin my-counter
Slide 10
Slide 10 text
自動生成されたフォルダ
Slide 11
Slide 11 text
PHPUnit 用の WordPress 環境準備 プラグインのディレクトリに移動 $ cd $(wp plugin path --dir my-counter) テスト用 WordPress 環境を作成 $ bash bin/install-wp-tests.sh wordpress_test root 'wordpress' localhost latest mysqladmin: CREATE DATABASE failed; error: 'Can't create database 'wordpress_test'; database exists' (テスト用DBはすでに作られている様子。)
Slide 12
Slide 12 text
PHPUnit を実行してみる
Slide 13
Slide 13 text
自動生成されたテストコード プラグインフォルダ内の test/test-sample.php assertTrue( true ); } }
Slide 14
Slide 14 text
テスト用のクラスを追加 $ touch tests/test-my-counter.php ショートコードを実行すると０が返る assertEquals('0', $count); } }
Slide 15
Slide 15 text
テストを実行 - 失敗 $ phpunit
Slide 16
Slide 16 text
shortcode の処理を実装 class MyCounter { public function __construct() { add_shortcode( 'my_counter', array( $this, 'mycounter_shortcode' )); } public function mycounter_shortcode($p) { return '0'; } }
Slide 17
Slide 17 text
テストを実行 - 成功 $ phpunit
Slide 18
Slide 18 text
プラグインを有効にして、
Slide 19
Slide 19 text
Widget に設置してみる
Slide 20
Slide 20 text
プラグインのテスト駆動開発 表示されない ...
Slide 21
Slide 21 text
Widget でショートコードを使う フィルターが必要でした。 class MyCounterTest extends WP_UnitTestCase { function test_my_counter_shortcode() { $count = do_shortcode( '[my_counter]' ); $this->assertEquals('0', $count); $this->assertTrue( has_filter('widget_text', 'do_shortcode') ); } }
Slide 22
Slide 22 text
Widget でショートコードを使う テスト実行。
Slide 23
Slide 23 text
Widget でショートコードを使う フィルターを追加。 class MyCounter { public function __construct() { add_shortcode( 'my_counter', array( $this, 'mycounter_shortcode' )); add_filter('widget_text', 'do_shortcode' ); } ...
Slide 24
Slide 24 text
Widget でショートコードを使う Widget に表示できた。
Slide 25
Slide 25 text
カウントアップ class MyCounterTest extends WP_UnitTestCase { ... function test_counter_increment() { $cnt0 = do_shortcode( '[my_counter]' ); $cnt1 = do_shortcode( '[my_counter]' ); $this->assertEquals( $cnt1, $cnt0 + 1 ); } ... カウントアップのテストコード追加。
Slide 26
Slide 26 text
カウントアップのテスト実行 未実装なのでエラー（ 0 のまま）
Slide 27
Slide 27 text
カウントアップを実装 class MyCounter { ... public function mycounter_shortcode($p) { $count = get_option( 'my_counter' ) + 1; update_option( 'my_counter', $count ); return $count; } ... 今回は WordPress のオプション値を利用。
Slide 28
Slide 28 text
カウントアップのテスト実行 カウントアップできた。
Slide 29
Slide 29 text
続きはデモにて。
Slide 30
Slide 30 text
参考資料 Testing Added Hooks http://goo.gl/I2VySn 関数リファレンス /add_filter https://goo.gl/McBgYS