Top Banner
テスト駆動ゲーム開発を JavaScriptで実践 in JsCafe20 竹内 佑介
33

テスト駆動ゲーム開発をJava scriptで実践 in jscafe20

May 31, 2015

Download

Documents

Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
Page 1: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テスト駆動ゲーム開発をJavaScriptで実践

in JsCafe20

!

竹内 佑介

Page 2: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

自己紹介

竹内 佑介

仕事でソフト開発やってます

趣味で通信対戦ゲームを作ってます

Page 3: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

さっそくですが

こんなゲーム作ってます

Page 4: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

機動倶楽部Gブレイバー

Page 5: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

ジャンルは対戦型PRGです

詳細はこちらですhttp://www.slideshare.net/yuusuketakeuchi96/g-33989023

Page 6: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テスト駆動とは?

テスト失敗

テスト成功リファクタリング

Page 7: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのテスト状況について説明します

Page 8: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

サーバ クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

Gブレイバーシステム構成

ゲームロジック

Page 9: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

サーバ クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

Gブレイバーシステム構成

ゲームロジック ユニットテストスタブと!半自動テスト

ユニットテスト

Page 10: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

今日はゲーム画面テストの話をします

Page 11: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードの構成

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

Page 12: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードの構成

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

JSONでダミーを作る

Page 13: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードの構成

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

送信オブジェクトにアサーションをかける

Page 14: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードの構成

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

ボタン押下コールバックを直接呼ぶ

Page 15: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードの構成

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

ここは目視で確認

Page 16: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードの構成

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

フレーム制御はtimeLineを活用

Page 17: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

実際のテストコードはここ

https://github.com/kaidouji85/gbraver/blob/master/publicForTest/javascripts/playerAtackTest.js

Page 18: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

画面半自動テストのデモ

https://www.youtube.com/watch?v=NmaJuNIGKw4

Page 19: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのコード

https://github.com/kaidouji85/gbraver

Page 20: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

中の人のブログ

毎日プログラム

http://blog.livedoor.jp/kaidouji85/

Page 21: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

timeLineについて

Page 22: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

ご清聴ありがとう

ございました

Page 23: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

おまけ

スタブについて

Page 24: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのスタブ

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

Page 25: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのスタブ

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

テストコードを同じものを作る

Page 26: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのスタブ

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

テストコードを同じものを作る

一般的なテストコードと書き方は同じ

ー>ここを作るのは楽

Page 27: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのスタブ

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

手動で実施

Page 28: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

Gブレイバーのスタブ

クライアント

コマンド入力コマンド送信

ゲーム結果送信 ゲーム結果表示

手動で実施

Page 29: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコードを作る前にスタブを作ってます

Page 30: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

ぶっちゃけ、スタブをテストコードに流用してます

Page 31: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

スタブ

Page 32: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

スタブ コマンド入力自動

追加

Page 33: テスト駆動ゲーム開発をJava scriptで実践  in jscafe20

テストコード

スタブ コマンド入力自動