bootcampとは

macでwindowsが動くアレでもなく、マッチョな黒人に励まされながら踊るアレでもなく sassのfunctionをテストするためのフレームワーク。

もともとジャスミンというJavascriptのBDDテスト用のフレームワークがあり、その書き方でsassのfunctionをテストできるようにしたものらしい

さらに大本はRubyのRSpec

実際見てみる

数値から単位をとりのぞくhoge()というfunctionを例にするとこんな具合
仕様を書くようにテストケースを書いていける

テストスイート(sass)

@include describe("hogeは") {
	@include it("数値から単位を取り除く") {
		@include should( expect( hoge(12px) ),	to( equal(12) )  );
		@include should( expect( hoge(0.5em) ),	to( equal(0.5) )  );
	}
	@include it("数値以外ならflaseを返す") {
		@include should( expect( hoge(piyo) ),	to( be-falsy()));
		@include should( expect( hoge(#ccc) ),	to( be-falsy()));
	}
}

テスト結果(css)

hogeは 数値から単位を取り除く {
 ✔: Expected 12px to equal 12;
  ✔: Expected 0.5em to equal 0.5;
  Test: Passed;
}
hogeは 数値以外ならflaseを返す {
  ✔: Expected piyo to be 'falsy';
  ✔: Expected #ccc to be 'falsy';
  Test: Passed;
}
Test Results {
  Success: true;
  Stats:  ✔ ✔ ;
  Tests: 2;
  Asserts: 4;
  Passed: 2;
  Failed: 0;
  Skipped: 0;
}

解説

@include describe("hogeは") {
@include it("数値から単位を取り除く") {

↑はそのテストの説明

@include should( expect( {テストしたい関数} ),	to( {期待する結果} ));

↑がテストの肝

{テストしたい関数} では、関数と必要なら引数を指定
{期待する結果} では、予め用意されているmatcher（マッチャ）と呼ばれる条件式みたいなものを使って結果を定義する

マッチャがto( equal(12) )なら、12が返ってきた場合そのテストは成功になる。

ほかにも
nullを期待する to(be-null())
trueを期待する to(be-truthy())
string型を期待する　to(have-type-of(string))とか、
また、toをnot-toにすることで"その条件に一致しない場合"を期待したりとか
いろいろ用意されてる

インストール

インストール方法いろいろあるけどbootcamp自体はライブラリ非依存でsassが動く環境さえあれば動く

ここからコードをダウンロード。

プロジェクトのsassディレクトリ下にtestディレクトリを作り、そのなかに更にbootcampとかディレクトリ作って、さきほどダウンロードしたファイルの中にあるdist以下をコピー。

さらにbootcampと並列にテストケースを入れるsecsディレクトリと、tests.scssを作る。

プロジェクトルート
┗ sass
  ┗ tests
    ┗ bootcamp
      ┗ core
      ┗ matchers
      ┗ utils
      ┗ _bootcamp.scss
      ┗ bootcamp.coffee
    ┗ specs
      ┗ _hoge.scss
    ┗ tests.scss
  ┗ プロジェクトのsassファイル

/specs以下に置かれたテストケースを tests.scssまとめてを読み込んで実行する

テスト結果はtests.scssとして出力される

tests.scss

@import "{テストしたいfunctionが書いてあるscss}";
@import "bootcamp/_bootcamp";

$bc-setting-verbose:  true;
$bc-setting-warnings: true;

@include runner-start;
@import "specs/hoge";
@include runner-end;

/specs/hoge.scss

@include describe("hogeは") {
	@include it("数値から単位を取り除く") {
		@include should( expect( hoge(12px) ),	to( equal(12) )  );
		@include should( expect( hoge(0.5em) ),	to( equal(0.5) )  );
	}
	@include it("数値以外ならflaseを返す") {
		@include should( expect( hoge(piyo) ),	to( be-falsy()));
		@include should( expect( hoge(#ccc) ),	to( be-falsy()));
	}
}

これでsassを実行すれば、テスト結果のCSSが出力される。 CSSの出力場所はどこでもいい

注意

要sass3.3

公式サイトのインストールとかサンプルには、mixin名に古いバージョンのものが残っていたりするので、コピーしてもエラーでる

サンプル

grunt使ってるならこちらをクローンすると確実に動きます。ありがとうげこたん。

BDDってなに

詳しくは知りません
以下はかいつまんで調べた結果たぶんこういうものかな？という内容なので勘違い等あると思います

＿人人人人人人人人人人人人人＿
＞　洋子のはなしは信じるな　＜
￣Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y^Y￣

もともとTDD（テスト駆動開発）があって、その問題点を解決するために発展させたものがBDD（ビヘイビア駆動開発）

「これから作成しようとするプログラムに期待される「振る舞い」や「制約条件」、つまり「要求仕様」に近い形で、自然言語を併記しながらテストコードを記述する」@wikipedia

「この関数は◯◯を◯◯する」とか、このテストがどんな動きをしてをどんな結果を確認するためのものなのかとか、そういったコメント的なものをテスト自体に組み込んでいくみたい。

細かいテストを繰り返すTDDもいいけど
テスト同士の関係とか、そのテストがどういう意図で作られたかわからなくなったりするけど BDDなら解決できるかも

こことか読んだほうが正確だと思います

azusa-tomita/bootcamp.md